$(function() {
$('#container').highcharts({
chart: {
type: 'heatmap',
marginTop: 40,
marginBottom: 80,
plotBorderWidth: 0.5
},
title: {
text: 'Number'
},
xAxis: {
categories: [ .......... ]
},
yAxis: {
categories: [ .......... ],
title: null
},
colorAxis: {
min: 0,
minColor: '#FFFFFF',
maxColor: Highcharts.getOptions().colors[0]
},
legend: {
align: 'right',
layout: 'vertical',
margin: 0,
verticalAlign: 'top',
y: 25,
symbolHeight: 280
},
tooltip: {
formatter: function() {
return '' +
this.series.xAxis.categories[this.point.x] +
'<br>' +
this.series.yAxis.categories[this.point.y] +
'<br>' + this.point.value;
}
},
series: [{
name: 'Sales per employee',
borderWidth: 1,
data: [ .......... ],
http://jsfiddle.net/Slate_Shannon/0mvgmhLb/6/
这是一个热图图表。图表看起来没问题,但应该有更多数据。但是,如果我添加任何其他数据,图表就会中断。
请注意,很大一部分数据被注释掉了。这从以
开头的数据开始[50,0,null],
[50,1,8380],
[50,2,37430],
(请注意,我删除了上面显示的代码中的轴标签和数据。) 如果将评论标记的开头位置更改为,以便绘制“50”数据,则绘制失败。
这是数据太多了,还是有办法创建需要大约 20 x 90 个单元格的热图?
最佳答案
从 Highcharts API 将 turboThreshold 设置为 0:
When a series contains a data array that is longer than this, only one dimensional arrays of numbers, or two dimensional arrays with x and y values are allowed. Also, only the first point is tested, and the rest are assumed to be the same format. This saves expensive data checking and indexing in long series. Set it to 0 disable. Defaults to 1000.
http://api.highcharts.com/highcharts/plotOptions.heatmap.turboThreshold
示例:http://jsfiddle.net/0mvgmhLb/7/
series: [{
name: 'Sales per employee',
borderWidth: 1,
turboThreshold: 0,
...
关于javascript - HIghcharts 热图重载数据过多?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39990194/