小程序引入的echarts过大如何解决_解决微信小程序引用echarts视图模糊的问题
function?initChart(canvas,?width,?height,dpr)?{
const?chart?=?echarts.init(canvas,?null,?{
width:?width,
height:?height,
devicePixelRatio:?dpr?//解決小程序視圖模糊的問題，必寫
});
canvas.setChart(chart);
var?checkName?=?'今天';
var?dataLength?=?14;?//默認的數據長度，既真實數組的長度，必須設置，長度來源：后臺傳輸
//這里是echart基礎配置
var?option?=?{
backgroundColor:?'rgba(25,1,169,.05)',
tooltip:?{
trigger:?'axis',
axisPointer:?{
type:?'shadow',
backgroundColor:?'rgba(245,?245,?245,?1)',
borderWidth:?1,
//?padding:?10,
}
},
dataZoom:?[{
show:?false,?//是否顯示下方滾動條
realtime:?true,
startValue:?dataLength?-?7,
endValue:?dataLength?-?1,?//顯示數據結束位置
},
{
type:?'inside',
realtime:?true,
startValue:?dataLength?-?7,
endValue:?dataLength?-?1,?//顯示數據結束位置
}
],
grid:?{
top:?'20%',
right:?'0',
left:?'0',
bottom:?'12%'
},
xAxis:?[{
type:?'category',
data:?['02.25',?'02.26',?'02.27',?'02.28',?'03.01',?'03.02',?'03.02',?'02.25',?'02.26',?'02.27',?'02.28',?'03.01',?'03.02',?'今天'],
axisLine:?{
lineStyle:?{
color:?'rgba(255,255,255,0.12)'
}
},
position:?'top',
axisLabel:?{
color:?function(params)?{
//通過判斷選中的名字改變柱子的顏色樣式
if?(checkName?===?params)?{
return?'rgba(38,74,255,1)';
}?else?{
return?'rgba(38,74,255,.3)';
}
},
textStyle:?{
fontSize:?14
},
padding:?[10,?0]
},
}],
yAxis:?[{
show:?false,
axisLabel:?{
formatter:?'{value}',
color:?'#e2e9ff',
},
axisLine:?{
show:?false
},
splitLine:?{
lineStyle:?{
color:?'rgba(255,255,255,0.12)'
}
}
}],
series:?[{
type:?'bar',
data:?[300,?450,?770,?203,?255,?188,?156,?300,?450,?770,?203,?255,?188,?156],
//?itemStyle:?{
//?????normal:?{
//?????????color:?'rgba(38,74,255,.3)',
//?????}
//?},
itemStyle:?{
normal:?{
label:?{
show:?true
},
color:?function(params)?{
//通過判斷選中的名字改變柱子的顏色樣式
if?(checkName?===?params.name)?{
return?'rgba(38,74,255,1)';
}?else?{
return?'rgba(38,74,255,.3)';
}
}
}
},
label:?{
normal:?{
show:?true,
position:?'top',
textStyle:?{
color:?'#B9C5FC',
fontSize:?'12'
},
formatter:?'{c}分'
}
}
}]
};
chart.setOption(option);
return?chart;
}
總結
以上是生活随笔為你收集整理的小程序引入的echarts过大如何解决_解决微信小程序引用echarts视图模糊的问题的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： spark 广播变量大数据_Spark基
- 下一篇： 大数据平台常用组件_这款大数据智能服务平