问题描述
我正在尝试使用echarts中的可视化图根据系列数据中的尺寸为线条着色。目前，该系列的标签已根据此地图正确着色，但线条本身未正确着色。这是错误还是我做错了？
我真的更希望这些值之间有更多的梯度，但在这一点上我会取得任何进展。
{
"title": {
"text": "Humidity","left": "center"
},"tooltip": {
"trigger": "axis"
},"xAxis": {
"type": "time","axisLabel": { }
},"yAxis": {
"splitLine": {
"show": false
},"min": "dataMin","max": "dataMax"
},"dataZoom": [
{
"startValue": "2014-06-01"
},{
"type": "inside"
}
],"visualMap": {
"dimension": 2,"seriesIndex": 0,"top": 20,"right": 20,"pieces": [
{
"value": 1,"color": "#00d27a","label": "Ideal"
},{
"value": 2,"color": "#f5803e","label": "Warning"
},{
"value": 3,"color": "#e63757","label": "Danger"
}
],"outOfRange": {
"color": "#000"
}
},"series": [
{
"data": [
[
"2020-10-03T17:30:00",50,1
],[
"2020-10-03T18:30:00",51,[
"2020-10-03T19:30:00",52,[
"2020-10-03T20:30:00",[
"2020-10-03T21:30:00",[
"2020-10-03T22:30:00",[
"2020-10-03T23:30:00",49,[
"2020-10-04T00:30:00",[
"2020-10-04T01:30:00",[
"2020-10-04T02:30:00",[
"2020-10-04T03:30:00",[
"2020-10-04T04:30:00",54,[
"2020-10-04T05:30:00",55,[
"2020-10-04T06:30:00",[
"2020-10-04T07:30:00",[
"2020-10-04T08:30:00",[
"2020-10-04T09:30:00",[
"2020-10-04T10:30:00",[
"2020-10-04T11:30:00",53,[
"2020-10-04T12:30:00",[
"2020-10-04T13:30:00",[
"2020-10-04T14:30:00",48,[
"2020-10-04T15:30:00",[
"2020-10-04T16:30:00",[
"2020-10-04T17:30:00",[
"2020-10-04T18:30:00",[
"2020-10-04T19:30:00",[
"2020-10-04T20:30:00",[
"2020-10-04T21:30:00",[
"2020-10-04T22:30:00",[
"2020-10-04T23:30:00",[
"2020-10-05T03:30:00",[
"2020-10-05T04:30:00",[
"2020-10-05T05:30:00",56,2
],[
"2020-10-05T06:30:00",57,[
"2020-10-05T07:30:00",58,[
"2020-10-05T08:30:00",[
"2020-10-05T09:30:00",59,[
"2020-10-05T10:30:00",[
"2020-10-05T11:30:00",[
"2020-10-05T12:30:00",[
"2020-10-05T13:30:00",[
"2020-10-05T14:30:00",[
"2020-10-05T15:30:00",[
"2020-10-05T16:30:00",[
"2020-10-05T17:30:00",[
"2020-10-05T18:30:00",[
"2020-10-05T19:30:00",[
"2020-10-05T20:30:00",[
"2020-10-05T21:30:00",[
"2020-10-05T22:30:00",[
"2020-10-05T23:30:00",[
"2020-10-06T00:30:00",[
"2020-10-06T01:30:00",[
"2020-10-06T02:30:00",[
"2020-10-06T03:30:00",[
"2020-10-06T04:30:00",[
"2020-10-06T05:30:00",[
"2020-10-06T06:30:00",[
"2020-10-06T07:30:00",[
"2020-10-06T08:30:00",[
"2020-10-06T09:30:00",[
"2020-10-06T10:30:00",[
"2020-10-06T11:30:00",[
"2020-10-06T12:30:00",[
"2020-10-06T13:30:00",47,[
"2020-10-06T14:30:00",45,[
"2020-10-06T15:30:00",2
]
],"name": "humi","title": "Humidity","type": "line","symbol": "none","label": {
"show": true
}
}
]
}
解决方法
我认为您应该使用尺寸1而不是尺寸2，因为您要映射其湿度值并将组湿度值映射到理想，警告和危险类别的范围内。例如：
- 理想：最低：48，最高：55
- 警告：最小值：55，最大值：59
- 危险：最小值：59
您的视觉地图选项将是：
visualMap: {
dimension: 1,seriesIndex: 0,top: 20,right: 20,pieces: [
{
min: 48,max: 55,color: "#00d27a",label: "Ideal",},{
min: 55,max: 59,color: "#f5803e",label: "Warning",{
min: 59,color: "#e63757",label: "Danger",],outOfRange: {
color: "#000",结果：
