highcharts lollipop/dumbbell 正负标记值的图表变化 position/colour

Question

我正在尝试创建一个棒棒糖图表，其中一些值为负，一些为正，两边都为零，如下所示：

image

然而图表似乎只允许标记位于图表的 "high" 端。有没有办法控制哪一端有标记？

我正在使用这些图表选项：

chartOptions: {
        chart: {
          type: 'dumbbell',
          inverted: true
        },
        title: {
          text: 'lollipop chart'
        },
        xAxis: {
            type: 'category'
        },
        yAxis: {
            title: {
            text: 'value'
            }
        },
        series: [{
          name: 'value',
          data: [{
              name: 'a',
              low:0,
              high:13,
          }, {
              name: 'b',
              low:0,
              high:26,
          },{
              name: 'c',
              low:-43,
              high:0
          },{
              name: 'd',
              low:-83,
              high:0
          },{
              name: 'e',
              low:0,
              high:113
          }]
        }]

      }

Answer 1

在这种情况下应该使用的系列是棒棒糖，但对象数组配置似乎不起作用。我在 Highcharts Github 问题频道上报告了它，您可以在其中关注此主题：https://github.com/highcharts/highcharts/issues/13202

作为 dumbell 系列中的解决方案，我建议在 render 回调中找到这些图形并隐藏它们。

演示：https://jsfiddle.net/BlackLabel/3o7acsbt/

  events: {
    render() {
        let chart = this;

      chart.series[0].points.forEach(p => {
        if (p.low >= 0){
          p.lowerGraphic.hide()
        } else {
            p.upperGraphic.hide()
        }
      })
    }
  }

API: https://api.highcharts.com/highcharts/chart.events.render

编辑

在 GitHub link 下，解决方法出现了。请检查一下，也许会更适合您的要求。

highcharts lollipop/dumbbell 正负标记值的图表变化 position/colour

highcharts lollipop/dumbbell chart change position/colour of positive and negative marker values

highcharts

position

marker