echarts 折线图常用属性总结

最新推荐文章于 2024-09-18 16:22:15 发布

AmberWu

最新推荐文章于 2024-09-18 16:22:15 发布

阅读量4.9k

点赞数 2

分类专栏：技术类文章标签： echarts 折线图

本文链接：https://blog.csdn.net/AmberWu/article/details/80481857

版权

技术类专栏收录该内容

68 篇文章 1 订阅

订阅专栏

x轴样式

x轴数据过长，可以倾斜展示

        xAxis: {
         axisLabel: {
            interval: 0, //横轴信息全部显示
            rotate: -30 //-30度角倾斜显示
          }，
        },

x轴颜色、粗细

        xAxis: {
         axisLine: {
              onZero: false, // 不让纵坐标轴在横轴的0点位置
              lineStyle: {
                color: "#E5E9F2",
                width: 2
              }
            },
        },

y轴的分割线样式：

        yAxis: [
          {
           splitLine: {
              lineStyle: {
                color: "#E5E9F2",
                width: 1
              }
            },
          }
        ],

折线样式：

          series: {
            symbolSize: 2, //拐点大小
            itemStyle: {
              normal: {
                lineStyle: {
                  width: 1 //折线宽度
                }
              }
            },
          }

悬浮提示

          tooltip: {
            // 悬浮提示
            trigger: "axis",
            backgroundColor: "#FFFFFF",
            textStyle: {
              color: "#19233C"
            },
            borderRadius: 3, //边框圆角
            boxShadow: "0px 2px 10px 0px rgba(229,233,242,1)"
          },