var data =
[[0, 0, 2.1, 4.74, -0.96, 'str1', 'M13', -2.52],
[0, 1, 1.31, 1.71, -1.64, 'str1', 'M15', -4.35],
[0, 2, -2.38, 2.92, -0.86, 'str1', 'M18', -3.58],
[1, 0, 2.05, 0.19, 1.96, 'str1', 'M25', -2.54],
[1, 1, 2.45, 5.28, 1.22, 'str2', 'M00', -2.62],
[1, 2, -4.51, 0.62, 3.83, 'str2', 'M04', -1.23],
[2, 0, 2.79, 0.98, -6.71, 'str2', 'M05', -3.51],
[2, 1, 2.82, -3.07, -0.78, 'str2', 'M06', 2.18],
[2, 2, -4.29, 3.86, 1.18, 'str2', 'M10', -2.84],
[3, 0, -4.89, -0.98, -1.88, 'str2', 'M12', 1.36],
[3, 1, -1.89, 3.79, 0.2, 'str2', 'M16', 1.44],
[3, 2, 1.35, 5.92, 7.17, 'str2', 'M17', -0.32],
[4, 0, 4.31, -0.03, 1.21, 'str2', 'M19', 3.04],
[4, 1, -2.18, 2.0, -2.52, 'str2', 'M23', 0.66],
[4, 2, -5.26, -2.53, -4.02, 'str2', 'M24', 2.26],
[5, 0, -1.28, -0.85, 0.19, 'str2', 'M27', 5.99],
[5, 1, -1.68, 1.0, 1.27, 'str3', 'M20', 1.62],
[5, 2, -8.49, 0.13, -0.43, 'str3', 'M22', -1.29],
[6, 0, -5.93, 6.5, 0.63, 'str3', 'M26', -3.94],
[6, 1, -2.2, -0.2, 3.29, 'str4', 'M01', 3.64],
[6, 2, 4.4, 0.64, 0.48, 'str4', 'M03', -3.9],
[7, 0, -1.88, -3.41, 2.73, 'str4', 'M07', 0.99],
[7, 1, -1.5, -1.45, 3.18, 'str4', 'M08', -7.22],
[7, 2, 0.82, 1.52, -2.86, 'str4', 'M11', 0.34],
[8, 0, 3.2, 1.72, 0.03, 'str4', 'M14', -5.66],
[8, 1, 2.04, -5.02, -0.63, 'str4', 'M28', 1.6],
[8, 2, 1.06, -1.03, 5.17, 'str4', 'M29', 1.23],
[9, 0, 3.09, -6.73, -0.1, 'str5', 'M02', -0.89],
[9, 1, -5.02, -1.63, 4.7, 'str5', 'M09', 0.26],
[9, 2, 4.54, -1.41, -1.27, 'str5', 'M21', -5.0]];
option = {
dataset: {
dimensions:['a','b','c','d','e','f','g','h'],
source:data
},
tooltip: {},
visualMap: {
show:false,
min: -5,
max: 5,
dimension: 2,
seriesIndex :0,
calculable: true,
orient: 'horizontal',
align: 'right',
inRange: {
color: ['#BAE7FF', '#1890FF', '#0050B3']
},
left: 'center'
},
xAxis: {
type: 'category',
},
yAxis: {
type: 'category',
},
series: [
{
type: 'heatmap',
encode: {
seriesName:[0,1,2]
},
label: {
show: true
},
itemStyle: {
borderWidth: 1,
borderColor: "#fff"
}
}]
};
上面的代码显示的图形是这样的:
需要在上图上按第5列进行分类,并添加分类框,也就是像下图按日期分类中的按月分类那样的边框,只是分类的数据是自选的:
这里有个例子感觉应该有参考价值,但是太复杂了,看不明白:
https://www.makeapie.com/edit...
加上[dlwbill]的代码后在Echarts这里https://echarts.apache.org/ex... 显示为:
按[dlwbill]的代码显示如下: