echarts 配置项

最新推荐文章于 2025-06-13 17:24:07 发布

jo_an_na

最新推荐文章于 2025-06-13 17:24:07 发布

阅读量344

点赞数

CC 4.0 BY-SA版权

文章标签： echarts

本文链接：https://blog.youkuaiyun.com/jo_an_na/article/details/80291603

本文介绍了一种使用ECharts实现的最新官价走势图配置方案。图表包括标题、提示框、坐标轴等元素，并设置了三条不同颜色的折线用于展示数据变化趋势。此配置可用于多种数据展示场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

 echartsOption: {
        title: {
          text: '最新官价走势图',
          x: 'center',
          y: 'bottom',
          textStyle: {
            fontSize: '12px',
            color: '#999'
          }
        },
        tooltip: {
          trigger: 'axis'
        },
        xAxis: {
          type: 'category',
          splitLine: {
            show: false
          }, // 去掉网格线
          axisLine: {
            lineStyle: {
              color: '#999'
            }
          },
          boundaryGap: false,
          data: [],
          axisLabel: {
            show: true,
            textStyle: {
              color: '#999'
            }
          }
        },
        yAxis: {
          type: 'value',
          splitLine: {
            show: false
          }, // 去掉网格线
          axisLine: {
            lineStyle: {
              color: '#999'
            }
          },
          axisLabel: {
            formatter: '{value}',
            textStyle: {
              color: '#999'
            }
          }
        },
        series: [
          {
            name: '该值为',
            type: 'line',
            data: [0.8, 0.2, 0.3, 0.4, 0.8, 0.4],
            itemStyle: {
              normal: {
                color: '#FFB640' // 折线图颜色
              }
            }
          },
          {
            name: '该值为',
            type: 'line',
            data: [],
            itemStyle: {
              normal: {
                color: 'red' // 折线图颜色
              }
            }
          },
          {
            name: '该值为',
            type: 'line',
            data: [],
            itemStyle: {
              normal: {
                color: 'green' // 折线图颜色
              }
            }
          }
        ]
      }