如何为高图表的x轴和y轴添加背景颜色

Question

我正在尝试更改 highcharts x 和 y 轴背景的背景颜色。请提出任何解决方案。 我正在尝试填充如下突出显示的颜色。

Answer 1

我不记得高图表有任何属性来设置轴的背景颜色。但也许您可以使用 highchart SVGRenderer 创建自定义样式。 您可以使用它在轴后面创建一个矩形并用自定义颜色填充它。 有一个示例可以帮助您。

    Highcharts.chart('container', {
      chart: {
            spacingLeft: 0,
        events: {
          render: function() {
            const chart = this,
                        xAxisBox = (chart.axes[0].gridGroup.getBBox());
            chart.renderer.rect(xAxisBox.y/*position on X-axis*/ , chart.plotHeight + xAxisBox.y /*position on Y-axis*/ , chart.plotWidth /*width*/ , 25 /*height*/)
              .attr({
                'stroke-width': 0,
                stroke: 'orange',
                fill: 'orange',
                zIndex: 3
              })
              .add();
          }
        }
      },
      series: [{
        data: [2, 5, 2, 3, 6, 5]
      }]
    });