Update types, simplify LogCanvas code
This commit is contained in:
parent
6e616cd85d
commit
5efa4a6c31
|
@ -30,7 +30,7 @@
|
||||||
"@craco/craco": "^6.4.3",
|
"@craco/craco": "^6.4.3",
|
||||||
"@speedy-tuner/eslint-config": "^0.1.3",
|
"@speedy-tuner/eslint-config": "^0.1.3",
|
||||||
"@types/d3": "^7.0.0",
|
"@types/d3": "^7.0.0",
|
||||||
"@types/node": "^16.11.12",
|
"@types/node": "^16.11.13",
|
||||||
"@types/pako": "^1.0.2",
|
"@types/pako": "^1.0.2",
|
||||||
"@types/react": "^17.0.37",
|
"@types/react": "^17.0.37",
|
||||||
"@types/react-dom": "^17.0.11",
|
"@types/react-dom": "^17.0.11",
|
||||||
|
@ -3757,9 +3757,9 @@
|
||||||
"integrity": "sha512-Klz949h02Gz2uZCMGwDUSDS1YBlTdDDgbWHi+81l29tQALUtvz4rAYi5uoVhE5Lagoq6DeqAUlbrHvW/mXDgdQ=="
|
"integrity": "sha512-Klz949h02Gz2uZCMGwDUSDS1YBlTdDDgbWHi+81l29tQALUtvz4rAYi5uoVhE5Lagoq6DeqAUlbrHvW/mXDgdQ=="
|
||||||
},
|
},
|
||||||
"node_modules/@types/node": {
|
"node_modules/@types/node": {
|
||||||
"version": "16.11.12",
|
"version": "16.11.13",
|
||||||
"resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.12.tgz",
|
"resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.13.tgz",
|
||||||
"integrity": "sha512-+2Iggwg7PxoO5Kyhvsq9VarmPbIelXP070HMImEpbtGCoyWNINQj4wzjbQCXzdHTRXnqufutJb5KAURZANNBAw=="
|
"integrity": "sha512-eUXZzHLHoZqj1frtUetNkUetYoJ6X55UmrVnFD4DMhVeAmwLjniZhtBmsRiemQh4uq4G3vUra/Ws/hs9vEvL3Q=="
|
||||||
},
|
},
|
||||||
"node_modules/@types/normalize-package-data": {
|
"node_modules/@types/normalize-package-data": {
|
||||||
"version": "2.4.1",
|
"version": "2.4.1",
|
||||||
|
@ -26375,9 +26375,9 @@
|
||||||
"integrity": "sha512-Klz949h02Gz2uZCMGwDUSDS1YBlTdDDgbWHi+81l29tQALUtvz4rAYi5uoVhE5Lagoq6DeqAUlbrHvW/mXDgdQ=="
|
"integrity": "sha512-Klz949h02Gz2uZCMGwDUSDS1YBlTdDDgbWHi+81l29tQALUtvz4rAYi5uoVhE5Lagoq6DeqAUlbrHvW/mXDgdQ=="
|
||||||
},
|
},
|
||||||
"@types/node": {
|
"@types/node": {
|
||||||
"version": "16.11.12",
|
"version": "16.11.13",
|
||||||
"resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.12.tgz",
|
"resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.13.tgz",
|
||||||
"integrity": "sha512-+2Iggwg7PxoO5Kyhvsq9VarmPbIelXP070HMImEpbtGCoyWNINQj4wzjbQCXzdHTRXnqufutJb5KAURZANNBAw=="
|
"integrity": "sha512-eUXZzHLHoZqj1frtUetNkUetYoJ6X55UmrVnFD4DMhVeAmwLjniZhtBmsRiemQh4uq4G3vUra/Ws/hs9vEvL3Q=="
|
||||||
},
|
},
|
||||||
"@types/normalize-package-data": {
|
"@types/normalize-package-data": {
|
||||||
"version": "2.4.1",
|
"version": "2.4.1",
|
||||||
|
|
|
@ -50,7 +50,7 @@
|
||||||
"@craco/craco": "^6.4.3",
|
"@craco/craco": "^6.4.3",
|
||||||
"@speedy-tuner/eslint-config": "^0.1.3",
|
"@speedy-tuner/eslint-config": "^0.1.3",
|
||||||
"@types/d3": "^7.0.0",
|
"@types/d3": "^7.0.0",
|
||||||
"@types/node": "^16.11.12",
|
"@types/node": "^16.11.13",
|
||||||
"@types/pako": "^1.0.2",
|
"@types/pako": "^1.0.2",
|
||||||
"@types/react": "^17.0.37",
|
"@types/react": "^17.0.37",
|
||||||
"@types/react-dom": "^17.0.11",
|
"@types/react-dom": "^17.0.11",
|
||||||
|
|
|
@ -94,9 +94,6 @@ const LogCanvas = ({ data, width, height, selectedFields }: Props) => {
|
||||||
}, [filtered, selectedFields]);
|
}, [filtered, selectedFields]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
let chart: TimeChart;
|
|
||||||
|
|
||||||
if (canvasRef.current) {
|
|
||||||
const series = selectedFields.map((field) => ({
|
const series = selectedFields.map((field) => ({
|
||||||
name: field.label,
|
name: field.label,
|
||||||
color: hsl(selectedFields.indexOf(field), selectedFields.length),
|
color: hsl(selectedFields.indexOf(field), selectedFields.length),
|
||||||
|
@ -106,7 +103,7 @@ const LogCanvas = ({ data, width, height, selectedFields }: Props) => {
|
||||||
})).filter((entry) => entry.x !== undefined || entry.y !== undefined),
|
})).filter((entry) => entry.x !== undefined || entry.y !== undefined),
|
||||||
}));
|
}));
|
||||||
|
|
||||||
chart = new TimeChart(canvasRef.current as HTMLDivElement, {
|
const chart = new TimeChart(canvasRef.current!, {
|
||||||
series,
|
series,
|
||||||
lineWidth: 2,
|
lineWidth: 2,
|
||||||
tooltip: true,
|
tooltip: true,
|
||||||
|
@ -116,13 +113,8 @@ const LogCanvas = ({ data, width, height, selectedFields }: Props) => {
|
||||||
y: { autoRange: true },
|
y: { autoRange: true },
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
}
|
|
||||||
|
|
||||||
return () => {
|
return () => chart.dispose();
|
||||||
if (chart) {
|
|
||||||
chart.dispose();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
}, [data, fieldsToPlot, filtered, hsl, selectedFields, width, height]);
|
}, [data, fieldsToPlot, filtered, hsl, selectedFields, width, height]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
Loading…
Reference in New Issue