javascript - HighChart 中的系列数据

标签 javascript jquery highcharts

我需要一些帮助将以下代码转换为根据从数据库返回的值构建的系列数据。

var options = {
"chart": {
    "type": "column",
    "zoomType": "xy",
    "inverted": true
},
"plotOptions": {
    "series": {
        "stacking": "percent"
    },
    "column": {
        "allowPointSelect": true
    },
    "bar": {
        "selected": true
    }
},
"title": {
    "text": "MT Messages"
},
"xAxis": {
    "title": {
        "text": null
    },
    "type": "category"
},
"series": [
    {
        "index": 0,
        "dataLabels": {
            "enabled": true
        },
        "name": 101,
        "data": [
            [
                "Today",
                5
            ],
            [
                "This Week",
                3
            ],
            [
                "Last Week",
                4
            ],
            [
                "Last Month",
                127
            ]
        ]
    },
    {
        "index": 1,
        "dataLabels": {
            "enabled": true
        },
        "name": 103,
        "data": [
            [
                "Today",
                2
            ],
            [
                "This Week",
                2
            ],
            [
                "Last Week",
                3
            ],
            [
                "Last Month",
                20000
            ]
        ]
    },
    {
        "index": 2,
        "dataLabels": {
            "enabled": true
        },
        "name": 202,
        "data": [
            [
                "Today",
                3
            ],
            [
                "This Week",
                4
            ],
            [
                "Last Week",
                4
            ],
            [
                "Last Month",
                2
            ]
        ]
    }
]

};

我已将其替换为:

 var data = [['Today', 12], ["This Week", 13], ["Last Week", 23], ["Last Month", 100]];

            var barChart = $(function() {
                $('#barChart').highcharts({
                    "chart": {
                        "type": "column",
                        "zoomType": "y",
                        "inverted": false
                    },
                    "plotOptions": {
                        "series": {
                            "stacking": "percent"
                        },
                        "column": {
                            "allowPointSelect": true
                        },
                        "bar": {
                            "selected": true
                        }
                    },
                    "title": {
                        "text": "MT Messages"
                    },
                    "xAxis": {
                        "title": {
                            "text": null
                        },
                        "type": "category"
                    },

                    "series": [
                        {
                            "index": 0,
                            "dataLabels": {
                                "enabled": true
                            },
                            "name": 101,
                            "data":data

                        },
                        {
                            "index": 1,
                            "dataLabels": {
                                "enabled": true
                            },
                            "name": 103,
                            "data": data
                        },
                        {
                            "index": 2,
                            "dataLabels": {
                                "enabled": true
                            },
                            "name": 202,
                            "data":data
                        }
                    ]
                });
            });

但是,我的所有列的每个索引都包含相同的值

HighCharts

我可能看错了,也许我的数组需要类似于:

data = ['今天',12,13,52],['本周', 123,3466,56]...等

但这根本无法渲染图表。

最佳答案

您对每个系列使用相同的数据数组值,这就是它们看起来都相同的原因。在你的第一个例子中,每个系列都有一组不同的数据。要在第二个中执行此操作,您应该为每个系列使用不同的数据数组:

var data1 = [['Today', 12], ["This Week", 13], ["Last Week", 23], ["Last Month", 100]];
var data2 = [['Today', 5], ["This Week", 15], ["Last Week", 12], ["Last Month", 203]];
...
                "series": [
                    {
                        "index": 0,
                        "dataLabels": {
                            "enabled": true
                        },
                        "name": 101,
                        "data":data1

                    },
                    {
                        "index": 1,
                        "dataLabels": {
                            "enabled": true
                        },
                        "name": 103,
                        "data": data2
                    },
etc.

关于javascript - HighChart 中的系列数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19909562/

相关文章:

r - 使用 highcharter 在循环内绘图

javascript - 将 HREF 替换为标签之间的内容(使用电子邮件表达式)

javascript - 使用 linqjs 使用另一个数组中的值过滤一个数组

jquery - 如何在 iPhone Web 应用程序中使用 jQuery 进行点击事件

javascript - 点击删除特定的JS代码?

javascript - 模态内的 highcharts web 图表

javascript - 序列化可观察量

javascript - 离开页面后还保留dom吗?

jQuery-Ui:无法将对象拖动到 Accordion 之外

real-time - 如何在禁用导航器的情况下更新 highstock?