Din*_*esh 3 javascript tooltip scatter-plot d3.js nvd3.js
我正在使用nvd3 Scatter Chart,我看到可以使用以下功能自定义工具提示内容.
chart.tooltipContent(function (key, x, y, e, graph) {
return '<p><strong>' + key + '</strong></p>' +
'<p>' + e.value + ' in the month ' + x + '</p>';
});
Run Code Online (Sandbox Code Playgroud)
当鼠标在气泡上移动时,会突出显示/显示自定义工具提示内容以及点/气泡的x值和y值.我想显示自定义内容,而不是显示x轴标签.我怎样才能做到这一点?
谢谢,
Ros*_*oss 12
chart.tooltipContent
现在在nvd3中已弃用.要在工具提示中使用自定义内容,您需要使用
chart.tooltip.contentGenerator(function(obj) {code to build tooltip})
Run Code Online (Sandbox Code Playgroud)
要查看您在函数中使用哪些数据,请首先添加以下行:
chart.tooltip.contentGenerator(function (obj) { return JSON.stringify(obj)})
Run Code Online (Sandbox Code Playgroud)
然后你就可以将鼠标悬停在数据点上并查看你正在使用的对象.
在src/tooltip.js中查看用于contentGenerator的默认函数,从第76行开始,查看您可以构建并传递给contentGenerator的函数类型的一个很好的示例
以下是文档文档中的相关部分