Update types, simplify LogCanvas code

This commit is contained in:
Piotr Rogowski 2021-12-14 23:17:14 +01:00
parent 6e616cd85d
commit 5efa4a6c31
No known key found for this signature in database
GPG Key ID: F40F61D5587F5673
3 changed files with 27 additions and 35 deletions

14
package-lock.json generated
View File

@ -30,7 +30,7 @@
"@craco/craco": "^6.4.3",
"@speedy-tuner/eslint-config": "^0.1.3",
"@types/d3": "^7.0.0",
"@types/node": "^16.11.12",
"@types/node": "^16.11.13",
"@types/pako": "^1.0.2",
"@types/react": "^17.0.37",
"@types/react-dom": "^17.0.11",
@ -3757,9 +3757,9 @@
"integrity": "sha512-Klz949h02Gz2uZCMGwDUSDS1YBlTdDDgbWHi+81l29tQALUtvz4rAYi5uoVhE5Lagoq6DeqAUlbrHvW/mXDgdQ=="
},
"node_modules/@types/node": {
"version": "16.11.12",
"resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.12.tgz",
"integrity": "sha512-+2Iggwg7PxoO5Kyhvsq9VarmPbIelXP070HMImEpbtGCoyWNINQj4wzjbQCXzdHTRXnqufutJb5KAURZANNBAw=="
"version": "16.11.13",
"resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.13.tgz",
"integrity": "sha512-eUXZzHLHoZqj1frtUetNkUetYoJ6X55UmrVnFD4DMhVeAmwLjniZhtBmsRiemQh4uq4G3vUra/Ws/hs9vEvL3Q=="
},
"node_modules/@types/normalize-package-data": {
"version": "2.4.1",
@ -26375,9 +26375,9 @@
"integrity": "sha512-Klz949h02Gz2uZCMGwDUSDS1YBlTdDDgbWHi+81l29tQALUtvz4rAYi5uoVhE5Lagoq6DeqAUlbrHvW/mXDgdQ=="
},
"@types/node": {
"version": "16.11.12",
"resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.12.tgz",
"integrity": "sha512-+2Iggwg7PxoO5Kyhvsq9VarmPbIelXP070HMImEpbtGCoyWNINQj4wzjbQCXzdHTRXnqufutJb5KAURZANNBAw=="
"version": "16.11.13",
"resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.13.tgz",
"integrity": "sha512-eUXZzHLHoZqj1frtUetNkUetYoJ6X55UmrVnFD4DMhVeAmwLjniZhtBmsRiemQh4uq4G3vUra/Ws/hs9vEvL3Q=="
},
"@types/normalize-package-data": {
"version": "2.4.1",

View File

@ -50,7 +50,7 @@
"@craco/craco": "^6.4.3",
"@speedy-tuner/eslint-config": "^0.1.3",
"@types/d3": "^7.0.0",
"@types/node": "^16.11.12",
"@types/node": "^16.11.13",
"@types/pako": "^1.0.2",
"@types/react": "^17.0.37",
"@types/react-dom": "^17.0.11",

View File

@ -94,35 +94,27 @@ const LogCanvas = ({ data, width, height, selectedFields }: Props) => {
}, [filtered, selectedFields]);
useEffect(() => {
let chart: TimeChart;
const series = selectedFields.map((field) => ({
name: field.label,
color: hsl(selectedFields.indexOf(field), selectedFields.length),
data: data.map((entry) => ({
x: entry.Time as number,
y: entry[field.label] as number,
})).filter((entry) => entry.x !== undefined || entry.y !== undefined),
}));
if (canvasRef.current) {
const series = selectedFields.map((field) => ({
name: field.label,
color: hsl(selectedFields.indexOf(field), selectedFields.length),
data: data.map((entry) => ({
x: entry.Time as number,
y: entry[field.label] as number,
})).filter((entry) => entry.x !== undefined || entry.y !== undefined),
}));
const chart = new TimeChart(canvasRef.current!, {
series,
lineWidth: 2,
tooltip: true,
legend: false,
zoom: {
x: { autoRange: true },
y: { autoRange: true },
},
});
chart = new TimeChart(canvasRef.current as HTMLDivElement, {
series,
lineWidth: 2,
tooltip: true,
legend: false,
zoom: {
x: { autoRange: true },
y: { autoRange: true },
},
});
}
return () => {
if (chart) {
chart.dispose();
}
};
return () => chart.dispose();
}, [data, fieldsToPlot, filtered, hsl, selectedFields, width, height]);
return (