今天做項(xiàng)目的時(shí)候遇到了一個(gè)問(wèn)題， echarts給的例子中顏色太單調(diào)，只有一種顏色，有一個(gè)自定義柱體顏色的示例，但是是寫(xiě)在數(shù)據(jù)中的，但是這個(gè)項(xiàng)目的數(shù)據(jù)很多，有20多個(gè)，我不可能每一個(gè)數(shù)據(jù)都要用js來(lái)調(diào)整一下。
于是我去翻了一下echarts的配置項(xiàng)，找到了這么一段話(huà)。
可以傳入一個(gè)RGB格式的顏色或者16進(jìn)制的顏色，為所有的柱體設(shè)置，或者使用一個(gè)回調(diào)函數(shù)為整個(gè)柱體設(shè)置，這里有回調(diào)函數(shù)就說(shuō)明有操作的空間。
這里有一個(gè)小技巧，取余運(yùn)算，我們都知道‘%’，在js是取余數(shù)的意思，如果1 那返回的值是1,2返回2，10是1，余數(shù)是0，11是 11除以10 余下1。
想必聰明的小伙伴走到這里就有思路了，沒(méi)錯(cuò)如果我們?cè)O(shè)置一個(gè)顏色數(shù)組，然后在使用取余運(yùn)算循環(huán)取從1-10的索引，那么展示出來(lái)的就是顏色數(shù)組的循環(huán)，實(shí)現(xiàn)如下：
最后的效果如下所示：
了解更多vue知識(shí)點(diǎn)擊這里。
