時間序列
LightningChart JS數(shù)據(jù)值總是用JavaScript數(shù)字來描述,當涉及到時間序列數(shù)據(jù)時,時間戳被描述為自ECMAScript紀元以來的毫秒數(shù)。
這聽起來可能很復雜但它很常見并且簡單。
const date = new Date(2022, 0, 1) // 1st Jan 2022 const timestamp = date.getTime() // 1640988000000 const dataPoint = { x: timestamp, y: Math.random() }
const dataPoint = { x: Date.now(), y: Math.random() }
分別地,表示時間的軸也應該作為時間戳進行測量,例如要顯示時間X軸從2022年1月開始到結束:
chart.getDefaultAxisX().setInterval({ start: new Date(2022, 0, 1).getTime(), // 1st Jan 2022 end: new Date(2022, 0, 31).getTime() // 31st Jan 2022 })
默認情況下軸顯示數(shù)字刻度,當軸間隔由時間戳配置時這一點意義不大,這可以通過激活時間軸上的DateTime刻度來改進:
chart.getDefaultAxisX().setTickStrategy(AxisTickStrategies.DateTime)
DateTime軸顯示帶有“2023年1月1日”等文本的刻度標簽,有關自定義格式請參見日期時間刻度標簽格式。對于較小的時間間隔,最好使用AxisTickStrategiesTime。
chart.getDefaultAxisX().setTickStrategy(AxisTickStrategies.Time)
這將導致類似于“00:00:00”(hh:mm:ss)的格式,并在需要時顯示毫秒和更小的單位。
DateTime軸間隔限制
如上所示,ECMAScript時間戳是非常大的數(shù)字(大約10*12),LightningChart軸間隔有一些限制(源于WebGL的使用),限制了可配置的開始和結束軸間隔。有關這方面的更多信息,請參閱變焦范圍限制。
在DateTime軸的情況下,當軸范圍(結束-開始)小于1天時達到實際限制——例如,縮放以查看時間序列數(shù)據(jù)中的單個秒。
有一些變通方法可以解決這個問題,最廣泛使用的是使用日期起源,這是一個三步操作:
- 將軸距任意移動,這樣開始將接近于零(而不是非常大的數(shù)字)。
- 同時將數(shù)據(jù)時間坐標移動相同的量,對每個數(shù)據(jù)點重復。
- 將數(shù)據(jù)的變化通知LightningChart,這將調(diào)整軸和光標格式,使其看起來像預期的那樣即使數(shù)據(jù)被移動。
通常使用日期起源意味著添加如下代碼:
const dateOrigin = new Date() // offset time coordinates by current time. const dateOriginTime = dateOrigin.getTime() // cache timestamp that matches `dateOrigin` for use later. // let timeSeriesData: { timestamp: number, measurement: number }[] const timeSeriesDataShifted = timeSeriesData.map((dataPoint) => ({ x: dataPoint.timestamp - dateOriginTime, // shift time coordinates to start close to 0 as a workaround to zoom range limitations. y: dataPoint.measurement })) lineSeries.add(timeSeriesDataShifted) chart.getDefaultAxisX().setTickStrategy( AxisTickStrategies.DateTime, (tickStrategy) => tickStrategy.setDateOrigin(dateOrigin) // tell LCJS how much time coordinates are shifted. )
使用日期起源解決方案會帶來額外的復雜性,并且還會給數(shù)據(jù)輸入增加一些性能開銷。目前,在大多數(shù)需要以小于1天的縮放范圍顯示時間序列數(shù)據(jù)的應用程序中,這是一個必然的弊端。