我使用highcharts构建热图,在弄清楚如何输入数据后,我对可能的配置元素数量感到不知所措。
我希望在没有匹配项时删除号码0
的其中一个元素:
我该怎么做?
热图的简化(但功能)版本如下(如果运行它有问题,JSFiddle is available as well)。 0
是我想要摆脱的。
Highcharts.chart('container', {
chart: {
type: 'heatmap',
plotBorderWidth: 1
},
title: {
text: null
},
xAxis: {
categories: ['a', 'b'],
title: "attackers",
},
yAxis: {
categories: ['x', 'y'],
title: "sentinels",
},
colorAxis: {
dataClasses: [{
to: 1,
color: '#FFFFFF'
}, {
from: 1,
to: 10,
color: '#FFE4E1'
}, {
from: 10,
to: 100,
color: '#FA8072'
}, {
from: 100,
to: 1000,
color: '#FC1501'
}, {
from: 1000,
to: 10000,
color: '#660000'
}, {
from: 10000,
to: 100000,
color: '#330000'
}, ]
},
legend: {
align: 'right',
layout: 'vertical',
margin: 0,
verticalAlign: 'top',
y: 25,
symbolHeight: 10
},
tooltip: {
formatter: function() {
return '<b>' + this.series.xAxis.categories[this.point.x] + '</b> contacted <br><b>' +
this.point.value + '</b> times <br><b>' + this.series.yAxis.categories[this.point.y] + '</b>';
}
},
series: [{
name: 'Connexion per ip',
//turboThreshold: 5000,
borderWidth: 0,
data: [
[0, 0, 10],
[0, 1, 0],
[1, 0, 0],
[1, 1, 10]
],
dataLabels: {
enabled: true,
color: '#000000'
}
}]
});
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/heatmap.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/highcharts/6.0.6/highcharts.js"></script>
<div id="container"></div>
如果帖子似乎“不显示寻找解决方案的努力”,我很抱歉,但我浏览了API文档并且它只是,嗯,压倒一切
编辑:我找到了边框的解决方案(borderWidth: 1
),所以我将问题限制为移除0
。
答案 0 :(得分:1)
检查plotOptions.series.dataLabels.format
并仅返回非零值:
plotOptions: {
series: {
dataLabels: {
formatter: function() {
if (this.point.value > 0) {
return this.point.value
}
}
}
}
},
Fiddle演示