javascript - vue-echarts-v3使用的過(guò)程中折線圖區(qū)域呈漸變色。
問(wèn)題描述
這是我的圖表數(shù)據(jù)
我希望紅色部分是漸變色。我已經(jīng)使用了visvisualMap的方法,并不能達(dá)到我想要的效果。當(dāng)我使用new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0, color: ’rgb(255, 158, 68)’}, { offset: 1, color: ’rgb(255, 70, 131)’}])。。。我找到的其中一種方法,。。但是不知道怎么獲取echarts對(duì)象,
由于不想在項(xiàng)目中引入過(guò)多的資源,所以引入zRender暫時(shí)不在考慮范圍之內(nèi)。。。 求助希望解決vue-echarts-v3插件使用是,獲取new echarts.graphic.LinearGradient()的辦法
<IEcharts :option='bar' class='step_echarts'></IEcharts
import IEcharts from ’vue-echarts-v3’import ’echarts/lib/chart/line’
export defalut{data(){
return{ bar: { tooltip: {}, xAxis: {data: [’1泡’, ’2泡’, ’3泡’, ’4泡’, ’5泡’],axisTick:{ alignWithLabel:true} }, yAxis: {show:false }, series: [{name: ’Clouds’,type: ’line’,data: [5, 7, 13, 20, 30],areaStyle: {normal:{}} }]} }}
}}
問(wèn)題解答
回答1:我隨便寫了三個(gè)顏色。
series: [{name: ’Clouds’,type: ’line’,data: [5, 7, 13, 20, 30],areaStyle: {normal:{}},itemStyle: {normal: { color: new echarts.graphic.LinearGradient(0, 0, 0, 1,[ {offset: 0, color: ’red’}, {offset: 0.5, color: ’pink’}, {offset: 1, color: ’#ddd’}] )} }}]
樓上說(shuō)的對(duì),你要想要漸變,你就要給他設(shè)置圖例,告訴它從哪漸變到哪,要不然用的是默認(rèn)的顏色
相關(guān)文章:
1. 為什么我ping不通我的docker容器呢???2. javascript - vue vue-router 報(bào)$router重復(fù)定義3. debian - docker依賴的aufs-tools源碼哪里可以找到啊?4. java - 根據(jù)月份查詢多個(gè)表里的內(nèi)容怎么實(shí)現(xiàn)好?5. javascript - webpack熱加載配置不生效6. 關(guān)于docker下的nginx壓力測(cè)試7. 關(guān)于Java引用傳遞的一個(gè)困惑?8. windows2003下的apache響應(yīng)時(shí)間特別長(zhǎng)?9. angular.js - angular內(nèi)容過(guò)長(zhǎng)展開(kāi)收起效果10. node.js - node exec 執(zhí)行沒(méi)反應(yīng)
