Question

我想使用Highcharts创建一个饼图。该系列的类别和数据来自两个java数组。但该图表并未绘制。将两个静态数组传递给jsfiddle中的类别和数据绘制图表。

我尝试将java数组转换为字符串并使用Highcharts how to use JavaScript variable as series data source?中给出的解决方案。但它没有用。

有人可以找出错误是什么。

    $(function () {
        var chart;

        $(document).ready(function () {

            var names = document.getElementById("listofnames").value;
            var datas = document.getElementById("listofdata").value;

            var c = names.split(",");
            var d = datas.split(",");

            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'container',
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false
                },
                title: {
                    text: 'Browser market shares at a specific website, 2010'
                },
                tooltip: {
                    pointFormat: '{series.name}: <b>{point.percentage}%</b>',
                    percentageDecimals: 1
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: false
                        },
                        showInLegend: true
                    }
                },
                series: [{
                    type: 'pie',
                    name: 'Browser share',
                    categories : c,
                    data: d
                }]
            });
        });

    });
    </script>
</head>

<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
<s:hidden  name="listofnames" id="listofnames" value="%{NameList}"/>
<s:hidden  name="listofdata" id="listofdata" value="%{DataList}"/>

我还尝试将数据作为字符串传递给系列，如Highchart plugin not accepting array for series data?中所示。即使这样也行不通。

                        var names = document.getElementById("listofnames").value;
            names = names.replace("[","");
            names = names.replace("]","");
            var datas = document.getElementById("listofdata").value;
            datas = datas.replace("[","");
            datas = datas.replace("]","");

            var c = names.split(",");

            var d = datas.split(",");

            var datastring = "";

            for(var i=0; i<c.length; i++){

                datastring += "['"+c[i]+"',"+d[i]+"]";
            }


                        series: [{
                    type: 'pie',
                    name: 'Browser share',
                    data: datastring
                }]

Answer 1

最有可能你的值是字符串，而应该是数字。您必须解析该字符串，例如：

$.map(c, function(n){
    return parseFloat(n);
});    
$.map(d, function(n){
    return parseFloat(n);
});

使用Java ArrayList将系列数据分配给高图

1 个答案: