控制背景图像/图案的定位

Question

我的最终目标是创建一个"区域范围"图表,该图表使用下面的示例背景图像,使得y轴上的给定值(例如56)始终由图像中的相同颜色/位置表示.

正如您在下面的小提琴中所看到的,我能够使用highcharts创建一个"区域范围"图表,该图表使用任意图像填充/遮蔽范围内的区域.但是,即使两个图表具有不同的(y轴)值,颜色也完全相同; 6月份"图1"的峰值与"图2"的颜色相同,即使它们的值不同(301对401).

与填充颜色/图案有关的代码:

    fillColor: {
        pattern: 'http://i.stack.imgur.com/dezhE.png',
        width: 10,
        height: 300
    }

是否有可能以某种方式指定背景图像应覆盖y轴上的特定范围？

示例图片:

在此输入图像描述

更新:出于某种原因,当在浏览器以外的浏览器中查看时,图表背景不再显示为渐变,因此我附上了小提琴的截图:

在此输入图像描述

Answer 1

当您渲染图表时，请使用以下命令：

/*********************************************************
* Generate the example chart
*********************************************************/

/*********************************************************
* Generate the example chart
*********************************************************/

它将 Y 轴的起点 (Math.round(testData[0][0] / 100) * 100) 添加到图像的高度。

（仅对您提供的代码进行了微小的更改）

差别有点微妙