0

我正在使用 nvd3 图表库在我们的应用程序中显示报告。我尝试使用 nvd3 库显示条形图..除了工具提示之外一切正常。我没有在鼠标悬停功能中获得工具提示。我不知道在哪里出错了。请帮我解决这个问题。脚本在下面提供,

function BarChart(chartData, chartid) {
    var seriesOptions = [];

    for (var i = 0; i < chartData.length; i++) {
       seriesOptions[i] = {
                key: chartData[i].Name,
                values: eval("[" + chartData[i].Value + "]")
            };
    }

    nv.addGraph(function () {

        var chart = nv.models.multiBarChart().color(d3.scale.category10().range());

        chart.xAxis.tickFormat(d3.format(',.2f'));
        chart.yAxis.tickFormat(d3.format(',.2f'));        

        d3.select('#chartcontainer1 svg')
              .datum(seriesOptions)
              .transition()
              .call(chart);
        nv.utils.windowResize(chart.update);
        return chart;
    });

}
4

2 回答 2

1

您可以通过调用工具提示函数来调用(和个性化)工具提示,如下所示:

chart.tooltip(function (key, x, y, e, graph) {
       return '<p><strong>' + key + '</strong></p>' +
       '<p>' + y + ' in the month ' + x + '</p>';
});

在您的示例中,您可以在该行之前插入它return chart;

于 2013-08-23T12:39:18.023 回答
0

我对 lineWithFocusChart 也有类似的问题,我的问题是我使用 Bower 安装的库不适用于工具提示。一旦我链接到 nvd3 的实时示例中给出的库,它就起作用了。

<link rel="stylesheet" href="http://nvd3.org/src/nv.d3.css">

<script src="http://nvd3.org/js/lib/jquery.min.js"></script>
<script src="http://nvd3.org/lib/d3.v2.js"></script>
<script src="http://nvd3.org/nv.d3.js"></script>
于 2013-11-28T22:54:45.190 回答