From 8eae9c2a09b2367aa1a4c0d1ec7b527faa3448a6 Mon Sep 17 00:00:00 2001 From: Matt Date: Thu, 21 Dec 2023 09:36:55 -0800 Subject: [PATCH] More jank stuff --- photon-client/package-lock.json | 31 +++++-- photon-client/package.json | 9 +- .../cameras/CameraCalibrationCard.vue | 85 ++++++++++++++----- .../src/components/common/LineChart.vue | 71 ++++++++++------ photon-client/src/types/SettingTypes.ts | 12 ++- 5 files changed, 146 insertions(+), 62 deletions(-) diff --git a/photon-client/package-lock.json b/photon-client/package-lock.json index e81f66b5e1..aba1b2aa4b 100644 --- a/photon-client/package-lock.json +++ b/photon-client/package-lock.json @@ -12,7 +12,8 @@ "@mdi/font": "^7.2.96", "@msgpack/msgpack": "^3.0.0-beta2", "axios": "^1.4.0", - "chart.js": "^2.9.3", + "chart.js": "2.9.3", + "chartjs-plugin-annotation": "^0.5.7", "core-js": "^3.30.2", "jspdf": "^2.5.1", "pinia": "^2.1.4", @@ -1614,9 +1615,9 @@ } }, "node_modules/chart.js": { - "version": "2.9.4", - "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-2.9.4.tgz", - "integrity": "sha512-B07aAzxcrikjAPyV+01j7BmOpxtQETxTSlQ26BEYJ+3iUkbNKaOJ/nDbT6JjyqYxseM0ON12COHYdU2cTIjC7A==", + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-2.9.3.tgz", + "integrity": "sha512-+2jlOobSk52c1VU6fzkh3UwqHMdSlgH1xFv9FKMqHiNCpXsGPQa/+81AFa+i3jZ253Mq9aAycPwDjnn1XbRNNw==", "dependencies": { "chartjs-color": "^2.1.0", "moment": "^2.10.2" @@ -1652,6 +1653,14 @@ "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz", "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==" }, + "node_modules/chartjs-plugin-annotation": { + "version": "0.5.7", + "resolved": "https://registry.npmjs.org/chartjs-plugin-annotation/-/chartjs-plugin-annotation-0.5.7.tgz", + "integrity": "sha512-tKN5KLc69unyZGTvSdhVQEyAOhVNnSkFCCgefZhO4UaqFfABZGFU/d9p6WM2KB0eXFs/rR3Jayh7dvyASC7K0A==", + "dependencies": { + "chart.js": "^2.4.0" + } + }, "node_modules/chokidar": { "version": "3.5.3", "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz", @@ -6642,9 +6651,9 @@ } }, "chart.js": { - "version": "2.9.4", - "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-2.9.4.tgz", - "integrity": "sha512-B07aAzxcrikjAPyV+01j7BmOpxtQETxTSlQ26BEYJ+3iUkbNKaOJ/nDbT6JjyqYxseM0ON12COHYdU2cTIjC7A==", + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-2.9.3.tgz", + "integrity": "sha512-+2jlOobSk52c1VU6fzkh3UwqHMdSlgH1xFv9FKMqHiNCpXsGPQa/+81AFa+i3jZ253Mq9aAycPwDjnn1XbRNNw==", "requires": { "chartjs-color": "^2.1.0", "moment": "^2.10.2" @@ -6682,6 +6691,14 @@ "color-name": "^1.0.0" } }, + "chartjs-plugin-annotation": { + "version": "0.5.7", + "resolved": "https://registry.npmjs.org/chartjs-plugin-annotation/-/chartjs-plugin-annotation-0.5.7.tgz", + "integrity": "sha512-tKN5KLc69unyZGTvSdhVQEyAOhVNnSkFCCgefZhO4UaqFfABZGFU/d9p6WM2KB0eXFs/rR3Jayh7dvyASC7K0A==", + "requires": { + "chart.js": "^2.4.0" + } + }, "chokidar": { "version": "3.5.3", "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz", diff --git a/photon-client/package.json b/photon-client/package.json index 1353ab95a3..a50beace73 100644 --- a/photon-client/package.json +++ b/photon-client/package.json @@ -17,7 +17,8 @@ "@mdi/font": "^7.2.96", "@msgpack/msgpack": "^3.0.0-beta2", "axios": "^1.4.0", - "chart.js": "^2.9.3", + "chart.js": "2.9.3", + "chartjs-plugin-annotation": "^0.5.7", "core-js": "^3.30.2", "jspdf": "^2.5.1", "pinia": "^2.1.4", @@ -30,17 +31,17 @@ }, "devDependencies": { "@rushstack/eslint-patch": "^1.3.2", - "@vue/eslint-config-prettier": "^8.0.0", - "@vue/eslint-config-typescript": "^11.0.3", - "prettier": "^3.0.0", "@types/node": "^16.11.45", "@types/three": "^0.154.0", "@vitejs/plugin-vue2": "^2.2.0", + "@vue/eslint-config-prettier": "^8.0.0", + "@vue/eslint-config-typescript": "^11.0.3", "@vue/tsconfig": "^0.1.3", "deepmerge": "^4.3.1", "eslint": "^8.45.0", "eslint-plugin-vue": "^9.0.0", "npm-run-all": "^4.1.5", + "prettier": "^3.0.0", "sass": "~1.32", "sass-loader": "^13.3.2", "terser": "^5.14.2", diff --git a/photon-client/src/components/cameras/CameraCalibrationCard.vue b/photon-client/src/components/cameras/CameraCalibrationCard.vue index 05bb9ab056..ca71208133 100644 --- a/photon-client/src/components/cameras/CameraCalibrationCard.vue +++ b/photon-client/src/components/cameras/CameraCalibrationCard.vue @@ -20,7 +20,7 @@ import loadingImage from "@/assets/images/loading.svg"; const settingsValid = ref(true); -const getCalibrationCoeffs = (resolution: Resolution) => { +const getCalibrationCoeffs = (resolution: Resolution): CameraCalibrationResult | undefined => { return useCameraSettingsStore().currentCameraSettings.completeCalibrations.find( (cal) => cal.resolution.width === resolution.width && cal.resolution.height === resolution.height ); @@ -42,7 +42,10 @@ const getUniqueVideoResolutions = (): VideoFormat[] => { it.reprojectionErrors.flatMap((it2) => [it2.x, it2.y]) ); // For each error, square it, sum the squares, and divide by total points N - format.mean = Math.sqrt(perViewSumSquareReprojectionError.map(it => Math.pow(it, 2)).reduce((a, b) => a + b, 0) / perViewSumSquareReprojectionError.length); + format.mean = Math.sqrt( + perViewSumSquareReprojectionError.map((it) => Math.pow(it, 2)).reduce((a, b) => a + b, 0) / + perViewSumSquareReprojectionError.length + ); format.horizontalFOV = 2 * Math.atan2(format.resolution.width / 2, calib.cameraIntrinsics.data[0]) * (180 / Math.PI); @@ -266,15 +269,17 @@ const reprojectionErrorSeries = () => { .flat(1); const xLocs = calib.observations.map((it) => it.locationInImageSpace.map((it) => it.x)).flat(1); const yLocs = calib.observations.map((it) => it.locationInImageSpace.map((it) => it.y)).flat(1); - console.log(errorNorms); - console.log(xLocs); - console.log(yLocs); + // console.log(errorNorms); + // console.log(xLocs); + // console.log(yLocs); function rgb(r, g, b) { return "rgb(" + r + "," + g + "," + b + ")"; } - const colors = errorNorms.map((it) => rgb(it * 200, 0, 0)); + const scale = 255.0 / Math.max(...errorNorms); + const colors = errorNorms.map(it => it * scale).map((it) => rgb(it, 0, 0)); + console.log(colors) return { datasets: [createSeries(`Reprojection error`, xLocs, yLocs, colors, false)] @@ -285,11 +290,13 @@ let showCal = ref(false); let calibrationDetails: Ref = ref(undefined); const showThing = (value: VideoFormat) => { - console.log(value); calibrationDetails.value = getCalibrationCoeffs(value.resolution); - console.log(calibrationDetails); showCal.value = true; }; + +let visShown = ref(0) +let observationIdx = ref(0) + diff --git a/photon-client/src/components/common/LineChart.vue b/photon-client/src/components/common/LineChart.vue index a8d8f54cf8..8a9ae06413 100644 --- a/photon-client/src/components/common/LineChart.vue +++ b/photon-client/src/components/common/LineChart.vue @@ -1,5 +1,6 @@