Динамическая настройка оси Y мин / макс на основе обновления ajax и точек данных в Highcharts - PullRequest
0 голосов
/ 28 апреля 2020

В настоящее время мои графики создаются, и затем у меня есть следующий вызов ajax, который создает plotLines на графике:

             $.ajax({
                type: "GET",
                url: "/limits",
                dataType: 'json',
                success: function (limits) {
                    console.log(limits);
                    graph1.yAxis[0].update({
                        plotLines: [{
                            value: limits[7].max,
                            color: 'orange',
                            dashStyle: 'dash',
                            width: 2,
                            label: {
                                text: 'USL'
                            }
                        }, {
                            value: limits[7].min,
                            color: 'orange',
                            dashStyle: 'dash',
                            width: 2,
                            label: {
                                text: 'LSL'
                            }
                        }]
                    });

Проблема заключается в том, что для некоторых графиков plotLines не определены Highcharts Диапазон оси Y (созданный из данных), поэтому plotLines не отображаются на графиках.

Я знаю, что мог бы сделать это, чтобы решить эту проблему:

             $.ajax({
                    type: "GET",
                    url: "/limits",
                    dataType: 'json',
                    success: function (limits) {
                        console.log(limits);
                        graph1.yAxis[0].update({
                            min: limits[7].min,
                            max: limits[7].max,
                            plotLines: [{
                                value: limits[7].max,
                                color: 'orange',
                                dashStyle: 'dash',
                                width: 2,
                                label: {
                                    text: 'USL'
                                }
                            }, {
                                value: limits[7].min,
                                color: 'orange',
                                dashStyle: 'dash',
                                width: 2,
                                label: {
                                    text: 'LSL'
                                }
                            }]
                        });

Однако .. если Тогда я должен был сделать это решение, если у графа есть точки за пределами plotLines, тогда эти точки не будут показаны.

Я полагаю, я мог бы сделать что-то вроде этого:

chart: {
  events: {
    load: function() {
      var min = yAxis[0].min;
      var max = yAxis[0].max;
      if (limits[7].max > max) {
        yAxis[0].setExtremes(null, (limits[7].max);
      }
    }
  }
}

I Я не совсем уверен, как включить этот тип логики c для max и min plotLines в функцию обновления.

Любая помощь будет очень признательна! Спасибо.

1 Ответ

0 голосов
/ 28 апреля 2020

Вы можете сравнить значение линии графика с фактическими крайними значениями оси и при необходимости изменить минимальные и максимальные свойства. Например:

yAxis.update({
  min: yAxis.min > limits.min ? limits.min : null,
  max: yAxis.max < limits.max ? limits.max : null,
  plotLines: [{
    value: limits.max,
    width: 2,
    color: 'orange'
  }, {
    value: limits.min,
    width: 2,
    color: 'blue'
  }]
});

Демонстрационная версия: http://jsfiddle.net/BlackLabel/6m4e8x0y/4989/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...