diff options
| author | Anton Tananaev <anton@traccar.org> | 2023-08-22 22:10:19 -0700 |
|---|---|---|
| committer | Anton Tananaev <anton@traccar.org> | 2023-08-22 22:10:19 -0700 |
| commit | 667d0f68daaa3916fac6653ef9994f6f2d05e177 (patch) | |
| tree | b181827abc4a82fda60aaf67d577347b8cc26155 /modern | |
| parent | aec9d7eeee98fa415ff425f7f36fe0ef9a799d37 (diff) | |
| download | trackermap-web-667d0f68daaa3916fac6653ef9994f6f2d05e177.tar.gz trackermap-web-667d0f68daaa3916fac6653ef9994f6f2d05e177.tar.bz2 trackermap-web-667d0f68daaa3916fac6653ef9994f6f2d05e177.zip | |
Fix chart X scale (fix #1167)
Diffstat (limited to 'modern')
| -rw-r--r-- | modern/src/reports/ChartReportPage.jsx | 22 |
1 files changed, 18 insertions, 4 deletions
diff --git a/modern/src/reports/ChartReportPage.jsx b/modern/src/reports/ChartReportPage.jsx index 2c33f0f5..643625df 100644 --- a/modern/src/reports/ChartReportPage.jsx +++ b/modern/src/reports/ChartReportPage.jsx @@ -1,3 +1,4 @@ +import moment from 'moment'; import React, { useState } from 'react'; import { FormControl, InputLabel, Select, MenuItem, @@ -51,7 +52,7 @@ const ChartReportPage = () => { const formattedPositions = positions.map((position) => { const data = { ...position, ...position.attributes }; const formatted = {}; - formatted.fixTime = formatTime(position.fixTime, 'time', hours12); + formatted.fixTime = moment(position.fixTime).valueOf(); Object.keys(data).filter((key) => !['id', 'deviceId'].includes(key)).forEach((key) => { const value = data[key]; if (typeof value === 'number') { @@ -122,10 +123,23 @@ const ChartReportPage = () => { top: 10, right: 40, left: 0, bottom: 10, }} > - <XAxis dataKey="fixTime" /> - <YAxis type="number" tickFormatter={(value) => value.toFixed(2)} domain={[minValue - valueRange / 5, maxValue + valueRange / 5]} /> + <XAxis + dataKey="fixTime" + type="number" + tickFormatter={(value) => formatTime(value, 'time', hours12)} + domain={['dataMin', 'dataMax']} + scale="time" + /> + <YAxis + type="number" + tickFormatter={(value) => value.toFixed(2)} + domain={[minValue - valueRange / 5, maxValue + valueRange / 5]} + /> <CartesianGrid strokeDasharray="3 3" /> - <Tooltip formatter={(value, key) => [value, positionAttributes[key]?.name || key]} /> + <Tooltip + formatter={(value, key) => [value, positionAttributes[key]?.name || key]} + labelFormatter={(value) => formatTime(value, 'seconds', hours12)} + /> <Line type="monotone" dataKey={type} /> </LineChart> </ResponsiveContainer> |