feat: Enhance application event logging, add stacked Y-axis support, and update plot session configurations
This commit is contained in:
parent
14089cdc2e
commit
6cd5f36c7c
|
@ -4835,8 +4835,152 @@
|
|||
"trigger_variable": null,
|
||||
"auto_started": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"timestamp": "2025-08-15T13:03:20.814101",
|
||||
"level": "info",
|
||||
"event_type": "application_started",
|
||||
"message": "Application initialization completed successfully",
|
||||
"details": {}
|
||||
},
|
||||
{
|
||||
"timestamp": "2025-08-15T13:03:20.862979",
|
||||
"level": "info",
|
||||
"event_type": "dataset_activated",
|
||||
"message": "Dataset activated: DAR",
|
||||
"details": {
|
||||
"dataset_id": "DAR",
|
||||
"variables_count": 2,
|
||||
"streaming_count": 2,
|
||||
"prefix": "gateway_phoenix"
|
||||
}
|
||||
},
|
||||
{
|
||||
"timestamp": "2025-08-15T13:03:20.869820",
|
||||
"level": "info",
|
||||
"event_type": "dataset_activated",
|
||||
"message": "Dataset activated: Fast",
|
||||
"details": {
|
||||
"dataset_id": "Fast",
|
||||
"variables_count": 2,
|
||||
"streaming_count": 1,
|
||||
"prefix": "fast"
|
||||
}
|
||||
},
|
||||
{
|
||||
"timestamp": "2025-08-15T13:03:20.874914",
|
||||
"level": "info",
|
||||
"event_type": "csv_recording_started",
|
||||
"message": "CSV recording started: 2 datasets activated",
|
||||
"details": {
|
||||
"activated_datasets": 2,
|
||||
"total_datasets": 3
|
||||
}
|
||||
},
|
||||
{
|
||||
"timestamp": "2025-08-15T13:03:30.694319",
|
||||
"level": "info",
|
||||
"event_type": "plot_session_created",
|
||||
"message": "Plot session 'UR29' created and started",
|
||||
"details": {
|
||||
"session_id": "plot_1",
|
||||
"variables": [
|
||||
"UR29_Brix",
|
||||
"UR29_ma",
|
||||
"AUX Blink_1.0S"
|
||||
],
|
||||
"time_window": 36,
|
||||
"trigger_variable": null,
|
||||
"auto_started": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"timestamp": "2025-08-15T13:03:56.979859",
|
||||
"level": "info",
|
||||
"event_type": "plot_session_created",
|
||||
"message": "Plot session 'UR29' created and started",
|
||||
"details": {
|
||||
"session_id": "plot_1",
|
||||
"variables": [
|
||||
"UR29_Brix",
|
||||
"UR29_ma",
|
||||
"AUX Blink_1.0S"
|
||||
],
|
||||
"time_window": 36,
|
||||
"trigger_variable": null,
|
||||
"auto_started": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"timestamp": "2025-08-15T13:04:03.835222",
|
||||
"level": "info",
|
||||
"event_type": "plot_session_created",
|
||||
"message": "Plot session 'UR29' created and started",
|
||||
"details": {
|
||||
"session_id": "plot_1",
|
||||
"variables": [
|
||||
"UR29_Brix",
|
||||
"UR29_ma",
|
||||
"AUX Blink_1.0S"
|
||||
],
|
||||
"time_window": 36,
|
||||
"trigger_variable": null,
|
||||
"auto_started": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"timestamp": "2025-08-15T13:04:09.295076",
|
||||
"level": "info",
|
||||
"event_type": "plot_session_created",
|
||||
"message": "Plot session 'UR29' created and started",
|
||||
"details": {
|
||||
"session_id": "plot_1",
|
||||
"variables": [
|
||||
"UR29_Brix",
|
||||
"UR29_ma",
|
||||
"AUX Blink_1.0S"
|
||||
],
|
||||
"time_window": 36,
|
||||
"trigger_variable": null,
|
||||
"auto_started": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"timestamp": "2025-08-15T13:04:11.007047",
|
||||
"level": "info",
|
||||
"event_type": "plot_session_created",
|
||||
"message": "Plot session 'UR29' created and started",
|
||||
"details": {
|
||||
"session_id": "plot_1",
|
||||
"variables": [
|
||||
"UR29_Brix",
|
||||
"UR29_ma",
|
||||
"AUX Blink_1.0S"
|
||||
],
|
||||
"time_window": 36,
|
||||
"trigger_variable": null,
|
||||
"auto_started": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"timestamp": "2025-08-15T13:04:44.329049",
|
||||
"level": "info",
|
||||
"event_type": "plot_session_created",
|
||||
"message": "Plot session 'UR29' created and started",
|
||||
"details": {
|
||||
"session_id": "plot_1",
|
||||
"variables": [
|
||||
"UR29_Brix",
|
||||
"UR29_ma",
|
||||
"AUX Blink_1.0S",
|
||||
"AUX Blink_1.6S"
|
||||
],
|
||||
"time_window": 36,
|
||||
"trigger_variable": null,
|
||||
"auto_started": true
|
||||
}
|
||||
}
|
||||
],
|
||||
"last_updated": "2025-08-15T12:53:56.468489",
|
||||
"total_entries": 424
|
||||
"last_updated": "2025-08-15T13:04:44.329049",
|
||||
"total_entries": 434
|
||||
}
|
|
@ -25,6 +25,13 @@
|
|||
"line_width": 2,
|
||||
"y_axis": "left",
|
||||
"enabled": true
|
||||
},
|
||||
{
|
||||
"variable_name": "AUX Blink_1.6S",
|
||||
"color": "#630de3",
|
||||
"line_width": 2,
|
||||
"y_axis": "left",
|
||||
"enabled": true
|
||||
}
|
||||
]
|
||||
},
|
||||
|
|
|
@ -581,10 +581,6 @@ const ChartjsPlot = ({ session, height = '400px' }) => {
|
|||
const enabledVariables = getEnabledVariables(config.variables);
|
||||
// Check if stacked Y-axes are enabled
|
||||
const useStackedAxes = config.stacked === true;
|
||||
console.log(`📊 Creating chart with stacked axes: ${useStackedAxes}`, {
|
||||
configStacked: config.stacked,
|
||||
enabledVariablesCount: enabledVariables.length
|
||||
});
|
||||
|
||||
const datasets = enabledVariables.map((variableInfo, index) => {
|
||||
const color = variableInfo.color || getColor(variableInfo.name, index);
|
||||
|
@ -723,33 +719,55 @@ const ChartjsPlot = ({ session, height = '400px' }) => {
|
|||
...(useStackedAxes && enabledVariables.length > 0
|
||||
? // When stacked is enabled, create a separate Y axis for each dataset
|
||||
enabledVariables.reduce((scales, variable, index) => {
|
||||
// Make sure we're using the correct properties from the variable object
|
||||
console.log(`📊 Creating Y axis for variable at index ${index}`, {
|
||||
variable,
|
||||
hasName: !!variable.name,
|
||||
hasLabel: !!variable.label
|
||||
});
|
||||
|
||||
// Safe access to variable properties
|
||||
const variableName = variable.name || variable.label || `Variable ${index}`;
|
||||
const color = variable.color || getColor(variableName, index);
|
||||
|
||||
// Improved Y-axis positioning logic for better visual distribution
|
||||
// Distribute axes more evenly: left, right, left, right, etc.
|
||||
// But group consecutive axes to avoid overcrowding
|
||||
const totalAxes = enabledVariables.length;
|
||||
let position;
|
||||
|
||||
if (totalAxes <= 2) {
|
||||
// With 1-2 axes, alternate left/right
|
||||
position = index === 0 ? 'left' : 'right';
|
||||
} else if (totalAxes <= 4) {
|
||||
// With 3-4 axes, use pattern: left, right, left, right
|
||||
position = index % 2 === 0 ? 'left' : 'right';
|
||||
} else {
|
||||
// With 5+ axes, group them: first half on left, second half on right
|
||||
const halfPoint = Math.ceil(totalAxes / 2);
|
||||
position = index < halfPoint ? 'left' : 'right';
|
||||
}
|
||||
|
||||
scales[`y-axis-${index}`] = {
|
||||
type: 'linear',
|
||||
position: index % 2 === 0 ? 'left' : 'right',
|
||||
position: position,
|
||||
stack: 'stack-group',
|
||||
stackWeight: 1,
|
||||
border: {
|
||||
color: color
|
||||
color: color,
|
||||
width: 2
|
||||
},
|
||||
grid: {
|
||||
drawOnChartArea: index === 0, // Only show grid for the first axis
|
||||
color: color + '20' // Semi-transparent grid lines
|
||||
},
|
||||
ticks: {
|
||||
color: color
|
||||
color: color,
|
||||
font: {
|
||||
weight: 'bold'
|
||||
}
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: variable.label || variable.name || `Variable ${index}`
|
||||
text: variable.label || variable.name || `Variable ${index}`,
|
||||
color: color,
|
||||
font: {
|
||||
weight: 'bold',
|
||||
size: 12
|
||||
}
|
||||
},
|
||||
min: yMinInitial,
|
||||
max: yMaxInitial
|
||||
|
@ -1412,6 +1430,7 @@ const ChartjsPlot = ({ session, height = '400px' }) => {
|
|||
oldConfig.y_max !== updatedSession.config.y_max ||
|
||||
oldConfig.line_tension !== updatedSession.config.line_tension ||
|
||||
oldConfig.stepped !== updatedSession.config.stepped ||
|
||||
oldConfig.stacked !== updatedSession.config.stacked ||
|
||||
oldConfig.point_radius !== updatedSession.config.point_radius ||
|
||||
oldConfig.point_hover_radius !== updatedSession.config.point_hover_radius;
|
||||
|
||||
|
|
|
@ -75,6 +75,7 @@ export default function PlotRealtimeSession({
|
|||
// Visual style properties
|
||||
line_tension: plotDefinition.line_tension !== undefined ? plotDefinition.line_tension : 0.4,
|
||||
stepped: plotDefinition.stepped || false,
|
||||
stacked: plotDefinition.stacked || false,
|
||||
point_radius: plotDefinition.point_radius !== undefined ? plotDefinition.point_radius : 1,
|
||||
point_hover_radius: plotDefinition.point_hover_radius !== undefined ? plotDefinition.point_hover_radius : 4
|
||||
})
|
||||
|
@ -120,6 +121,7 @@ export default function PlotRealtimeSession({
|
|||
// Visual style properties
|
||||
line_tension: plotDefinition.line_tension !== undefined ? plotDefinition.line_tension : 0.4,
|
||||
stepped: plotDefinition.stepped || false,
|
||||
stacked: plotDefinition.stacked || false,
|
||||
point_radius: plotDefinition.point_radius !== undefined ? plotDefinition.point_radius : 1,
|
||||
point_hover_radius: plotDefinition.point_hover_radius !== undefined ? plotDefinition.point_hover_radius : 4
|
||||
})
|
||||
|
@ -351,6 +353,7 @@ export default function PlotRealtimeSession({
|
|||
// Reset visual style properties to defaults
|
||||
line_tension: plotDefinition.line_tension !== undefined ? plotDefinition.line_tension : 0.4,
|
||||
stepped: plotDefinition.stepped || false,
|
||||
stacked: plotDefinition.stacked || false,
|
||||
point_radius: plotDefinition.point_radius !== undefined ? plotDefinition.point_radius : 1,
|
||||
point_hover_radius: plotDefinition.point_hover_radius !== undefined ? plotDefinition.point_hover_radius : 4
|
||||
})
|
||||
|
@ -634,6 +637,25 @@ export default function PlotRealtimeSession({
|
|||
</FormControl>
|
||||
</GridItem>
|
||||
|
||||
<GridItem>
|
||||
<FormControl>
|
||||
<FormLabel fontSize="sm">Stacked Y-Axes</FormLabel>
|
||||
<Text fontSize="xs" color="gray.500" mb={2}>
|
||||
Multi-axis visualization with separate Y scales
|
||||
</Text>
|
||||
<Checkbox
|
||||
isChecked={localConfig.stacked}
|
||||
onChange={(e) => setLocalConfig(prev => ({
|
||||
...prev,
|
||||
stacked: e.target.checked
|
||||
}))}
|
||||
size="sm"
|
||||
>
|
||||
Stacked Mode
|
||||
</Checkbox>
|
||||
</FormControl>
|
||||
</GridItem>
|
||||
|
||||
<GridItem>
|
||||
<FormControl>
|
||||
<FormLabel fontSize="sm">Point Size: {localConfig.point_radius}px</FormLabel>
|
||||
|
|
|
@ -3,11 +3,11 @@
|
|||
"should_connect": true,
|
||||
"should_stream": false,
|
||||
"active_datasets": [
|
||||
"DAR",
|
||||
"Fast",
|
||||
"Test"
|
||||
"Test",
|
||||
"DAR"
|
||||
]
|
||||
},
|
||||
"auto_recovery_enabled": true,
|
||||
"last_update": "2025-08-15T12:41:55.497904"
|
||||
"last_update": "2025-08-15T13:03:20.882463"
|
||||
}
|
Loading…
Reference in New Issue