highcharts - 根据y值改变区域的颜色

Question

如何根据同一系列中的y值更改区域类型图的颜色？

---

图表类型 - 区域

---

y-值可能 - 1,2和3

---

所需输出 - 绿色区域,用于3和2之间的值,红色区域,用于2和1之间的值

Answer 1

有两个选项,你的解释缺乏信息,所以我告诉你他们两个:http://jsfiddle.net/4vzEt/13/

1. 负色阈值:

   $("#container1").highcharts({
     series: [{
       threshold: 2,
       negativeColor: 'red',
       color: 'green',
       type: 'area',
       data: [1, 2, 2, 1, 3, 3, 2, 3, 2, 1, 1, 3, 1, 1]
     }]
   });
   

   注意:阈值设置在该值中开始系列的y值.

2. 渐变色:

   $("#container2").highcharts({
       series: [{
           threshold: 1,
           color: {
               linearGradient: {
                   x1: 0,
                   x2: 0,
                   y1: 0,
                   y2: 1
               },
               stops: [
                   [0, 'green'],
                   [0.49, 'green'],
                   [0.5, 'red'],
                   [1, 'red']
               ]
           },
           type: 'area',
           data: [1, 2, 2, 1, 3, 3, 2, 3, 2, 1, 1, 3, 1, 1]
       }]
   });
   

   注意:标记继承系列颜色.禁用它们,或直接为每个点颜色设置.