From c0d636b5d72e7ce939c4a43067c5037b4953bf26 Mon Sep 17 00:00:00 2001
From: Benedikt Seeger <benedikt.seeger@ptb.de>
Date: Thu, 27 Feb 2025 14:45:24 +0100
Subject: [PATCH] improvemet of conformity rendering in the table
---
src/renderers/MeasurementRenderer.js | 119 +++++++++++++--------------
1 file changed, 55 insertions(+), 64 deletions(-)
diff --git a/src/renderers/MeasurementRenderer.js b/src/renderers/MeasurementRenderer.js
index dfa6e7b..b6ec032 100644
--- a/src/renderers/MeasurementRenderer.js
+++ b/src/renderers/MeasurementRenderer.js
@@ -1,5 +1,5 @@
import Plotly from 'plotly.js-dist';
-import { DCCRealListQuantity,DCCConformity } from '../dccQuantity.js';
+import { DCCRealListQuantity, DCCConformity } from '../dccQuantity.js';
const palette = [
'#1f77b4',
@@ -99,7 +99,7 @@ export function renderMeasurementResults(measurementResults, language) {
const indexQuantities = [];
const dataQuantities = [];
- // extraInfo stores { uncertainty, conformity } for each data quantity.
+ // extraInfo now stores { uncertainty, conformity } for each data quantity.
const extraInfo = [];
quantityJSONs.forEach(q => {
if (q.$ && q.$.refType && q.$.refType.match(/basic_tableIndex/)) {
@@ -228,7 +228,7 @@ export function renderMeasurementResults(measurementResults, language) {
row.push(extraInfo.map(info => info.comment || '').filter(c => c).join(' ; '));
tableData.push(row);
}
- renderTable(tableData, headers);
+ renderTable(tableData);
const unitGroups = {};
dataQuantities.forEach((q, idx) => {
@@ -258,7 +258,9 @@ export function renderMeasurementResults(measurementResults, language) {
graphDiv.style.height = '300px';
subplotsContainer.appendChild(graphDiv);
plotDivs.push(graphDiv);
- const groupTraces = group.map(trace => {
+
+ // Build main traces for this unit group.
+ let groupTraces = group.map(trace => {
let tooltip = 'X: %{x} ' + xUnit + ' | ' + trace.name + ': %{y}';
if (trace.conformity && trace.conformity.length > 0) {
tooltip += ' | Conformity: %{customdata}';
@@ -286,6 +288,43 @@ export function renderMeasurementResults(measurementResults, language) {
: new Array(xValues.length).fill('')
};
});
+
+ // If tolerance markings are enabled and conformity data exists, add tolerance traces.
+ const toleranceTraces = [];
+ if (document.getElementById('toleranceToggle').checked) {
+ group.forEach(trace => {
+ const confObj = extraInfo[trace.index].conformity;
+ if (confObj) {
+ const lower = confObj.getLowerLimit();
+ const upper = confObj.getUpperLimit();
+ if (lower && typeof lower.value === 'number') {
+ toleranceTraces.push({
+ x: [Math.min(...xValues), Math.max(...xValues)],
+ y: [lower.value, lower.value],
+ mode: 'lines',
+ line: { dash: 'dash', color: '#d62728', width: 2 },
+ name: lower.name,
+ hoverinfo: 'none',
+ showlegend: true
+ });
+ }
+ if (upper && typeof upper.value === 'number') {
+ toleranceTraces.push({
+ x: [Math.min(...xValues), Math.max(...xValues)],
+ y: [upper.value, upper.value],
+ mode: 'lines',
+ line: { dash: 'dot', color: '#d62728', width: 2 },
+ name: upper.name,
+ hoverinfo: 'none',
+ showlegend: true
+ });
+ }
+ }
+ });
+ }
+ // Combine main traces with tolerance traces.
+ const allTraces = groupTraces.concat(toleranceTraces);
+
let xaxisTitle = '';
if (groupIdx === unitKeys.length - 1) {
let xLabel = 'X: ' + xQuantity.getName(language);
@@ -305,65 +344,9 @@ export function renderMeasurementResults(measurementResults, language) {
type: logY ? 'log' : 'linear'
},
hovermode: 'closest',
- margin: { t: 20, b: 40 },
- shapes: [],
- annotations: []
+ margin: { t: 20, b: 40 }
};
-
- // Tolerance markings from conformity limits, if enabled.
- if (document.getElementById('toleranceToggle').checked) {
- group.forEach(trace => {
- const confObj = extraInfo[trace.index].conformity;
- if (confObj) {
- const lower = extraInfo[trace.index].conformity.getLowerLimit();
- const upper = extraInfo[trace.index].conformity.getUpperLimit();
- if (lower && typeof lower.value === 'number') {
- layout.shapes.push({
- type: 'line',
- x0: Math.min(...xValues),
- x1: Math.max(...xValues),
- y0: lower.value,
- y1: lower.value,
- line: { color: '#d62728', width: 2, dash: 'dash' },
- xref: 'x',
- yref: 'y'
- });
- layout.annotations.push({
- x: Math.min(...xValues),
- y: lower.value,
- xref: 'x',
- yref: 'y',
- text: lower.name,
- showarrow: false,
- font: { color: '#d62728', size: 12 }
- });
- }
- if (upper && typeof upper.value === 'number') {
- layout.shapes.push({
- type: 'line',
- x0: Math.min(...xValues),
- x1: Math.max(...xValues),
- y0: upper.value,
- y1: upper.value,
- line: { color: '#d62728', width: 2, dash: 'dash' },
- xref: 'x',
- yref: 'y'
- });
- layout.annotations.push({
- x: Math.min(...xValues),
- y: upper.value,
- xref: 'x',
- yref: 'y',
- text: upper.name,
- showarrow: false,
- font: { color: '#d62728', size: 12 }
- });
- }
- }
- });
- }
-
- Plotly.newPlot(graphDiv, groupTraces, layout).then(() => {
+ Plotly.newPlot(graphDiv, allTraces, layout).then(() => {
const caption = document.createElement('div');
caption.innerHTML = '<b>' + group[0].name + '</b>';
caption.style.textAlign = 'center';
@@ -376,7 +359,9 @@ export function renderMeasurementResults(measurementResults, language) {
highlightTableRow(pointIndex);
}
});
- graphDiv.on('plotly_unhover', function() { clearTableRowHighlights(); });
+ graphDiv.on('plotly_unhover', function() {
+ clearTableRowHighlights();
+ });
graphDiv.on('plotly_relayout', function(eventData) {
plotDivs.forEach(div => {
if (div !== graphDiv && eventData['xaxis.range[0]'] && eventData['xaxis.range[1]']) {
@@ -387,7 +372,7 @@ export function renderMeasurementResults(measurementResults, language) {
});
}
- function renderTable(tableData, headerData) {
+ function renderTable(tableData) {
const tableContainer = document.getElementById('tableContainer');
tableContainer.innerHTML = '';
const table = document.createElement('table');
@@ -403,6 +388,12 @@ export function renderMeasurementResults(measurementResults, language) {
}
} else {
cell.textContent = cellData;
+ if (tableData[0][cellIndex] && tableData[0][cellIndex].toLowerCase().includes('conformity')) {
+ const confVal = cellData.toLowerCase();
+ if (confVal in conformityColors) {
+ cell.style.backgroundColor = conformityColors[confVal];
+ }
+ }
}
cell.style.padding = '4px';
cell.style.border = '1px solid #ccc';
--
GitLab