highcharts。设置列/条背景颜色的完整高度

Question

我需要在Highcharts中将渐变背景颜色设置为列的完整高度。如下图所示。我该怎么做？请帮帮我。

here an example of what I need

Answer 1

制作另一个系列，其点数等于yAxis最大值。您可以使用pattern-fill插件并将模式设置为特定列。

$('#container').highcharts({
    chart: {
      type: 'column'
    },

    yAxis: {
      min: 0,
      max: 100
    },

    plotOptions: {
      series: {
        pointPadding: 0
      }
    },

    series: [{
        enableMouseTracking: false,
        showInLegend: false,
        grouping: false,
        color: 'url(#highcharts-default-pattern-1)',
        data: [100, 100]
    }, {
      data: [20, 50]
    }, {
      data: [40, 30]
    }]
});

您可以在此处详细了解如何修改/创建模式 - http://www.highcharts.com/docs/chart-design-and-style/gradients-shadows-and-patterns

实例和输出

http://jsfiddle.net/rgs9uv39/

Answer 2

转到此处并导入您的图片：http://www.colorzilla.com/gradient-editor/并获取您的css属性后。

如果您需要使用该元素全高度：

.yourClass {
    height: 100vh;
}