echarts折线图默认不显示数据圆点，鼠标划上之后折线图才显示圆点

最新推荐文章于 2025-06-25 15:23:35 发布

原创最新推荐文章于 2025-06-25 15:23:35 发布 · 4.1k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#echarts #前端 #javascript

ECharts 专栏收录该内容

8 篇文章

订阅专栏

文章描述了如何在ECharts图表中设置`showSymbol`为`false`，以确保只有在鼠标悬停在tooltip上时才显示数据点。配置示例涉及X轴和Y轴类型，以及线型系列的定义。

只需要设置showSymbol为false就可以了，表示只在 tooltip hover 的时候显示。
代码如下：

option = {
  tooltip: {
      trigger: 'axis'
  },
  xAxis: {
    type: 'category',
    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      data: [150, 230, 224, 218, 135, 147, 260],
      type: 'line',
      showSymbol: false // 在 tooltip hover 的时候显示
    }
  ]
};