专业编程教程与实战项目分享平台

网站首页 > 技术文章 正文

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

ins518 2024-10-08 08:34:05 技术文章 17 ℃ 0 评论

前端开发都避免不了使用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",  //线条的颜色
                }
              }
            },
          }
   ]

欢迎指点交流

本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表