Question

我在nvd3饼图上遇到了一些问题。我试过这个例子：

Example http://jsfiddle.net/shabeer90/30rm9qk7/

我已将nv.d3.min和nv.d3.css添加到我的应用程序中。这个例子看起来不错，但有两个问题。

1）没有显示工具提示。此外，工具提示的内容不会添加到DOM中。

2）点击图例不过滤。什么都没发生。

我做错了什么？也许缺少.js？

这是我的代码：

    private native void createTestPieChart()/*-{
    function pieSectorData() {
        return [ {
            "key" : "Technology",
            y : 298.85,
            "symbols" : "DOV",
            "color" : "#3182bd",
        },

        {
            "key" : "Health Care",
            y : 477.80,
            "symbols" : "JNJ",
            "color" : "#6baed6",
        },

        {
            "key" : "Consumer Services",
            y : 485.65,
            "symbols" : "MCD",
            "color" : "#9ecae1",
        },

        {
            "key" : "Energy",
            y : 739.45,
            "symbols" : "XOM, CVX",
            "color" : "#A52A2A",
        } ];
    }

    //Regular pie chart example
    $wnd.nv.addGraph(function() {
        var chart = $wnd.nv.models.pieChart().x(function(d) {
            return d.key
        }).y(function(d) {
            return d.y
        }).showLabels(true).color(function(d) {
            return d.color;
        }).showLegend(true);

        chart.tooltip.keyFormatter(function(d, i) {
            var symbol = '';
            pieSectorData().forEach(function(entry) {
                // Search data for key and return the symbols
                if (entry.key == d) {
                    symbol = entry.symbols
                }
            });
            return d + '(' + symbol + ')'
        });

        $wnd.d3.select("#piechart svg").datum(pieSectorData()).transition()
                .duration(350).call(chart);

        return chart;
    });

}-*/;

提前谢谢。

NVD3 PieChart工具提示未显示

0 个答案: