如何创建一个突出显示顶部区域的highcharts区域？

Question

高图中的区域默认突出显示底部区域。

我想突出显示顶部区域。

有推荐的方法吗？

基于this demo，我可以将阈值更改为250以获得类似的结果（如我的期望所示）

我能想出的唯一解决方案是：

1. 找出所有数据点的最大值。

2. 让MAX = k * y_max。 （k是自定义因素，例如1.2;为了获得更好的结果，还需要y_min才能获得正确的k

3. 使用以下配置。

yAxis: {
   max: MAX 
},
plotOptions: {
    series: {
        threshold: MAX 
    }
}

但这需要一些js计算，我想知道highcharts是否支持这个。

更新：

我想我最好在这里陈述我原来的问题。我想支持3种类型的区域：

1. 在Upperbound和Lowerbound内
2. 低于下限
3. 高于上限

我用arearange实现了第一个。但是arearange不支持缺失上/下限;如果缺少一个边界，它将完全删除阈值。

有没有办法避免自己计算threshold设置？

Answer 1

使用CSS可以获得类似于图片的内容：

.highcharts-plot-background {
  fill:rgba(255,0,0,0.5);
}

<script src="https://code.highcharts.com/highcharts.js"></script>

<div id="container" style="height: 400px"></div>

threshold

与negativeColor一起使用Highcharts.chart('container2', { chart: { type: 'area' }, xAxis: { categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] }, series: [{ data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4], color: "#FF0000", fillColor: '#f00000', fillOpacity: 0.5, threshold: 300, negativeColor: '#f00000', negativeFillColor: 'rgba(255,0,0,0.5)' }] });

或几乎完全相同：

<script src="https://code.highcharts.com/highcharts.js"></script>

<div id="container2" style="height: 400px"></div>

 */
protected $commands = [
    'App\Console\Commands\GoogleAdsCronJob',
];

/**
 * Define the application's command schedule.
 *
 * @param  \Illuminate\Console\Scheduling\Schedule  $schedule
 * @return void
 */
protected function schedule(Schedule $schedule)
{
    $schedule->command('googleads:cron')
        ->everyFiveMinutes()
        ->appendOutputTo(self::LOG_PATH);
}

这是一个小提琴：http://jsfiddle.net/beaver71/0sameLb6/

Answer 2

谢谢@TorsteinHonsi。

我发布了issue，@ TorsteinHonsi迅速做出回应并提交change。 area很快会支持-Infinity/Infinity。