Автоматическое обновление и сохранение графиков на текущую дату в режиме реального времени - PullRequest
2 голосов
/ 22 марта 2019

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

Вызов

  1. Я хочу иметь возможность автоматически обновлять диаграмму до текущей даты / времени (следующий день), даже если пользовательские данные не получены с сервера.

  2. Сохранение данных во избежание возврата пользователя к предыдущему дню на графике

Сценарий

Последнее действие пользователя было 20 марта , поэтому данные отображаются на графике до 20 марта , но когда текущая дата меняется на 21 марта я хочу график автоматически обновляется до 21, то есть с {x: 21 марта y: 0} и дальнейшим обновлением {y} , когда данные поступают с сервера в тот же день и с момента обновление для такого сценария будет выполнено на стороне клиента. Я хочу знать, как сохранить такие данные, например {x: 21 марта y: 0} на стороне клиента, чтобы избежать возврата к предыдущему дню при перезагрузке страницы

пример кода (непостоянный)

let lastDate = current day;
let data = []

function getNextDay(baseval) {
  var newDate = baseval + 86400000;
  lastDate = newDate;
  data.push({
    x: newDate,
    y: 0
  })
}

// calling getNextday function

 updateToNextDay() {
      window.setInterval(() => {
        getNextDay(lastDate)
        this.$refs.realtimeChart.updateSeries([{
          data: data
        }])
      }, 86400000)

Приведенный выше код автоматически отправляет данные на следующую дату x: newDate и y: 0 , и диаграмма обновляется соответствующим образом в setTimeInterval. Но видно, что эти данные будут потеряны сразу после перезагрузки страницы пользователем.

Мои мысли

Подумываю об использовании localalstorage для сохранения данных в браузере

Наконец

я хочу знать, как поступить с таким сценарием в моем случае

спасибо.

...