Working original Plunkr: http://plnkr.co/edit/nHSMF2?p=preview
My forked Plunkr: http://plnkr.co/edit/4Ecqif?p=preview
I'm playing with the Angular-nvd3 charting lib. Here is their original multiChart example with several line and area graphs. I forked it and reduced the graphs to just 3 (2 areas, 1 line) as you can see in the top link.
In their original example they used a function to randomly generate the data points, in my customized fork I removed that function and hard coded the graph objects. I don't see any errors, so unsure as to why my chart isn't getting rendered.
Any thoughts?
My hardcoded graph objects used in this broken Plunkr:
vs.area1 = {
key: 'Area1',
color: '#7DD0FA',
type: 'area',
values: [
{
key: "Area1",
index: 0,
series: 0,
x: 0,
y: 0.1562513777302181
},
{
key: "Area1",
index: 1,
series: 0,
x: 1,
y: 0.11389363298669228
},
{
key: "Area1",
index: 2,
series: 0,
x: 2,
y: 0.15284344328948302
}
]
}
vs.area2 = {
key: 'Area2',
color: '#FDE18D',
type: 'area',
values: [
{
key: "Area2",
index: 0,
series: 0,
x: 0,
y: 0.3968682840613851
},
{
key: "Area2",
index: 1,
series: 0,
x: 1,
y: 1.090475660012667
},
{
key: "Area2",
index: 2,
series: 1,
x: 2,
y: 2.5868011025351163
}
]
}
vs.line1 = {
key: 'Line1',
color: '#4C73FF',
type: 'line',
values: [
{
series: 0,
x: 0,
y: 0.10572488375599604
},
{
series: 0,
x: 1,
y: 0.10572488375599604
},
{
series: 0,
x: 2,
y: 0.11166720592377402
}
]
}
var myData = [];
myData.push(vs.area1);
myData.push(vs.area2);
myData.push(vs.line1);
vs.data = generateData();
// vs.data = myData;
console.log('vs.data',vs.data);
I'm gone over my data and carefully compared it to the dynamic data. And matched it key for key, yet my chart still isn't displaying :(
On the left is my hardcoded version | on the right is the working dynamic data: