我有以下图表配置:
nv.addGraph(function() {
var chart = nv.models.cumulativeLineChart()
.x(function(d) { return d.x.getTime() })
.y(function(d) { return d.y })
.color(d3.scale.category10().range());
chart.xAxis
.axisLabel('Período')
.tickFormat(function(d) {
return d3.time.format("%m/%y")(new Date(d));
});
chart.yAxis
.axisLabel('Rentabilidade')
.tickFormat(function(d) {
return (d * 100).toFixed(2) + '%';
});
d3.select('#profitability-chart')
.datum(data)
.transition().duration(500)
.call(chart);
return chart;
});
问题是图表中的每个最后一点都显示了不同的格式化y
值。例如:
图表上的行“Foo”:
- 最后一点显示“36%”
- 检查
data
数组,
- y = 1.7205607426554128
- display.y = 0.3602803713277064
Here是一个数据样本。
我不知道 display.y 的来源,以及如何计算此值。我认为d3.format
正在改变真正的价值,所以我已经切换到手动tickFormat,但问题仍然存在。
PS:我也在使用angular.js。
答案 0 :(得分:0)
Lars Kotthoff在评论中回答。基本上,我用这种方式构建我的数据:
{
"key": "Fund 1",
"values": [
{
"x": "1999-11-05T02:00:00.000Z",
"y": 1
},
{
"x": "1999-11-13T02:00:00.000Z",
"y": 1.00342088549313
},
...
]
}
基本上,我的y
值是实际百分比,除以第一个值(第一个值为1的原因)。
真正应该做的是给图表提供绝对值,例如:
{
"key": "Fund 1",
"values": [
{
"x": "1999-11-05T02:00:00.000Z",
"y": 120045.21
},
{
"x": "1999-11-13T02:00:00.000Z",
"y": 32521.01
},
...
]
}
NVD3将计算所有百分比。