Currently exploring D3 and experimenting with creating a multi-line graph without utilizing CSV, TSV, or similar data formats.
The key focus is on iterating over an array of datasets (which are arrays of objects {data:blah, price:bleh}).
I am trying to append each dataset to the inner SVG space.
Encountering an issue where after the first dataset, subsequent datasets extend far out to the right of the SVG container instead of staying within the designated space. https://i.sstatic.net/bMVnI.png
Several functions are implemented for managing these randomly generated datasets. The libraries used include momentjs, underscorejs, and d3js.
var margin, width, height, parseDate, xScale, yScale, xAxis, yAxis, valueLine, nextDay,
dataSet1, dataSet2, dataSet3, dataSet4, innerSpace;
function tlate(x, y){return 'translate(' + x + ',' + y + ')';}
... [remaining code snipped] ...
})