It works if you use the numbers as numbers and not as strings:
data.forEach(function(d) { d.close = +d.close; });
Complete example here.
Question
I have the following line chart: http://jsfiddle.net/cp3fV/2/
var data = [
{
"days_to_expiry": 0,
"close": "7.1120000000"
},
{
"days_to_expiry": 1,
"close": "8.4580000000"
},
{
"days_to_expiry": 2,
"close": "7.2830000000"
},
{
"days_to_expiry": 3,
"close": "12.2820000000"
},
{
"days_to_expiry": 4,
"close": "7.1820000000"
}
]
nv.addGraph(function() {
var chart = nv.models.lineChart()
.margin({left: 100, right:50})
.useInteractiveGuideline(true)
.transitionDuration(350)
.showLegend(false)
.showYAxis(true)
.showXAxis(true)
//.forceY([0, 19])
.y(function (d) { return d.close })
.x(function (d) { return d.days_to_expiry })
;
console.log(data);
chart.xAxis
.axisLabel('Date')
.ticks(10);
chart.yAxis
.axisLabel('Close')
.tickFormat(d3.format('.03f'));
var testData = [{key:"Test", color: '#2ca02c', values: data}];
d3.select('#chart svg')
.datum(testData)
.call(chart);
nv.utils.windowResize(function() { chart.update() }); // Update on resize
return chart;
});
I just want to order the Y axis from minimum to maximum. It works fine if all the values are <10
I know I can use forceY(min, max) but I don't want to calculate the minimum every time(I'm planning to use AJAX to update the chart)
Solution
It works if you use the numbers as numbers and not as strings:
data.forEach(function(d) { d.close = +d.close; });
Complete example here.