eCharts 折线图一段是实线，一段是虚线的实现效果

LXXgalaxy

已于 2024-05-27 09:41:46 修改

阅读量1.9k

点赞数 3

分类专栏： javascript echarts 文章标签： echarts 前端 javascript

于 2024-03-14 14:41:32 首次发布

本文链接：https://blog.csdn.net/galaxyJING/article/details/136709784

版权

javascript 同时被 2 个专栏收录

39 篇文章

订阅专栏

echarts

19 篇文章

订阅专栏

本文介绍了如何在ECharts库中创建一条折线图，其中一部分使用实线，另一部分使用虚线。作者详细展示了如何配置x轴和y轴数据，以及线条类型。

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

option = {
    title: {
        text: '实线与虚线结合的折线图'
    },
    tooltip: {
        trigger: 'axis'
    },
    xAxis: {
        type: 'category',
        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
    },
    yAxis: {
        type: 'value'
    },
    series: [
    {
      data: [150, 230, 224,218 ,,,],
      type: 'line'
    },
     {
      data: [,,, 218, 135, 147, 260],
      type: 'line',
      lineStyle: {
        type: "dashed"
      }
    }
  ]

}