具有JSON数据的HighChart热图

Question

我正在尝试将JSON特定数据集成到highmaps/highcharts提供的热图中.

关于的例子

链接到HeatMap演示

演示了如何使用CSV方法加载数据.但我无法使用JSON数组运行它.任何人都可以从示例中提供等效的CSV以获得相同的热图图表,或者向我展示基于JSON的另一个示例的方法吗？

Thx提前.

干杯彼得

Answer 1

您需要将其转换为列/行点而不是日期字符串。您将有 2 个类别轴：x 和 y。那么x/y轴的索引就变成了[x,y,value]。因此，如果您的数据从“2013-04-01”开始，那么它就是您的第一个索引，如下所示[ ["2013-04-01",0,-0.7], ["2013-04-02",0,-3.4], ["2013-04-03",0,-1.1] ]：

[ [0,0,-0.7], [1,0,-3.4], [2,0,-1.1] ]

请注意，这只是一行数据。y你的组件是什么？

编辑：如果您的 yAxis 组件将是一天中的小时，那么您将像这样设置您的 axii：

xAxis: {
    categories: ['2013-04-01', '2013-04-02', '2013-04-03'],
    labels: {
        rotation: 90
    }
},
yAxis: {
    title: {
        text: null
    },
    labels: {
        enabled: false
    },
    categories: ['Midnight', '1 am', '2 am', '3 am', '4 am', '5 am', '6 am', '7 am', '8 am', '9 am', '10 am', '11 am', 'Noon', '1 pm', '2 pm', '3 pm', '4 pm', '5 pm', '6 pm', '7 pm', '8 pm', '9 pm', '10 pm', '11 pm'],
    min: 0,
    max: 23,
    reversed: true
},

那么你的系列看起来会是这样的：

series: [{
    borderWidth: 0,
    nullColor: '#EFEFEF',
    data: [ [0,0,-0.7], [1,0,-3.4], [2,0,-1.1] ]
}]

现场演示。

我在那里添加了其他项目，我会让您弄清楚（为什么要设置reversed: true，什么是 colorAxis 等）。需要注意的重要一点是，该series.data格式与任何其他高图设置不同。