echarts折线图横纵坐标颜色配置

今天配合ios端做了一个折线图h5页面，其中有一些样式需要调整总结如下：

原图

UI

需要需改坐标轴的颜色和紫的颜色，折线的颜色

坐标轴颜色

// 设置坐标轴字的颜色
axisLabel: {
   color: '#666669'
},

splitLine: {
   lineStyle: {
      color: "#EEEEF1"
   }
},

axisLine: {
   lineStyle: {
      type: 'solid',
      color: '#EEEEF1',//左边线的颜色
      width:'1'//坐标线的宽度
   }
}

坐标线

缩放

dataZoom: [{
    show: true,
    type: 'inside',
    filterMode: 'none',
    xAxisIndex: [0],
    startValue: 0,
     endValue: 20
  }, {
    show: true,
    type: 'inside',
    filterMode: 'none',
    yAxisIndex: [0],
    startValue: 0,
    endValue: 20
}],

设置折线线条颜色

series: [{
   itemStyle : {
       normal : {
          lineStyle:{
              color:'#FF4A4A'
          }
       }
   }   
 }]

线条

这样就实现了
整体代码如下: （只是一个demo）

感谢您

• 如果觉得这篇文章对您有帮助的话，动一动小手点着赞吧
• 有问题可关注我的公众号 前端小喵，回复“加入”加我微信，我们一起交流学习，回复“教程”，即可领取免费前端教程资源。