echarts 柱状图 某一列 被点击之后可以常驻 tooltip axisPointer shadow 效果吗？

Question

我现在有一个这一的柱状图，hover的时候 展示阴影效果，我想实现的效果是点击某一个柱子之后 这一列阴影效果一直存在，直到点击其他列 或者刷新页面，有什么办法可以实现吗？

Answer 1

axisPointer一直显示设置xAxis.axisPointer.handle.show=true

tooltip一直显示设置tooltip.alwaysShowContent=true即可

完整demo

option = {
  tooltip: {
    trigger: 'axis',
    axisPointer: {
      type: 'shadow'
    },
    alwaysShowContent: true
  },
  grid: {
    left: '3%',
    right: '4%',
    bottom: '3%',
    containLabel: true
  },
  xAxis: [
    {
      type: 'category',
      data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
      axisTick: {
        alignWithLabel: true
      },
      axisPointer: {
        handle: {
          show: true,
          icon: 'none'
        }
      }
    }
  ],
  yAxis: [
    {
      type: 'value'
    }
  ],
  series: [
    {
      name: 'Direct',
      type: 'bar',
      barWidth: '60%',
      data: [10, 52, 200, 334, 390, 330, 220]
    }
  ]
};

Answer 2

使用这个就可以了:

https://echarts.apache.org/zh/option.html#tooltip.triggerOn

Answer 3

可以使用 graphic 来重新画一个 合适的 图形就可以了