Show default charts for variables, errors and parameters on calibrate…

… run (#4931)

packages/client/hmi-client/src/components/workflow/ops/calibrate-ciemss/calibrate-operation.ts

@@ -8,7 +8,7 @@ const DOCUMENTATION_URL = 'https://github.com/ciemss/pyciemss/blob/main/pyciemss
 export interface CalibrationOperationStateCiemss extends BaseState {
  method: string;
  mapping: CalibrateMap[];
- chartSettings: ChartSetting[];
+ chartSettings: ChartSetting[] | null; // null indicates that the chart settings have not been set yet
  simulationsInProgress: string[];
 
  currentProgress: number;
@@ -51,7 +51,7 @@ export const CalibrationOperationCiemss: Operation = {
  initState: () => {
  const init: CalibrationOperationStateCiemss = {
  method: 'dopri5',
- chartSettings: [],
+ chartSettings: null,
  mapping: [{ modelVariable: '', datasetVariable: '' }],
  simulationsInProgress: [],
  currentProgress: 0,

packages/client/hmi-client/src/components/workflow/ops/calibrate-ciemss/tera-calibrate-ciemss-drilldown.vue

@@ -1,3 +1,4 @@
+t d
 <template>
  <tera-drilldown
  :node="node"
@@ -423,6 +424,7 @@ import {
  ModelConfiguration,
  ChartAnnotation,
  InterventionPolicy,
+ ModelParameter,
  AssetType
 } from '@/types/Types';
 import { CiemssPresetTypes, DrilldownTabs, ChartSetting, ChartSettingType } from '@/types/common';
@@ -458,6 +460,7 @@ import TeraSaveSimulationModal from '@/components/project/tera-save-simulation-m
 import { useClientEvent } from '@/composables/useClientEvent';
 import { getInterventionPolicyById } from '@/services/intervention-policy';
 import TeraInterventionSummaryCard from '@/components/workflow/ops/simulate-ciemss/tera-intervention-summary-card.vue';
+import { getParameters } from '@/model-representation/service';
 import type { CalibrationOperationStateCiemss } from './calibrate-operation';
 import { renameFnGenerator, mergeResults, getErrorData } from './calibrate-utils';
 
@@ -526,6 +529,8 @@ const odeSolverOptionsTooltip: string = 'TODO';
 // Model variables checked in the model configuration will be options in the mapping dropdown
 const modelStateOptions = ref<any[] | undefined>();
 
+const modelParameters = ref<ModelParameter[]>([]);
+
 const isOutputSettingsPanelOpen = ref(true);
 const activeChartSettings = ref<ChartSetting | null>(null);
 
@@ -840,6 +845,30 @@ const updateLossChartSpec = (data: string | Record<string, any>[]) => {
  );
 };
 
+const initDefaultChartSettings = (state: CalibrationOperationStateCiemss) => {
+ // Initialize default selected chart settings when chart settings are not set yet. Return if chart settings are already set.
+ if (Array.isArray(state.chartSettings)) return;
+ const defaultSelectedParam = modelParameters.value.filter((p) => !!p.distribution).map((p) => p.id);
+ const mappedModelVariables = mapping.value
+ .filter((c) => ['state', 'observable'].includes(modelPartTypesMap.value[c.modelVariable]))
+ .map((c) => c.modelVariable);
+ state.chartSettings = updateChartSettingsBySelectedVariables(
+ [],
+ ChartSettingType.VARIABLE_COMPARISON,
+ mappedModelVariables
+ );
+ state.chartSettings = updateChartSettingsBySelectedVariables(
+ state.chartSettings,
+ ChartSettingType.ERROR_DISTRIBUTION,
+ mappedModelVariables
+ );
+ state.chartSettings = updateChartSettingsBySelectedVariables(
+ state.chartSettings,
+ ChartSettingType.DISTRIBUTION_COMPARISON,
+ defaultSelectedParam
+ );
+};
+
 const runCalibrate = async () => {
  if (!modelConfigId.value || !datasetId.value || !currentDatasetFileName.value) return;
 
@@ -885,16 +914,7 @@ const runCalibrate = async () => {
  state.currentProgress = 0;
  state.inProgressForecastId = '';
  state.inProgressPreForecastId = '';
-
- // show selected input settings in the charts & output panel
- state.chartSettings = updateChartSettingsBySelectedVariables(
- chartSettings.value,
- ChartSettingType.VARIABLE_COMPARISON,
- mapping.value
- .filter((c) => ['state', 'observable'].includes(modelPartTypesMap.value[c.modelVariable]))
- .map((c) => c.modelVariable)
- );
-
+ initDefaultChartSettings(state);
  emit('update-state', state);
  }
 };
@@ -997,11 +1017,12 @@ async function getAutoMapping() {
 
 const initialize = async () => {
  // Model configuration input
- const { modelConfiguration, modelOptions, modelPartUnits, modelPartTypes } = await setupModelInput(
+ const { model, modelConfiguration, modelOptions, modelPartUnits, modelPartTypes } = await setupModelInput(
  modelConfigId.value
  );
  modelConfig.value = modelConfiguration;
  modelStateOptions.value = modelOptions;
+ modelParameters.value = model ? getParameters(model) : [];
  modelVarUnits.value = modelPartUnits ?? {};
  modelPartTypesMap.value = modelPartTypes ?? {};
 

packages/client/hmi-client/src/services/calibrate-workflow.ts

@@ -28,7 +28,13 @@ export const setupModelInput = async (modelConfigId: string | undefined) => {
 
  modelOptions.push({ id: 'timestamp' });
 
- return { modelConfiguration, modelOptions, modelPartUnits, modelPartTypes };
+ return {
+ model,
+ modelConfiguration,
+ modelOptions,
+ modelPartUnits,
+ modelPartTypes
+ };
  }
  return {};
 };