javascript - 系列中的子弹图在 y 值之后不显示

Question

设置 yAxis 的 y 值后，条的其余部分不会出现。例如。在代码中，我将 y 值设置为 20，但在 20 之后什么都没有。所以我想做的是把所有的线延伸到最大值并保持 20 。

屏幕截图

Highcharts.chart("container1", {
  chart: {
    marginTop: 40
  },
  title: {
    text: "Gauge Bar Chart"
  },
  xAxis: {
    categories: [
      '<span class="hc-cat-title">Revenue</span><br/>U.S. $ (1,000s)'
    ]
  },
  yAxis: {
    plotBands: [
      {
        from: 0,
        to: 1400,
        color: "#ffffff"
      }
    ],
    labels: {
      format: "{value}%"
    },
    title: null,
    max: 100,
    visible: true
  },

  series: [
    {
      animation: false,
      data: [
        {
          y: 20,
          target: 40
        }
      ]
    }
  ],

https://jsfiddle.net/mrtcnkrks/df1zbL9m/

我的目标是有背景直到 100% 在这里

Answer 1

您可以添加plotBands到 all xAxis，例如：

xAxis: {
    ...,
    plotBands: [{
        from: -0.18,
        to: 0.15,
        color: "gray"
    }]
},

现场演示：https ://jsfiddle.net/BlackLabel/oea97zhd/

API 参考：https ://api.highcharts.com/highcharts/yAxis.plotBands