sergeysav/telemetry_visualization
1
0
Fork 0
Code Issues 7 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

applies formatting and linting

Browse Source
This commit is contained in:
Sergey Savelyev
2025-01-01 15:51:19 -05:00
parent 825b85ddad
commit 59431ebfff
13 changed files with 325 additions and 179 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
frontend/src/components/TelemetryLine.vue
View File

@@ -35,14 +35,13 @@ const legend_line_length = 8;
const legend_text_offset = 4;
const text_offset = computed(() => 10);
const min_sep = computed(() => Math.min(props.minimum_separation || 0, maximum_minimum_separation_live));
const min_sep = computed(() =>
Math.min(props.minimum_separation || 0, maximum_minimum_separation_live),
);
const { data } = useTelemetry(() => props.data);
const websocket = inject<ShallowRef<WebsocketHandle>>(WEBSOCKET_SYMBOL)!;
const value = websocket.value.listen_to_telemetry(
data,
min_sep,
);
const value = websocket.value.listen_to_telemetry(data, min_sep);
const graph_data = inject<GraphData>(GRAPH_DATA)!;
const axis_data = inject<AxisData>(AXIS_DATA)!;
@@ -128,7 +127,9 @@ watch(
max.value = item_val;
}
}
memo.value.reduce_to_maximum_separation(props.minimum_separation || 0);
memo.value.reduce_to_maximum_separation(
props.minimum_separation || 0,
);
triggerRef(memo);
debounced_recompute();
} catch (e) {
@@ -251,28 +252,41 @@ const current_value = computed(() => {
});
const legend_x = computed(() => {
return toValue(graph_data.legend_x) + toValue(graph_data.legend_x_stride) * index.value;
return (
toValue(graph_data.legend_x) +
toValue(graph_data.legend_x_stride) * index.value
);
});
const legend_y = computed(() => {
return toValue(graph_data.legend_y) + toValue(graph_data.legend_y_stride) * index.value;
return (
toValue(graph_data.legend_y) +
toValue(graph_data.legend_y_stride) * index.value
);
});
const legend_text = computed(() => {
const max_chars = (toValue(graph_data.legend_width) - legend_line_length - legend_text_offset * 2) / 7;
const max_chars =
(toValue(graph_data.legend_width) -
legend_line_length -
legend_text_offset * 2) /
7;
const start_text = props.data;
if (start_text.length > max_chars) {
return start_text.substring(0, 3) + "..." + start_text.substring(start_text.length - max_chars + 6);
return (
start_text.substring(0, 3) +
'...' +
start_text.substring(start_text.length - max_chars + 6)
);
}
return start_text;
});
const legend_line = computed(() => {
let x = legend_x.value;
let y = legend_y.value;
const x = legend_x.value;
const y = legend_y.value;
return `${x},${y} ${x + legend_line_length},${y}`;
});
</script>
<template>
@@ -292,13 +306,11 @@ const legend_line = computed(() => {
>
</ValueLabel>
<template v-if="toValue(graph_data.legend_enabled)">
<polyline
fill="none"
:points="legend_line"
></polyline>
<polyline fill="none" :points="legend_line"></polyline>
<text
:x="legend_x + legend_line_length + legend_text_offset"
:y="legend_y">
:y="legend_y"
>
{{ legend_text }}
</text>
</template>
@@ -321,5 +333,4 @@ text {
dominant-baseline: middle;
font-size: variables.$small-monospace-text-size;
}
</style>