Skip to content

Commit

Permalink
simplify logic in targeting tab
Browse files Browse the repository at this point in the history 
also adds a reset button
  • Loading branch information
@srimanachanta
srimanachanta committed Dec 19, 2023
1 parent 77914a4 commit 9b487f4
Showing 1 changed file with 87 additions and 85 deletions.
172 changes: 87 additions & 85 deletions photon-client/src/components/dashboard/tabs/TargetsTab.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,50 +2,23 @@
import { useCameraSettingsStore } from "@/stores/settings/CameraSettingsStore";
import { PipelineType } from "@/types/PipelineTypes";
import { useStateStore } from "@/stores/StateStore";
import Vue, { ref, watch } from "vue";
import type { Transform3d } from "@/types/PhotonTrackingTypes";
let oldResults: {targets: Transform3d[]} = Vue.observable({ targets: [] });
let stdev = ref({
x: 0,
y: 0,
z: 0,
x_angle: 0,
y_angle: 0,
z_angle: 0
});
const calculateStdDev = (values: number[]): number => {
if (values.length < 2) return 0;
const standardDeviation = (arr, usePopulation = false) => {
if (arr.length < 2) {
return 0;
}
const mean = values.reduce((sum, number) => sum + number, 0) / values.length;
const mean = arr.reduce((acc, val) => acc + val, 0) / arr.length;
return Math.sqrt(
arr
.reduce((acc, val) => acc.concat((val - mean) ** 2), [])
.reduce((acc, val) => acc + val, 0) /
(arr.length - (usePopulation ? 0 : 1))
);
return Math.sqrt(values.map((x) => Math.pow(x - mean, 2)).reduce((a, b) => a + b) / values.length);
};
const resetCurrentBuffer = () => {
// Need to clear the array in place
while (useStateStore().currentMultitagBuffer?.length != 0) useStateStore().currentMultitagBuffer?.pop();
};
watch(() => useStateStore().currentPipelineResults?.multitagResult?.bestTransform, (newThing: any) => {
oldResults.targets.push(newThing);
oldResults.targets = oldResults.targets.filter(item => item).slice(-100);
stdev.value.x = standardDeviation(oldResults.targets.map(it => it.x));
stdev.value.y = standardDeviation(oldResults.targets.map(it => it.y));
stdev.value.z = standardDeviation(oldResults.targets.map(it => it.z));
stdev.value.x_angle = standardDeviation(oldResults.targets.map(it => it.angle_x));
stdev.value.y_angle = standardDeviation(oldResults.targets.map(it => it.angle_y));
stdev.value.z_angle = standardDeviation(oldResults.targets.map(it => it.angle_z));
});
</script>

<template>
<div>
<v-row align="start" class="pb-4" style="height: 300px">
<!-- Simple table height must be set here and in the CSS for the fixed-header to work -->
<v-simple-table fixed-header dense dark>
<template #default>
<thead style="font-size: 1.25rem">
Expand Down Expand Up @@ -116,63 +89,92 @@ watch(() => useStateStore().currentPipelineResults?.multitagResult?.bestTransfor
</template>
</v-simple-table>
</v-row>
<template
<v-container
v-if="
(useCameraSettingsStore().currentPipelineType === PipelineType.AprilTag ||
useCameraSettingsStore().currentPipelineType === PipelineType.Aruco) &&
useCameraSettingsStore().currentPipelineSettings.doMultiTarget &&
useCameraSettingsStore().currentPipelineSettings.doMultiTarget &&
useCameraSettingsStore().isCurrentVideoFormatCalibrated &&
useCameraSettingsStore().currentPipelineSettings.solvePNPEnabled
"
>
<v-row
align="start"
class="pb-4 white--text"
>
<v-card-subtitle class="ma-0 pa-0 pb-4" style="font-size: 16px">Multi-tag pose, field-to-camera</v-card-subtitle>
<v-simple-table fixed-header height="100%" dense dark>
<thead style="font-size: 1.25rem">
<th class="text-center">X meters</th>
<th class="text-center">Y meters</th>
<th class="text-center">Z meters</th>
<th class="text-center">X Angle &theta;&deg;</th>
<th class="text-center">Y Angle &theta;&deg;</th>
<th class="text-center">Z Angle &theta;&deg;</th>
<th class="text-center">Tags</th>
</thead>
<tbody v-show="useStateStore().currentPipelineResults?.multitagResult">
<td>{{ useStateStore().currentPipelineResults?.multitagResult?.bestTransform.x.toFixed(2) }}&nbsp;m</td>
<td>{{ useStateStore().currentPipelineResults?.multitagResult?.bestTransform.y.toFixed(2) }}&nbsp;m</td>
<td>{{ useStateStore().currentPipelineResults?.multitagResult?.bestTransform.z.toFixed(2) }}&nbsp;m</td>
<td>{{ useStateStore().currentPipelineResults?.multitagResult?.bestTransform.angle_x.toFixed(2) }}&deg;</td>
<td>{{ useStateStore().currentPipelineResults?.multitagResult?.bestTransform.angle_y.toFixed(2) }}&deg;</td>
<td>{{ useStateStore().currentPipelineResults?.multitagResult?.bestTransform.angle_z.toFixed(2) }}&deg;</td>
<td>{{ useStateStore().currentPipelineResults?.multitagResult?.fiducialIDsUsed }}</td>
</tbody>
</v-simple-table>
</v-row>
<v-row align="start" class="pb-4 white--text">
<v-card-subtitle class="ma-0 pa-0 pb-4" style="font-size: 16px">Multi-tag pose standard deviation over 100 samples</v-card-subtitle>
<v-simple-table fixed-header height="100%" dense dark>
<thead style="font-size: 1.25rem">
<th class="text-center">X meters</th>
<th class="text-center">Y meters</th>
<th class="text-center">Z meters</th>
<th class="text-center">X Angle &theta;&deg;</th>
<th class="text-center">Y Angle &theta;&deg;</th>
<th class="text-center">Z Angle &theta;&deg;</th>
</thead>
<tbody v-show="useStateStore().currentPipelineResults?.multitagResult">
<td>{{ stdev.x.toFixed(5) }}&nbsp;m</td>
<td>{{ stdev.y.toFixed(5) }}&nbsp;m</td>
<td>{{ stdev.z.toFixed(5) }}&nbsp;m</td>
<td>{{ stdev.x_angle.toFixed(5) }}&deg;</td>
<td>{{ stdev.y_angle.toFixed(5) }}&deg;</td>
<td>{{ stdev.z_angle.toFixed(5) }}&deg;</td>
</tbody>
</v-simple-table>
</v-row>
</template>
<v-row class="pb-4 white--text">
<v-card-subtitle class="ma-0 pa-0 pb-4" style="font-size: 16px"
>Multi-tag pose, field-to-camera</v-card-subtitle
>
<v-simple-table fixed-header height="100%" dense dark>
<thead style="font-size: 1.25rem">
<th class="text-center">X meters</th>
<th class="text-center">Y meters</th>
<th class="text-center">Z meters</th>
<th class="text-center">X Angle &theta;&deg;</th>
<th class="text-center">Y Angle &theta;&deg;</th>
<th class="text-center">Z Angle &theta;&deg;</th>
<th class="text-center">Tags</th>
</thead>
<tbody v-show="useStateStore().currentPipelineResults?.multitagResult">
<td>{{ useStateStore().currentPipelineResults?.multitagResult?.bestTransform.x.toFixed(2) }}&nbsp;m</td>
<td>{{ useStateStore().currentPipelineResults?.multitagResult?.bestTransform.y.toFixed(2) }}&nbsp;m</td>
<td>{{ useStateStore().currentPipelineResults?.multitagResult?.bestTransform.z.toFixed(2) }}&nbsp;m</td>
<td>{{ useStateStore().currentPipelineResults?.multitagResult?.bestTransform.angle_x.toFixed(2) }}&deg;</td>
<td>{{ useStateStore().currentPipelineResults?.multitagResult?.bestTransform.angle_y.toFixed(2) }}&deg;</td>
<td>{{ useStateStore().currentPipelineResults?.multitagResult?.bestTransform.angle_z.toFixed(2) }}&deg;</td>
<td>{{ useStateStore().currentPipelineResults?.multitagResult?.fiducialIDsUsed }}</td>
</tbody>
</v-simple-table>
</v-row>
<v-row class="pb-4 white--text" style="display: flex; flex-direction: column">
<v-card-subtitle class="ma-0 pa-0 pb-4 pr-4" style="font-size: 16px"
>Multi-tag pose standard deviation over the last {{ useStateStore().currentMultitagBuffer.length }}/100
samples
</v-card-subtitle>
<v-btn color="secondary" class="mb-4 mt-1" style="width: min-content" depressed @click="resetCurrentBuffer"
>Reset Samples</v-btn
>
<v-simple-table fixed-header height="100%" dense dark>
<thead style="font-size: 1.25rem">
<th class="text-center">X meters</th>
<th class="text-center">Y meters</th>
<th class="text-center">Z meters</th>
<th class="text-center">X Angle &theta;&deg;</th>
<th class="text-center">Y Angle &theta;&deg;</th>
<th class="text-center">Z Angle &theta;&deg;</th>
</thead>
<tbody v-show="useStateStore().currentPipelineResults?.multitagResult">
<td>
{{
calculateStdDev(useStateStore().currentMultitagBuffer?.map((v) => v.bestTransform.x)).toFixed(5)
}}&nbsp;m
</td>
<td>
{{
calculateStdDev(useStateStore().currentMultitagBuffer?.map((v) => v.bestTransform.y)).toFixed(5)
}}&nbsp;m
</td>
<td>
{{
calculateStdDev(useStateStore().currentMultitagBuffer?.map((v) => v.bestTransform.z)).toFixed(5)
}}&nbsp;m
</td>
<td>
{{
calculateStdDev(useStateStore().currentMultitagBuffer?.map((v) => v.bestTransform.angle_x)).toFixed(5)
}}&deg;
</td>
<td>
{{
calculateStdDev(useStateStore().currentMultitagBuffer?.map((v) => v.bestTransform.angle_y)).toFixed(5)
}}&deg;
</td>
<td>
{{
calculateStdDev(useStateStore().currentMultitagBuffer?.map((v) => v.bestTransform.angle_z)).toFixed(5)
}}&deg;
</td>
</tbody>
</v-simple-table>
</v-row>
</v-container>
</div>
</template>
Expand Down

0 comments on commit 9b487f4

Please sign in to comment.