做項目時的一個需求：根據數值大小使用顏色漸變的方塊表示，效果是很多小方塊排成一排（類似於橫向的堆疊柱狀圖，不過不同顏色之間有空隙，寬高相同），方塊顏色為其數值大小m，取a顏色（對應數值min）到b顏色（對應數值max）的漸變色中相對應的顏色

echarts官網上有一個例子可以借鑒，是使用visualMap視覺映射組件。通常visualMap都是映射的數據軸數值大小，現在要求柱狀圖一樣高，所以映射到x軸上，由於x軸是類目軸，所以它會按照下標來映射

var min = 7,max = 33;

var color_min = ‘red‘,color_max = ‘blue‘;

var optiion = {

　　xAxis:{...,data:[7,8,...,32,33]},

　　yAxis:{...},

　　grid:{...},

　　visualMap:{

　　　　...

　　　　min:0,

　　　　max:max - min,

　　　　demission:0,

　　　　inRange:{

　　　　　　color:[color_min,color_max]

　　　　},

　　　　..

　　},

　　series:[{

　　　　...,

　　　　data:[1,1,...,1,1]

　　}]

}

配置項大致就是上面這個樣子，有興趣的可以試一下

顏色漸變的柱狀圖