ECharts热力图指定颜色

ECharts是便捷使用的图标框架，绘制热力图和方便

关键数值

• x轴
• y轴
• 数据：(x, y, value)
• 渐变色
• 移动效果要将前一次的数据清空

热力图官方链接

https://echarts.apache.org/examples/zh/editor.html?c=heatmap-cartesian&theme=light

自定义热力图颜色

设置visualMap中的inRange，源码如下：

    visualMap: {
        min: 0,
        max: 15,
        calculable: true,
        orient: 'horizontal',
        left: 'center',
        bottom: '15%',
        //自定义热力图颜色
        inRange:{
            color: ['rgba(0,255,0,0.1)','rgba(255,255,0,0.7)', 'rgba(255,0,0,1)']
        }
    }

常用热力图渐变图

defaultGradient: {
    0.45: "rgb(0,0,255)",
    0.55: "rgb(0,255,255)",
    0.65: "rgb(0,255,0)",
    0.95: "yellow",
    1: "rgb(255,0,0)"
}

显示颜色过渡如下：