echarts改變折線圖和折線點的顏色
最近在做echart,每次更新一點,記錄一點完成之後方便進行大的總結
//(1)改變折線點和折線的顏色
series: [
{
name: "溫度",//滑鼠放在折線點上顯示的名稱
type: "line",//折線圖
symbol: 'circle',//折線點設定為實心點
symbolSize: 4, //折線點的大小
itemStyle: {
normal: {
color: "#386db3",//折線點的顏色
lineStyle: {
color: "#386db3"//折線的顏色
}
}
},
]
//(2)改變x軸y軸的顏色以及寬度
xAxis: [{
gridIndex: 0,
type: "category",
data: xdata,
axisLine: {
lineStyle:{
color:'#272729',//x軸的顏色
width:8,//軸線的寬度
}
},
}],
yAxis: [
axisLine: {
lineStyle:{
color:'#272729',// y軸的顏色
width:8,//y軸線的寬度
}
}],
// (3)改變座標值的顏色
axisLabel: {
show: true,
textStyle: {
color: '#fff'
}
}
(4)legend
新增legend的時候,必須是series中name的名字和legend中字型的內容是一致的才能顯示
legend的顏色是在option裡面直接定義的color陣列,有幾個圖例就在color裡面寫幾個顏色值。
legend: {
color:['#4472C5'],
data:['最近七天噴淋主泵出口壓力'],
textStyle:{//圖例文字的樣式
color:'#fff',
fontSize:16
}
},
series: [
{
type: 'line',
valueAxisIndex: 0,
name: "最近七天噴淋主泵出口壓力"
}
]