莫方教程网

专业程序员编程教程与实战案例分享

Echarts 折线图虚线和线条颜色配置

前端开发都避免不了使用Echarts绘制图表,今天的需求是将制定线条设置成虚线,不同的线条设置指定的颜色;指定线条上的节点圆点设置大小;

内容:



 series: [
          {
            name: '线条名称',
            data: [], //线条数据数组
            type: 'line',
            smooth: true,
            symbol:'none',//标记图像:默认空心圆;circle:实心圆;rect:实心矩形;
                                   //roundRect:圆角实心矩形;triangle:实心三角形;
            											 //diamond:实心菱形;pin:实心钉形(标记);
            											 //arrow:箭头形;none:没有
            symbolSize: 8, //线条上的圆点大小
            itemStyle: {
              normal: {
                color: "#e8514b", //线条上圆形节点的颜色
                lineStyle: {
                  width: 2 , //线条的宽度
                  type: 'dotted' , //线条样式:'dotted'虚线 'solid'实线
                  color: "#e8514b",  //线条的颜色
                }
              }
            },
          }
   ]

欢迎指点交流

控制面板
您好,欢迎到访网站!
  查看权限
网站分类
最新留言