Highcharts - Добавить вертикальные линии от точки желания

Question

нужно рисовать вертикальные линии от желаемой точки, а не начиная с 0.

plotLines: [{ 
      color: '#FF0000', 
      width: 1, 
      value: 4 
     }, { 
      color: '#FF0000', 
      width: 1, 
      value: 7 
     }], 

Вот ссылка скрипача: http://jsfiddle.net/bpswt3tr/4/

Мое требование заключается в разработке первая вертикальная линия, когда значение y равно 110,2 и 2-я строка, когда значение y составляет 135,6 вместо начала с нуля. то есть выше линии графика. Пожалуйста, предложите, как я могу это достичь? Благодарю.

Answer 1

С учетом documentation маловероятно, что HighCharts поддерживает это по умолчанию, так как вам разрешено связывать значение текущей оси с линией.

Возможно, вам понадобится шаг предварительной обработки, который инвертирует функцию, чтобы получить соответствующие значения X. Что-то вроде:

invert(data, Y) -> list of X values with data[X] = Y 

Answer 2

Вы можете сделать это на chart.events.load вызова. Если вы знаете, что это те точки, которые вы хотите добавить элементы маркера, тогда это довольно просто. Сначала вы получите текущее значение метки max для yAxis. Затем вы добавляете серию к диаграмме, начальная точка которой является значением вашей серии, а вторая точка является максимальным видимым значением yAxis. Затем сделайте то же самое для второй точки, в которую хотите добавить панель. Затем вам нужно переустановить значение yAxis max в исходное состояние, потому что highcharts попытаются увеличить масштаб для размещения новых точек.

chart: { 
     events: { 
      load: function() { 
       var yMAx = this.yAxis[0].max; 
       console.log(yMAx); 

       this.addSeries({ 
        data: [{ 
         x: 4, 
         y: 110.2, 
         marker: { 
          symbol: 'triangle' 
         } 
        }, { 
         x: 4, 
         y: yMAx, 
         marker: { 
          symbol: 'triangle-down' 
         } 
        }, ], 
        showInLegend: false, 
        color: 'red', 
        marker: { 
         enabled: true 
        } 
       }); 

       this.addSeries({ 
        data: [{ 
         x: 7, 
         y: 135.6, 
         marker: { 
          symbol: 'triangle' 
         } 
        }, { 
         x: 7, 
         y: yMAx, 
         marker: { 
          symbol: 'triangle-down' 
         } 
        }, ], 
        showInLegend: false, 
        color: 'red', 
        marker: { 
         enabled: true 
        } 
       }); 

       this.yAxis[0].update({ 
        max: yMAx 
       }); 
      } 
     } 
    } 

Образец demo.