0

我只是基于 html 元素生成一个虚拟图表。我在这里指的是highchart上显示的示例:http ://www.highcharts.com/demo/column-parsed

所以我做了一些修改以满足我的需要。这里的代码

$(function () {
    $(document).ready(function()
    {
        Highcharts.visualize = function(table, options) {               
            options.xAxis.categories = [];  // the categories           
            options.series           = [];  // the data series
            var candidateArray = [
                'Nuh',
                'Saleh',
                'Ibrahim',
                'Musa',
                'Ishak',
                'Harun',
                'Ilyas Ishak',
                'Zulkifli',
                'Idris',
                'Isa',
                'Muhammad'
            ];

            $('tbody tr', table).each( function(i) {
                var randomNumber = Math.floor(Math.random() * candidateArray.length);
                //options.xAxis.categories.push(candidateArray[randomNumber]);
                options.series[i] = {
                    name: candidateArray[randomNumber],
                    //name: 'Candidate Name',
                    type: 'column',
                    data: [{
                            x: candidateArray[randomNumber], 
                            y: Math.floor((Math.random()*10)+1)
                          }]
                };
                console.log(options.series[i]);
            });
            var chart = new Highcharts.Chart(options);
        }
            var table = document.getElementById('datatable'),
                options = {
                    chart: {
                        renderTo: 'chart',
                        backgroundColor: '#FBFBFB'
                    },
                    title: {
                        text: 'Top ' + $("#html5shim-2-out").html() + ' Best Candidate'
                    },
                    xAxis: {

                    },
                    yAxis: {
                        title: {
                            text: 'No. of PT'
                        }
                    },
                    plotOptions: {
                                series: {
                                    borderRadius: 5        
                                }
                            },
                    tooltip: {
                        formatter: function() {
                            return '<b>'+ this.series.name +'</b><br/>'+
                                this.y +' '+ this.x.toLowerCase();
                        }
                    }
                };

            Highcharts.visualize(table, options);
    });
});

如您所见,页面加载后没有生成图表,并且正在使用最新的 highchart 库和 jQuery JavaScript Library v1.6.1

提前感谢愿意回复的人

4

1 回答 1

0

你能解释一下你想要做什么吗?当您似乎不再读取数据时,为什么您仍在读取和传递 dataArray?您似乎正在对其进行迭代,但填写您自己的值。如果您想更改表中的值,您应该在 JSFiddle 的 HTML 部分中更改它们,而不是在函数本身中。

于 2012-05-30T19:57:44.647 回答