{m.page_compare_title()}

{m.page_compare_title()} | Drizz.li {#snippet rangeControls(compact = false)}

{#if zoomActive} {/if}

{#each rangePresets as preset (preset.label())} {/each}

{/snippet} {#snippet heroActions()}

{m.meteograms_zoom_hint()} Ctrl {m.meteograms_zoom_hint_end()} {@render rangeControls()}

{/snippet}

{@render rangeControls(true)}

{#if loadError}

{loadError.title}

{#if loadError.hint}

{loadError.hint}

{/if} {#if fetchedData}

{m.compare_showing_previous()}

{/if} {#if loadError.detail}

{m.error_technical_details()}

{loadError.detail}

{/if}

{/if} {#if selectionEmpty}

{m.compare_empty_selection()}

{:else if noUsableData}

{m.compare_no_data()}

{:else if loadError && !fetchedData} {:else if fetchedData && chartVariablesEmpty}

{m.compare_weather_codes_only()}

{:else if fetchedData}

{#each chartDefs as def, i (def.title)}

{def.title}

{def.subtitle}

{/each}

{#if comparisonMuted}

{m.compare_selection_pending()}

{/if}

{:else} v !== 'weather_code' && v !== 'cloud_cover').length || 1} chartHeight={300} bleed={false} /> {/if} {#if fetchedData && !loading && appliedHourly.includes('weather_code')}

(pictogramExporter = exporter)} />

{/if} {#if fetchedData && displayedModels.length > 0}

{m.compare_model_colors()}

{m.legend_show()}

{#if showLegend}

{#each displayedModels as model (model.modelId)} {/each} {#if chartDefs.some( (def) => def.series.some((series) => series.name === m.compare_model_mean()) )} {m.compare_model_mean()} {/if}

{/if}

({ chart: chartComponents[i], title: def.title })), { chart: pictogramExporter, title: m.compare_timeline_title() } ]} fileName="model-comparison" exportOptions={{ title: `${location.name} · ${m.page_compare_subtitle()}`, legend: exportLegend }} />

{/if}

{m.compare_models_heading()}

{params.models.length}/{modelOptions.length}

{#if selectedModelWarning}

{m.compare_many_models_warning({ count: params.models.length })}

{/if}

{m.compare_selected_models()}

{#if modelsDirty} {m.compare_selection_pending()} {/if}

{#if selectedModels.length > 0}

{#each selectedModels as model, index (model.value)} {/each}

{:else}

{m.compare_no_models_selected()}

{/if}

{#if modelsDirty} {/if}

{m.compare_variables_heading()}

{params.hourly.length}/{allHourlyVariables.length}

{m.compare_standard_preset()}

{variablesDirty ? m.compare_variables_pending() : standardVariablesActive ? m.compare_preset_active() : m.compare_custom_selection({ count: params.hourly.length })}

{m.compare_standard_preset_description()}

{#if selectedVariables.length > 0}

{selectedVariables.map((variable) => variableLabel(variable.value)).join(' · ')}

{/if}

{#if !standardVariablesActive} {/if} {#if variablesDirty} {/if}

{#if selectionDrawerMode === 'models'} toggleSelection('models', value)} onToggleGroup={(values, select) => toggleGroupSelection('models', values, select)} onApply={applyComparisonSelection} onClose={() => (selectionDrawerMode = null)} /> {:else if selectionDrawerMode === 'variables'} toggleSelection('hourly', value)} onToggleGroup={(values, select) => toggleGroupSelection('hourly', values, select)} onApply={applyComparisonSelection} onClose={() => (selectionDrawerMode = null)} onRestoreDefaults={restoreStandardVariables} /> {/if}