Автопрокрутка старшей диаграммы на новые данные, только если пользователь видит последние данные - PullRequest
Новая
       21

Автопрокрутка старшей диаграммы на новые данные, только если пользователь видит последние данные

0 голосов
/ 20 февраля 2020

У меня есть highstock в реакции приложения. Я добавил функцию загрузки исторических данных. Моя проблема в том, что мне нужно добавить как исторические данные, так и новые данные, которые могут происходить одновременно. Мне нужно понять, где пользователь на графике в настоящее время. Если график был прокручен, и пользователь видит исторические данные, мне ничего не нужно делать в случае добавления новых данных. Но если пользователь видит последние данные и диаграмма получает новые данные (не исторические), мне нужно автоматически прокрутить график, чтобы показать последние данные. Конечно, пользователь может прокручивать график назад и вперед. Я пытался изменить крайности следующим условием: 

if ( extremes.userMax === oldMax && extremes.userMax < dataMax ) {
 e.target.xAxis[ 0 ].setExtremes(
    dataMax - ( userMax - userMin ),
    dataMax
 );
}

, но это не работает.

Можно ли определить текущую позицию пользователя на графике?

Код выше был добавлен в качестве обратного вызова события для перерисовки.

1 Ответ

1 голос
/ 20 февраля 2020

Спасибо за ответ.

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

if ( e.target.xAxis ) {
   const extremes = e.target.xAxis[ 0 ].getExtremes();
   const { userMax, userMin, oldMax, dataMax } = e.target.xAxis[ 0 ];
   if ( extremes.userMax === oldMax && extremes.userMax < dataMax ) {
   e.target.xAxis[ 0 ].setExtremes(
      dataMax - ( userMax - userMin ),
      dataMax
   );
}

Может быть, мне нужно уточнить, как я храню и изменяю данные в избыточном формате. Все данные диаграммы, помещенные в массив: 

[{
  open(pin):1
  high(pin):3
  low(pin):1
  close(pin):2
  volume(pin):10
  x(pin):1581850800000
}, ...
]

Поэтому, если мне нужно загрузить исторические данные с сервера, я просто добавляю данные в начало массива. В случае, если мне нужно добавить новую свечу на график, я просто добавляю новый элемент в конец массива. Компонент Chart получает новый рядный ряд посредством обновления приставки.

UPD:

Я наконец-то решил свою проблему со следующими логами c в событии перерисовки: 

            if ( dataMax - userMax < pointRange * 2 ) {
                e.target.xAxis[ 0 ].setExtremes(
                    dataMax - ( userMax - userMin ),
                    dataMax,
                    false
                );
            }

Идея проверить, сколько свечей не видно пользователю, и если их больше 2, просто ничего не делайте, переместите график, чтобы показать последние свечи. false в setExtremes необходимо избегать бесконечной перерисовки.

...