Как добавить defaultAxisXTickStrategy в LightningChart JS после инициализации диаграммы? - PullRequest
Новая
       3

Как добавить defaultAxisXTickStrategy в LightningChart JS после инициализации диаграммы?

2 голосов
/ 09 января 2020

Я инициализирую диаграмму следующим образом 

this.chart = lightningChart()
   .ChartXY({
       containerId: 'chartSection',
       theme: Themes.light
   })
  .setTitle('')

и привязываю данные позже и хотел бы добавить defaultAxisXTickStrategy позже при получении данных.

1 Ответ

4 голосов
/ 10 января 2020

defaultAxisXTickStrategy можно установить только при создании диаграммы.

Я предполагаю, что вы хотели бы иметь ось с тиковой стратегией, которая соответствует данным, которые вы получаете. Для этого вы можете вручную создать ось с помощью метода addAxisX графика. Этот метод принимает параметр axisTickStrategy. Затем, чтобы использовать эту ось, которая была только что создана, вы должны предоставить созданную ось опциям метода addLineSeries (или любой другой add ... series). {xAxis: createdAxis}. 

// Create a new chart
const chart = lcjs.lightningChart().ChartXY({
    containerId: 'target'
  })
  .setTitle('Demo Chart')

// after 2 seconds start adding data
setTimeout(() => {
  const dateOrigin = new Date()
  // create a new axis
  const createdAxis = chart.addAxisX(
    false, lcjs.AxisTickStrategies.DateTime(dateOrigin)
  )

  // create a new series using the previously created axis for X axis
  const lineSeries = chart.addLineSeries({
    xAxis: createdAxis
  })
  // dispose the default axis from X axis
  chart.getDefaultAxisX().dispose()

  // add new data twice a second
  let i = 0
  setInterval(() => {
    lineSeries.add({
      x: 1000 * i,
      y: Math.random() * 10
    })
    i++
  }, 500)

}, 2000)
body {
  height: 100vh;
}
<script src="https://unpkg.com/@arction/lcjs@1.2.2/dist/lcjs.iife.js"></script>
<div style="height: 100%;" id="target"></div>
...