修改头部图

This commit is contained in:
jingna 2025-08-13 10:00:56 +08:00
parent 0abe79ba1c
commit 08718766d4

View File

@ -103,6 +103,7 @@
<div style="display: flex;justify-content: space-between;padding: 0px 10px;padding-top: 10px;">
<div style="width: 33%;position: relative;">
<div class="chart-title">旋转角</div>
<div class="chart-titles">{{headlist.rotation}}</div>
<div id="rotationChartId" style="width: 100%;height: 140px;"></div>
<div class="gauge-group-box">
<div class="gauge-group-box-text1"><span class="gauge-group-box-text2">{{
@ -113,7 +114,8 @@
</div>
<div style="width: 33%;position: relative;">
<div class="chart-title">倾斜角</div>
<div id="pitchChartId" style="width: 100%;height: 140px;"></div>
<div class="chart-titles">{{headlist.tilt}}</div>
<div id="tiltChartId" style="width: 100%;height: 140px;"></div>
<div class="gauge-group-box">
<div class="gauge-group-box-text1"><span class="gauge-group-box-text2">{{
headPoseMaxValues.tiltLeftMax.toFixed(1) }}°</span></div>
@ -123,7 +125,8 @@
</div>
<div style="width: 33%;position: relative;">
<div class="chart-title">俯仰角</div>
<div id="tiltChartId" style="width: 100%;height: 140px;"></div>
<div class="chart-titles">{{headlist.pitch}}</div>
<div id="pitchChartId" style="width: 100%;height: 140px;"></div>
<div class="gauge-group-box">
<div class="gauge-group-box-text1"><span class="gauge-group-box-text2">{{
headPoseMaxValues.pitchDownMax.toFixed(1) }}°</span></div>
@ -669,6 +672,11 @@ const formattedTime = computed(() => {
const secs = seconds.value % 60;
return `${mins.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`;
});
const headlist = ref({
rotation:'0',
tilt:'0',
pitch:'0'
})
//
const startTimer = () => {
if (isRunning.value) return;
@ -987,7 +995,10 @@ const isTrackingMaxValues = ref(false)
function handleIMUData(data) {
try {
if (!data) return
console.log('IMU数据:', data)
headlist.value.rotation = data.rotation //
headlist.value.tilt = data.tilt //
headlist.value.pitch = data.pitch //
//
// 1) { rotation, tilt, pitch }
// 2) { head_pose: { rotation, tilt, pitch } }
@ -2689,6 +2700,17 @@ onUnmounted(() => {
font-size: 14px;
color: #EEF1FA;
}
.chart-titles {
position: absolute;
top: 4px;
right: 7px;
z-index: 2000;
font-family: 'Arial Negreta', 'Arial Normal', 'Arial', sans-serif;
font-weight: 700;
font-style: normal;
font-size: 14px;
color: #EEF1FA;
}
:deep(.el-table--border .el-table__inner-wrapper:after, .el-table--border:after, .el-table--border:before, .el-table__inner-wrapper:before) {
background-color: rgb(81, 81, 81) !important;