我正在使用 NVD3.js 来显示多线图表。
我希望 yAxis 显示为 2 个十进制数
编辑过的答案
var chart;
nv.addGraph(function () {
chart = nv.models.lineChart()
.options({
margin: { left: 140, bottom: 50 },
x: function (d, i) {
return i;
},
showXAxis: true,
showYAxis: true,
transitionDuration: 250,
tooltips: true,
tooltipContent: function (key, x, y, e, graph) {
return '<h3>' + key + '</h3>' +
'<p>' + e.point.y + ' at ' + x + '</p>'
}
});
// chart sub-models (ie. xAxis, yAxis, etc) when accessed directly, return themselves, not the parent chart, so need to chain separately
chart.xAxis
.axisLabel("Maturity")
.tickFormat(function(d) { return pivotedData[0].values[d].x; });
chart.yAxis
.axisLabel('Model Spread').tickFormat(d3.format(',.2f'));
d3.select('#chart1 svg')
.datum(pivotedData)
.call(chart);
//TODO: Figure out a good way to do this automatically
nv.utils.windowResize(chart.update);
chart.dispatch.on('stateChange', function (e) { nv.log('New State:', JSON.stringify(e)); });
return chart;
});
但是在工具提示中我想显示到小数点后 12 位。
这可能吗?
最佳答案
您可以通过图表对象的.tooltipContent
来设置调用以格式化工具提示内容的函数。默认函数定义如下。
tooltip = function(key, x, y, e, graph) {
return '<h3>' + key + '</h3>' +
'<p>' + y + ' at ' + x + '</p>'
}
您可以根据自己的喜好在其中格式化 y
的值。请注意,y
定义为
yAxis.tickFormat()(lines.y()(e.point, e.pointIndex))
这意味着轴的刻度格式会影响它,所以为了在那里实现更高的精度,您需要直接获取值——lines
可以通过 访问图表.lines
.
关于javascript - NVD3.js y轴和tooltip精度不同,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19424344/