@siemens/charts-ng 49.11.0 → 49.13.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/siemens-charts-ng-cartesian.mjs +3 -3
- package/fesm2022/siemens-charts-ng-cartesian.mjs.map +1 -1
- package/fesm2022/siemens-charts-ng-chart.mjs +3 -3
- package/fesm2022/siemens-charts-ng-chart.mjs.map +1 -1
- package/fesm2022/siemens-charts-ng-circle.mjs +3 -3
- package/fesm2022/siemens-charts-ng-circle.mjs.map +1 -1
- package/fesm2022/siemens-charts-ng-common.mjs +3 -3
- package/fesm2022/siemens-charts-ng-common.mjs.map +1 -1
- package/fesm2022/siemens-charts-ng-custom-legend.mjs +3 -3
- package/fesm2022/siemens-charts-ng-custom-legend.mjs.map +1 -1
- package/fesm2022/siemens-charts-ng-gauge.mjs +3 -3
- package/fesm2022/siemens-charts-ng-gauge.mjs.map +1 -1
- package/fesm2022/siemens-charts-ng-progress-bar.mjs +3 -3
- package/fesm2022/siemens-charts-ng-progress-bar.mjs.map +1 -1
- package/fesm2022/siemens-charts-ng-progress.mjs +3 -3
- package/fesm2022/siemens-charts-ng-progress.mjs.map +1 -1
- package/fesm2022/siemens-charts-ng-sankey.mjs +3 -3
- package/fesm2022/siemens-charts-ng-sankey.mjs.map +1 -1
- package/fesm2022/siemens-charts-ng-sunburst.mjs +3 -3
- package/fesm2022/siemens-charts-ng-sunburst.mjs.map +1 -1
- package/package.json +3 -3
- package/types/siemens-charts-ng-common.d.ts +7 -7
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { input, Component } from '@angular/core';
|
|
2
|
+
import { input, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
3
|
import { echarts, SiChartBaseComponent } from '@siemens/charts-ng/common';
|
|
4
4
|
import { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';
|
|
5
5
|
import { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';
|
|
@@ -356,11 +356,11 @@ class SiChartCartesianComponent extends SiChartBaseComponent {
|
|
|
356
356
|
this.addDataInternal(series);
|
|
357
357
|
}
|
|
358
358
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartCartesianComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
359
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiChartCartesianComponent, isStandalone: true, selector: "si-chart-cartesian", inputs: { series: { classPropertyName: "series", publicName: "series", isSignal: true, isRequired: false, transformFunction: null }, subChartGrids: { classPropertyName: "subChartGrids", publicName: "subChartGrids", isSignal: true, isRequired: false, transformFunction: null }, yAxis: { classPropertyName: "yAxis", publicName: "yAxis", isSignal: true, isRequired: false, transformFunction: null }, xAxis: { classPropertyName: "xAxis", publicName: "xAxis", isSignal: true, isRequired: false, transformFunction: null }, tooltipFormatter: { classPropertyName: "tooltipFormatter", publicName: "tooltipFormatter", isSignal: true, isRequired: false, transformFunction: null }, stacked: { classPropertyName: "stacked", publicName: "stacked", isSignal: true, isRequired: false, transformFunction: null }, zoomMode: { classPropertyName: "zoomMode", publicName: "zoomMode", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "component", type: SiCustomLegendComponent, selector: "si-custom-legend", inputs: ["customLegend", "title", "subTitle", "titleColor", "subTitleColor", "textColor"], outputs: ["legendIconClickEvent", "legendClickEvent", "legendHoverStartEvent", "legendHoverEndEvent"] }, { kind: "component", type: SiChartLoadingSpinnerComponent, selector: "si-chart-loading-spinner" }] });
|
|
359
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiChartCartesianComponent, isStandalone: true, selector: "si-chart-cartesian", inputs: { series: { classPropertyName: "series", publicName: "series", isSignal: true, isRequired: false, transformFunction: null }, subChartGrids: { classPropertyName: "subChartGrids", publicName: "subChartGrids", isSignal: true, isRequired: false, transformFunction: null }, yAxis: { classPropertyName: "yAxis", publicName: "yAxis", isSignal: true, isRequired: false, transformFunction: null }, xAxis: { classPropertyName: "xAxis", publicName: "xAxis", isSignal: true, isRequired: false, transformFunction: null }, tooltipFormatter: { classPropertyName: "tooltipFormatter", publicName: "tooltipFormatter", isSignal: true, isRequired: false, transformFunction: null }, stacked: { classPropertyName: "stacked", publicName: "stacked", isSignal: true, isRequired: false, transformFunction: null }, zoomMode: { classPropertyName: "zoomMode", publicName: "zoomMode", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "component", type: SiCustomLegendComponent, selector: "si-custom-legend", inputs: ["customLegend", "title", "subTitle", "titleColor", "subTitleColor", "textColor"], outputs: ["legendIconClickEvent", "legendClickEvent", "legendHoverStartEvent", "legendHoverEndEvent"] }, { kind: "component", type: SiChartLoadingSpinnerComponent, selector: "si-chart-loading-spinner" }], changeDetection: i0.ChangeDetectionStrategy.Default });
|
|
360
360
|
}
|
|
361
361
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartCartesianComponent, decorators: [{
|
|
362
362
|
type: Component,
|
|
363
|
-
args: [{ selector: 'si-chart-cartesian', imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent], template: "@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"] }]
|
|
363
|
+
args: [{ selector: 'si-chart-cartesian', imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent], changeDetection: ChangeDetectionStrategy.Default, template: "@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"] }]
|
|
364
364
|
}], propDecorators: { series: [{ type: i0.Input, args: [{ isSignal: true, alias: "series", required: false }] }], subChartGrids: [{ type: i0.Input, args: [{ isSignal: true, alias: "subChartGrids", required: false }] }], yAxis: [{ type: i0.Input, args: [{ isSignal: true, alias: "yAxis", required: false }] }], xAxis: [{ type: i0.Input, args: [{ isSignal: true, alias: "xAxis", required: false }] }], tooltipFormatter: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltipFormatter", required: false }] }], stacked: [{ type: i0.Input, args: [{ isSignal: true, alias: "stacked", required: false }] }], zoomMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "zoomMode", required: false }] }] } });
|
|
365
365
|
|
|
366
366
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"siemens-charts-ng-cartesian.mjs","sources":["../../../../projects/charts-ng/cartesian/si-chart-cartesian.component.ts","../../../../projects/charts-ng/common/si-chart-base.component.html","../../../../projects/charts-ng/cartesian/index.ts","../../../../projects/charts-ng/cartesian/siemens-charts-ng-cartesian.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Component, input, OnChanges, SimpleChanges } from '@angular/core';\nimport {\n echarts,\n GridComponentOption,\n LegendComponentOption,\n TooltipComponentOption,\n SiChartBaseComponent,\n ChartXAxis,\n ChartYAxis,\n DataZoomRange,\n SeriesUpdate\n} from '@siemens/charts-ng/common';\nimport {\n CustomLegend,\n CustomLegendProps,\n SiCustomLegendComponent\n} from '@siemens/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';\nimport { BarChart, LineChart, ScatterChart, CandlestickChart, HeatmapChart } from 'echarts/charts';\nimport {\n LegendComponent,\n GridComponent,\n DataZoomComponent,\n VisualMapComponent,\n ToolboxComponent,\n BrushComponent,\n MarkAreaComponent,\n MarkLineComponent,\n MarkPointComponent,\n AxisPointerComponent,\n DatasetComponent\n} from 'echarts/components';\nimport { LegacyGridContainLabel } from 'echarts/features';\n\nimport {\n CartesianChartData,\n CartesianChartSeries,\n SubchartGrid\n} from './si-chart-cartesian.interfaces';\n\necharts.use([\n BarChart,\n LineChart,\n ScatterChart,\n CandlestickChart,\n HeatmapChart,\n DatasetComponent,\n LegendComponent,\n GridComponent,\n DataZoomComponent,\n VisualMapComponent,\n ToolboxComponent,\n BrushComponent,\n MarkAreaComponent,\n MarkLineComponent,\n MarkPointComponent,\n AxisPointerComponent,\n LegacyGridContainLabel\n]);\n\n@Component({\n selector: 'si-chart-cartesian',\n imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent],\n templateUrl: '../common/si-chart-base.component.html',\n styleUrl: '../common/si-chart-base.component.scss'\n})\nexport class SiChartCartesianComponent extends SiChartBaseComponent implements OnChanges {\n /** The series for the chart. */\n readonly series = input<CartesianChartSeries[]>();\n readonly subChartGrids = input<SubchartGrid[]>();\n /** The y axis in cartesian(rectangular) coordinate. */\n readonly yAxis = input<ChartYAxis | ChartYAxis[]>();\n /** The x axis in cartesian(rectangular) coordinate. */\n readonly xAxis = input<ChartXAxis | ChartXAxis[]>();\n /** The content formatter of tooltip's floating layer which supports string template and callback function (see (see {@link https://echarts.apache.org/en/option.html#tooltip.formatter }). */\n readonly tooltipFormatter = input<TooltipComponentOption['formatter']>();\n /**\n * Used to display the chart as a stacked one.\n *\n * @defaultValue false\n */\n readonly stacked = input(false);\n /** Enable or disable brush zoom mode */\n readonly zoomMode = input<boolean>();\n\n // Used to toggle different chart types\n override ngOnChanges(changes: SimpleChanges<unknown>): void {\n if (changes.zoomMode) {\n this.setZoomMode();\n }\n if (changes.stacked) {\n changes.forceAll = changes.stacked;\n }\n if (changes.subChartGrids) {\n changes.forceAll = changes.subChartGrids;\n }\n super.ngOnChanges(changes);\n }\n\n private formatTooltip(p: object | object[]): string {\n const params = Array.isArray(p) ? p : [p];\n const label: string = params[0]?.axisValueLabel ?? '';\n\n let html = label;\n for (const series of params) {\n const isCandle = series.componentSubType === 'candlestick';\n const isPie = series.componentSubType === 'pie';\n const useName = series.name != series.axisValue;\n const name = isPie\n ? series.data.name\n : useName\n ? // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing\n series.name || series.seriesName\n : series.seriesName;\n const valIndex = (series.encode.value ?? series.encode.y)[0];\n const value = isCandle\n ? ''\n : isPie\n ? series.percent + '%'\n : Array.isArray(series.value)\n ? series.value[valIndex]\n : series.value;\n\n html += '<div style=\"display: flex; align-items: center;\">';\n html += this.getSeriesMarkerSvg(name);\n html += `<span style=\"margin-inline: 4px 8px\">${name}</span>`;\n html += `<span style=\"margin-inline-start: auto\">${value}</span>`;\n html += '</div>';\n }\n return html;\n }\n\n /**\n * Get the series marker svg by series name.\n */\n getSeriesMarkerSvg(seriesName: string): string {\n const seriesValue = this.actualOptions.series as CartesianChartSeries[];\n let sym;\n if (seriesValue) {\n sym = this.getSeriesMarker(seriesName);\n const symbol = this.shapePaths[sym as string];\n const color = this.getSeriesColorBySeriesName(seriesName);\n return `<svg width=\"12\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"${symbol}\" fill=\"${color}\" />\n </svg>`;\n }\n return '';\n }\n\n /**\n * Get the series marker by series name.\n */\n getSeriesMarker(seriesName: string): string {\n const seriesValue = this.actualOptions.series as CartesianChartSeries[];\n if (seriesValue) {\n const seriesMarker = seriesValue.find(ser => ser.name === seriesName);\n if (seriesMarker && 'symbol' in seriesMarker) {\n return seriesMarker.symbol as string;\n }\n }\n return 'circle';\n }\n\n protected override afterChartInit(skipZoom?: boolean): void {\n super.afterChartInit(skipZoom);\n if (this.zoomMode()) {\n this.setZoomMode();\n }\n }\n\n protected override setZoomMode(): void {\n this.dispatchEChartAction({\n type: 'takeGlobalCursor',\n key: 'dataZoomSelect',\n dataZoomSelectActive: this.zoomMode()\n });\n }\n\n protected override getValidXAxis(): Set<number> {\n const validXAxis: Set<number> = new Set<number>();\n this.series()?.forEach(series => {\n if (series.visible !== false && series.xAxisIndex !== undefined) {\n validXAxis.add(series.xAxisIndex);\n }\n });\n return validXAxis;\n }\n\n protected override applyOptions(): void {\n this.actualOptions = {\n series: [],\n xAxis: this.xAxis(),\n grid: this.getGrid(),\n yAxis: this.yAxis(),\n toolbox: {\n showTitle: false,\n itemSize: 0,\n feature: {\n dataZoom: {\n filterMode: 'none',\n xAxisIndex: 'all',\n yAxisIndex: false,\n icon: {\n zoom: 'image://',\n back: 'image://'\n }\n }\n }\n },\n legend: [\n {\n data: []\n },\n {\n data: []\n }\n ],\n tooltip: {\n trigger: 'axis',\n confine: true\n }\n };\n const tooltipFormatter = this.tooltipFormatter();\n if (tooltipFormatter) {\n this.actualOptions.tooltip.formatter = tooltipFormatter;\n } else if (this.hasDifferentMarker()) {\n this.actualOptions.tooltip.formatter = this.formatTooltip.bind(this);\n }\n\n const yAxis = this.yAxis();\n const yAxisArray = Array.isArray(yAxis) ? yAxis : yAxis ? [yAxis] : [];\n const numRight = yAxisArray.reduce((acc, cur) => acc + (cur.position === 'right' ? 1 : 0), 0);\n const numLeft = yAxisArray.length - numRight;\n const legendLeftOptions = this.getThemeCustomValue(['legendLeft'], {});\n const legendRightOptions = this.getThemeCustomValue(['legendRight'], {});\n let leftUnitText: string | undefined;\n let rightUnitText: string | undefined;\n const legends = this.actualOptions.legend as LegendComponentOption[];\n if (numLeft && numRight) {\n echarts.util.merge(legends[0], legendLeftOptions, true);\n echarts.util.merge(legends[1], legendRightOptions, true);\n } else if (Array.isArray(this.yAxis()) && numLeft) {\n echarts.util.merge(legends[0], { left: legendLeftOptions.left }, true);\n } else if (numRight) {\n echarts.util.merge(legends[1], { right: legendRightOptions.right }, true);\n }\n\n const subChartGrids = this.subChartGrids();\n if (subChartGrids) {\n if (subChartGrids.length !== this.customLegend.length) {\n const diff = subChartGrids.length - this.customLegend.length;\n if (diff < 0) {\n this.customLegend.length = subChartGrids.length;\n } else {\n for (let i = 0; i < diff; i++) {\n // Add default custom legends for all grids\n const cl: CustomLegend = {\n customLegends: [\n { list: [], unit: '' },\n { list: [], unit: '' }\n ],\n legendAxis: 'both'\n };\n this.customLegend.push(cl);\n }\n }\n }\n const margin = 16;\n // calculate custom legend positions from top according to subcharts.\n for (let i = 0; i < subChartGrids.length; i++) {\n if (i === 0) {\n this.customLegend[i].top = 0;\n } else {\n const prevGrid = subChartGrids[i - 1];\n const subChartTop = (prevGrid.top as number) ?? 0;\n const subChartHeight = (prevGrid.height as number) ?? 0;\n this.customLegend[i].top = subChartTop + subChartHeight + margin;\n }\n }\n }\n\n const seriesValue = this.series();\n if (seriesValue) {\n const optionSeries = this.actualOptions.series as CartesianChartSeries[];\n seriesValue.forEach(series => {\n const s: any = Object.assign(\n {\n stack: this.stacked()\n },\n series\n );\n if (s.type === 'line' && s.area) {\n delete s.area;\n s.areaStyle = {};\n } else {\n s.areaStyle ??= null;\n }\n delete s.visible;\n\n if ('symbol' in series && !this.shapePaths[series.symbol as string]) {\n s.symbol = 'circle';\n }\n\n optionSeries.push(s);\n\n if (this.showLegend() && series.name) {\n let legendIndex = 0;\n const axis = yAxisArray[series.yAxisIndex ?? 0];\n if (axis?.position === 'right') {\n legendIndex = 1;\n }\n\n let customLegendProp: CustomLegendProps | undefined;\n if (this.showCustomLegend()) {\n // get left and right axis units from axis array\n if (axis && (axis.show === undefined || axis.show)) {\n if ((!leftUnitText || leftUnitText !== axis.name) && axis.position === 'left') {\n if (axis.name != null) {\n // axis.name is the same property name which eChart uses to display axis title,\n // hence in case of custom legends units were shown at two places i.e. at axis\n // title as well as custom legend unit section. Thus changing the property name\n // to customLegendUnit only in case custom legends are used.\n axis.customLegendUnit = axis.name;\n }\n if (axis.customLegendUnit != null) {\n leftUnitText = axis.customLegendUnit;\n }\n } else if (\n (!rightUnitText || rightUnitText !== axis.name) &&\n axis.position === 'right'\n ) {\n if (axis.name != null) {\n // axis.name is the same property name which eChart uses to display axis title,\n // hence in case of custom legends units were shown at two places i.e. at axis\n // title as well as custom legend unit section. Thus changing the property name\n // to customLegendUnit only in case custom legends are used.\n axis.customLegendUnit = axis.name;\n }\n if (axis.customLegendUnit != null) {\n rightUnitText = axis.customLegendUnit;\n }\n }\n delete axis.name;\n }\n\n const unitText = axis.position === 'right' ? rightUnitText : leftUnitText;\n customLegendProp = {\n displayName: s.displayName,\n tooltip: s.customLegendToolTip,\n unit: unitText\n };\n }\n // As we have only 1 xAxis per sub chart, xAxisIndex equals grid index.\n const seriesSymbol = 'symbol' in s ? (s.symbol as string) : 'circle';\n this.addLegendItem(\n series.name as string,\n series.visible,\n legendIndex,\n series.xAxisIndex,\n customLegendProp,\n seriesSymbol\n );\n }\n });\n }\n\n this.applyTitles();\n if (this.externalZoomSlider()) {\n this.extZoomSliderOptions.legend = this.actualOptions.legend;\n }\n }\n\n private hasDifferentMarker(): boolean {\n const seriesValue = this.series();\n return !!seriesValue?.some(series => 'symbol' in series && series.symbol !== 'circle');\n }\n\n private getGrid(): GridComponentOption | GridComponentOption[] {\n const subChartGrids = this.subChartGrids();\n if (subChartGrids) {\n subChartGrids.forEach(g => (g.containLabel = false));\n return subChartGrids as GridComponentOption[];\n }\n return {};\n }\n\n override refreshSeries(isLive: boolean = true, dzToSet?: DataZoomRange): void {\n const seriesValue = this.series();\n if (!seriesValue) {\n return;\n }\n const optionSeries = this.actualOptions.series as CartesianChartSeries[];\n seriesValue.forEach((series, i) => {\n optionSeries[i].data = series.data;\n });\n super.refreshSeries(isLive, dzToSet);\n }\n\n protected override hasData(): boolean {\n return this.series()?.some(s => s.visible !== false && s.data && s.data.length > 0) ?? false;\n }\n\n protected override handleSelectionChanged(event: any): void {\n if (event?.selected) {\n this.series()?.forEach(series => (series.visible = event.selected[series.name!] !== false));\n }\n super.handleSelectionChanged(event);\n }\n\n /**\n * Update single chart data entry.\n */\n addData(index: number, data: CartesianChartData): void {\n this.addDataInternal([{ index, data }]);\n }\n\n /**\n * Append charts data entries to the end of the series.\n */\n addDataMulti(series: SeriesUpdate<CartesianChartData>[]): void {\n this.addDataInternal(series);\n }\n}\n","@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-chart-cartesian.component';\nexport * from './si-chart-cartesian.interfaces';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"siemens-charts-ng-cartesian.mjs","sources":["../../../../projects/charts-ng/cartesian/si-chart-cartesian.component.ts","../../../../projects/charts-ng/common/si-chart-base.component.html","../../../../projects/charts-ng/cartesian/index.ts","../../../../projects/charts-ng/cartesian/siemens-charts-ng-cartesian.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { ChangeDetectionStrategy, Component, input, OnChanges, SimpleChanges } from '@angular/core';\nimport {\n echarts,\n GridComponentOption,\n LegendComponentOption,\n TooltipComponentOption,\n SiChartBaseComponent,\n ChartXAxis,\n ChartYAxis,\n DataZoomRange,\n SeriesUpdate\n} from '@siemens/charts-ng/common';\nimport {\n CustomLegend,\n CustomLegendProps,\n SiCustomLegendComponent\n} from '@siemens/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';\nimport { BarChart, LineChart, ScatterChart, CandlestickChart, HeatmapChart } from 'echarts/charts';\nimport {\n LegendComponent,\n GridComponent,\n DataZoomComponent,\n VisualMapComponent,\n ToolboxComponent,\n BrushComponent,\n MarkAreaComponent,\n MarkLineComponent,\n MarkPointComponent,\n AxisPointerComponent,\n DatasetComponent\n} from 'echarts/components';\nimport { LegacyGridContainLabel } from 'echarts/features';\n\nimport {\n CartesianChartData,\n CartesianChartSeries,\n SubchartGrid\n} from './si-chart-cartesian.interfaces';\n\necharts.use([\n BarChart,\n LineChart,\n ScatterChart,\n CandlestickChart,\n HeatmapChart,\n DatasetComponent,\n LegendComponent,\n GridComponent,\n DataZoomComponent,\n VisualMapComponent,\n ToolboxComponent,\n BrushComponent,\n MarkAreaComponent,\n MarkLineComponent,\n MarkPointComponent,\n AxisPointerComponent,\n LegacyGridContainLabel\n]);\n\n@Component({\n selector: 'si-chart-cartesian',\n imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent],\n templateUrl: '../common/si-chart-base.component.html',\n styleUrl: '../common/si-chart-base.component.scss',\n changeDetection: ChangeDetectionStrategy.Default\n})\nexport class SiChartCartesianComponent extends SiChartBaseComponent implements OnChanges {\n /** The series for the chart. */\n readonly series = input<CartesianChartSeries[]>();\n readonly subChartGrids = input<SubchartGrid[]>();\n /** The y axis in cartesian(rectangular) coordinate. */\n readonly yAxis = input<ChartYAxis | ChartYAxis[]>();\n /** The x axis in cartesian(rectangular) coordinate. */\n readonly xAxis = input<ChartXAxis | ChartXAxis[]>();\n /** The content formatter of tooltip's floating layer which supports string template and callback function (see (see {@link https://echarts.apache.org/en/option.html#tooltip.formatter }). */\n readonly tooltipFormatter = input<TooltipComponentOption['formatter']>();\n /**\n * Used to display the chart as a stacked one.\n *\n * @defaultValue false\n */\n readonly stacked = input(false);\n /** Enable or disable brush zoom mode */\n readonly zoomMode = input<boolean>();\n\n // Used to toggle different chart types\n override ngOnChanges(changes: SimpleChanges<unknown>): void {\n if (changes.zoomMode) {\n this.setZoomMode();\n }\n if (changes.stacked) {\n changes.forceAll = changes.stacked;\n }\n if (changes.subChartGrids) {\n changes.forceAll = changes.subChartGrids;\n }\n super.ngOnChanges(changes);\n }\n\n private formatTooltip(p: object | object[]): string {\n const params = Array.isArray(p) ? p : [p];\n const label: string = params[0]?.axisValueLabel ?? '';\n\n let html = label;\n for (const series of params) {\n const isCandle = series.componentSubType === 'candlestick';\n const isPie = series.componentSubType === 'pie';\n const useName = series.name != series.axisValue;\n const name = isPie\n ? series.data.name\n : useName\n ? // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing\n series.name || series.seriesName\n : series.seriesName;\n const valIndex = (series.encode.value ?? series.encode.y)[0];\n const value = isCandle\n ? ''\n : isPie\n ? series.percent + '%'\n : Array.isArray(series.value)\n ? series.value[valIndex]\n : series.value;\n\n html += '<div style=\"display: flex; align-items: center;\">';\n html += this.getSeriesMarkerSvg(name);\n html += `<span style=\"margin-inline: 4px 8px\">${name}</span>`;\n html += `<span style=\"margin-inline-start: auto\">${value}</span>`;\n html += '</div>';\n }\n return html;\n }\n\n /**\n * Get the series marker svg by series name.\n */\n getSeriesMarkerSvg(seriesName: string): string {\n const seriesValue = this.actualOptions.series as CartesianChartSeries[];\n let sym;\n if (seriesValue) {\n sym = this.getSeriesMarker(seriesName);\n const symbol = this.shapePaths[sym as string];\n const color = this.getSeriesColorBySeriesName(seriesName);\n return `<svg width=\"12\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"${symbol}\" fill=\"${color}\" />\n </svg>`;\n }\n return '';\n }\n\n /**\n * Get the series marker by series name.\n */\n getSeriesMarker(seriesName: string): string {\n const seriesValue = this.actualOptions.series as CartesianChartSeries[];\n if (seriesValue) {\n const seriesMarker = seriesValue.find(ser => ser.name === seriesName);\n if (seriesMarker && 'symbol' in seriesMarker) {\n return seriesMarker.symbol as string;\n }\n }\n return 'circle';\n }\n\n protected override afterChartInit(skipZoom?: boolean): void {\n super.afterChartInit(skipZoom);\n if (this.zoomMode()) {\n this.setZoomMode();\n }\n }\n\n protected override setZoomMode(): void {\n this.dispatchEChartAction({\n type: 'takeGlobalCursor',\n key: 'dataZoomSelect',\n dataZoomSelectActive: this.zoomMode()\n });\n }\n\n protected override getValidXAxis(): Set<number> {\n const validXAxis: Set<number> = new Set<number>();\n this.series()?.forEach(series => {\n if (series.visible !== false && series.xAxisIndex !== undefined) {\n validXAxis.add(series.xAxisIndex);\n }\n });\n return validXAxis;\n }\n\n protected override applyOptions(): void {\n this.actualOptions = {\n series: [],\n xAxis: this.xAxis(),\n grid: this.getGrid(),\n yAxis: this.yAxis(),\n toolbox: {\n showTitle: false,\n itemSize: 0,\n feature: {\n dataZoom: {\n filterMode: 'none',\n xAxisIndex: 'all',\n yAxisIndex: false,\n icon: {\n zoom: 'image://',\n back: 'image://'\n }\n }\n }\n },\n legend: [\n {\n data: []\n },\n {\n data: []\n }\n ],\n tooltip: {\n trigger: 'axis',\n confine: true\n }\n };\n const tooltipFormatter = this.tooltipFormatter();\n if (tooltipFormatter) {\n this.actualOptions.tooltip.formatter = tooltipFormatter;\n } else if (this.hasDifferentMarker()) {\n this.actualOptions.tooltip.formatter = this.formatTooltip.bind(this);\n }\n\n const yAxis = this.yAxis();\n const yAxisArray = Array.isArray(yAxis) ? yAxis : yAxis ? [yAxis] : [];\n const numRight = yAxisArray.reduce((acc, cur) => acc + (cur.position === 'right' ? 1 : 0), 0);\n const numLeft = yAxisArray.length - numRight;\n const legendLeftOptions = this.getThemeCustomValue(['legendLeft'], {});\n const legendRightOptions = this.getThemeCustomValue(['legendRight'], {});\n let leftUnitText: string | undefined;\n let rightUnitText: string | undefined;\n const legends = this.actualOptions.legend as LegendComponentOption[];\n if (numLeft && numRight) {\n echarts.util.merge(legends[0], legendLeftOptions, true);\n echarts.util.merge(legends[1], legendRightOptions, true);\n } else if (Array.isArray(this.yAxis()) && numLeft) {\n echarts.util.merge(legends[0], { left: legendLeftOptions.left }, true);\n } else if (numRight) {\n echarts.util.merge(legends[1], { right: legendRightOptions.right }, true);\n }\n\n const subChartGrids = this.subChartGrids();\n if (subChartGrids) {\n if (subChartGrids.length !== this.customLegend.length) {\n const diff = subChartGrids.length - this.customLegend.length;\n if (diff < 0) {\n this.customLegend.length = subChartGrids.length;\n } else {\n for (let i = 0; i < diff; i++) {\n // Add default custom legends for all grids\n const cl: CustomLegend = {\n customLegends: [\n { list: [], unit: '' },\n { list: [], unit: '' }\n ],\n legendAxis: 'both'\n };\n this.customLegend.push(cl);\n }\n }\n }\n const margin = 16;\n // calculate custom legend positions from top according to subcharts.\n for (let i = 0; i < subChartGrids.length; i++) {\n if (i === 0) {\n this.customLegend[i].top = 0;\n } else {\n const prevGrid = subChartGrids[i - 1];\n const subChartTop = (prevGrid.top as number) ?? 0;\n const subChartHeight = (prevGrid.height as number) ?? 0;\n this.customLegend[i].top = subChartTop + subChartHeight + margin;\n }\n }\n }\n\n const seriesValue = this.series();\n if (seriesValue) {\n const optionSeries = this.actualOptions.series as CartesianChartSeries[];\n seriesValue.forEach(series => {\n const s: any = Object.assign(\n {\n stack: this.stacked()\n },\n series\n );\n if (s.type === 'line' && s.area) {\n delete s.area;\n s.areaStyle = {};\n } else {\n s.areaStyle ??= null;\n }\n delete s.visible;\n\n if ('symbol' in series && !this.shapePaths[series.symbol as string]) {\n s.symbol = 'circle';\n }\n\n optionSeries.push(s);\n\n if (this.showLegend() && series.name) {\n let legendIndex = 0;\n const axis = yAxisArray[series.yAxisIndex ?? 0];\n if (axis?.position === 'right') {\n legendIndex = 1;\n }\n\n let customLegendProp: CustomLegendProps | undefined;\n if (this.showCustomLegend()) {\n // get left and right axis units from axis array\n if (axis && (axis.show === undefined || axis.show)) {\n if ((!leftUnitText || leftUnitText !== axis.name) && axis.position === 'left') {\n if (axis.name != null) {\n // axis.name is the same property name which eChart uses to display axis title,\n // hence in case of custom legends units were shown at two places i.e. at axis\n // title as well as custom legend unit section. Thus changing the property name\n // to customLegendUnit only in case custom legends are used.\n axis.customLegendUnit = axis.name;\n }\n if (axis.customLegendUnit != null) {\n leftUnitText = axis.customLegendUnit;\n }\n } else if (\n (!rightUnitText || rightUnitText !== axis.name) &&\n axis.position === 'right'\n ) {\n if (axis.name != null) {\n // axis.name is the same property name which eChart uses to display axis title,\n // hence in case of custom legends units were shown at two places i.e. at axis\n // title as well as custom legend unit section. Thus changing the property name\n // to customLegendUnit only in case custom legends are used.\n axis.customLegendUnit = axis.name;\n }\n if (axis.customLegendUnit != null) {\n rightUnitText = axis.customLegendUnit;\n }\n }\n delete axis.name;\n }\n\n const unitText = axis.position === 'right' ? rightUnitText : leftUnitText;\n customLegendProp = {\n displayName: s.displayName,\n tooltip: s.customLegendToolTip,\n unit: unitText\n };\n }\n // As we have only 1 xAxis per sub chart, xAxisIndex equals grid index.\n const seriesSymbol = 'symbol' in s ? (s.symbol as string) : 'circle';\n this.addLegendItem(\n series.name as string,\n series.visible,\n legendIndex,\n series.xAxisIndex,\n customLegendProp,\n seriesSymbol\n );\n }\n });\n }\n\n this.applyTitles();\n if (this.externalZoomSlider()) {\n this.extZoomSliderOptions.legend = this.actualOptions.legend;\n }\n }\n\n private hasDifferentMarker(): boolean {\n const seriesValue = this.series();\n return !!seriesValue?.some(series => 'symbol' in series && series.symbol !== 'circle');\n }\n\n private getGrid(): GridComponentOption | GridComponentOption[] {\n const subChartGrids = this.subChartGrids();\n if (subChartGrids) {\n subChartGrids.forEach(g => (g.containLabel = false));\n return subChartGrids as GridComponentOption[];\n }\n return {};\n }\n\n override refreshSeries(isLive: boolean = true, dzToSet?: DataZoomRange): void {\n const seriesValue = this.series();\n if (!seriesValue) {\n return;\n }\n const optionSeries = this.actualOptions.series as CartesianChartSeries[];\n seriesValue.forEach((series, i) => {\n optionSeries[i].data = series.data;\n });\n super.refreshSeries(isLive, dzToSet);\n }\n\n protected override hasData(): boolean {\n return this.series()?.some(s => s.visible !== false && s.data && s.data.length > 0) ?? false;\n }\n\n protected override handleSelectionChanged(event: any): void {\n if (event?.selected) {\n this.series()?.forEach(series => (series.visible = event.selected[series.name!] !== false));\n }\n super.handleSelectionChanged(event);\n }\n\n /**\n * Update single chart data entry.\n */\n addData(index: number, data: CartesianChartData): void {\n this.addDataInternal([{ index, data }]);\n }\n\n /**\n * Append charts data entries to the end of the series.\n */\n addDataMulti(series: SeriesUpdate<CartesianChartData>[]): void {\n this.addDataInternal(series);\n }\n}\n","@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-chart-cartesian.component';\nexport * from './si-chart-cartesian.interfaces';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Component } from '@angular/core';
|
|
2
|
+
import { ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
3
|
import { echarts, SiChartBaseComponent } from '@siemens/charts-ng/common';
|
|
4
4
|
import { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';
|
|
5
5
|
import { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';
|
|
@@ -39,11 +39,11 @@ echarts.use([
|
|
|
39
39
|
]);
|
|
40
40
|
class SiChartComponent extends SiChartBaseComponent {
|
|
41
41
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
42
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiChartComponent, isStandalone: true, selector: "si-chart", usesInheritance: true, ngImport: i0, template: "@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "component", type: SiCustomLegendComponent, selector: "si-custom-legend", inputs: ["customLegend", "title", "subTitle", "titleColor", "subTitleColor", "textColor"], outputs: ["legendIconClickEvent", "legendClickEvent", "legendHoverStartEvent", "legendHoverEndEvent"] }, { kind: "component", type: SiChartLoadingSpinnerComponent, selector: "si-chart-loading-spinner" }] });
|
|
42
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiChartComponent, isStandalone: true, selector: "si-chart", usesInheritance: true, ngImport: i0, template: "@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "component", type: SiCustomLegendComponent, selector: "si-custom-legend", inputs: ["customLegend", "title", "subTitle", "titleColor", "subTitleColor", "textColor"], outputs: ["legendIconClickEvent", "legendClickEvent", "legendHoverStartEvent", "legendHoverEndEvent"] }, { kind: "component", type: SiChartLoadingSpinnerComponent, selector: "si-chart-loading-spinner" }], changeDetection: i0.ChangeDetectionStrategy.Default });
|
|
43
43
|
}
|
|
44
44
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartComponent, decorators: [{
|
|
45
45
|
type: Component,
|
|
46
|
-
args: [{ selector: 'si-chart', imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent], template: "@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"] }]
|
|
46
|
+
args: [{ selector: 'si-chart', imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent], changeDetection: ChangeDetectionStrategy.Default, template: "@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"] }]
|
|
47
47
|
}] });
|
|
48
48
|
|
|
49
49
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"siemens-charts-ng-chart.mjs","sources":["../../../../projects/charts-ng/chart/si-chart.component.ts","../../../../projects/charts-ng/common/si-chart-base.component.html","../../../../projects/charts-ng/chart/index.ts","../../../../projects/charts-ng/chart/siemens-charts-ng-chart.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Component } from '@angular/core';\nimport { echarts, SiChartBaseComponent } from '@siemens/charts-ng/common';\nimport { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';\nimport {\n BarChart,\n LineChart,\n ScatterChart,\n CandlestickChart,\n HeatmapChart,\n PieChart,\n GaugeChart,\n SankeyChart,\n SunburstChart,\n CustomChart\n} from 'echarts/charts';\nimport {\n LegendComponent,\n GridComponent,\n DataZoomComponent,\n VisualMapComponent,\n ToolboxComponent,\n BrushComponent,\n MarkAreaComponent,\n MarkLineComponent,\n MarkPointComponent,\n AxisPointerComponent,\n DatasetComponent,\n PolarComponent,\n SingleAxisComponent\n} from 'echarts/components';\nimport { LegacyGridContainLabel } from 'echarts/features';\n\necharts.use([\n BarChart,\n LineChart,\n ScatterChart,\n CandlestickChart,\n HeatmapChart,\n PieChart,\n GaugeChart,\n SankeyChart,\n SunburstChart,\n DatasetComponent,\n CustomChart,\n LegendComponent,\n GridComponent,\n DataZoomComponent,\n VisualMapComponent,\n ToolboxComponent,\n BrushComponent,\n MarkAreaComponent,\n MarkLineComponent,\n MarkPointComponent,\n AxisPointerComponent,\n PolarComponent,\n SingleAxisComponent,\n LegacyGridContainLabel\n]);\n\n@Component({\n selector: 'si-chart',\n imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent],\n templateUrl: '../common/si-chart-base.component.html',\n styleUrl: '../common/si-chart-base.component.scss'\n})\nexport class SiChartComponent extends SiChartBaseComponent {}\n","@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-chart.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;AAAA;;;AAGG;AAkCH,OAAO,CAAC,GAAG,CAAC;IACV,QAAQ;IACR,SAAS;IACT,YAAY;IACZ,gBAAgB;IAChB,YAAY;IACZ,QAAQ;IACR,UAAU;IACV,WAAW;IACX,aAAa;IACb,gBAAgB;IAChB,WAAW;IACX,eAAe;IACf,aAAa;IACb,iBAAiB;IACjB,kBAAkB;IAClB,gBAAgB;IAChB,cAAc;IACd,iBAAiB;IACjB,iBAAiB;IACjB,kBAAkB;IAClB,oBAAoB;IACpB,cAAc;IACd,mBAAmB;IACnB;AACD,CAAA,CAAC;
|
|
1
|
+
{"version":3,"file":"siemens-charts-ng-chart.mjs","sources":["../../../../projects/charts-ng/chart/si-chart.component.ts","../../../../projects/charts-ng/common/si-chart-base.component.html","../../../../projects/charts-ng/chart/index.ts","../../../../projects/charts-ng/chart/siemens-charts-ng-chart.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { ChangeDetectionStrategy, Component } from '@angular/core';\nimport { echarts, SiChartBaseComponent } from '@siemens/charts-ng/common';\nimport { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';\nimport {\n BarChart,\n LineChart,\n ScatterChart,\n CandlestickChart,\n HeatmapChart,\n PieChart,\n GaugeChart,\n SankeyChart,\n SunburstChart,\n CustomChart\n} from 'echarts/charts';\nimport {\n LegendComponent,\n GridComponent,\n DataZoomComponent,\n VisualMapComponent,\n ToolboxComponent,\n BrushComponent,\n MarkAreaComponent,\n MarkLineComponent,\n MarkPointComponent,\n AxisPointerComponent,\n DatasetComponent,\n PolarComponent,\n SingleAxisComponent\n} from 'echarts/components';\nimport { LegacyGridContainLabel } from 'echarts/features';\n\necharts.use([\n BarChart,\n LineChart,\n ScatterChart,\n CandlestickChart,\n HeatmapChart,\n PieChart,\n GaugeChart,\n SankeyChart,\n SunburstChart,\n DatasetComponent,\n CustomChart,\n LegendComponent,\n GridComponent,\n DataZoomComponent,\n VisualMapComponent,\n ToolboxComponent,\n BrushComponent,\n MarkAreaComponent,\n MarkLineComponent,\n MarkPointComponent,\n AxisPointerComponent,\n PolarComponent,\n SingleAxisComponent,\n LegacyGridContainLabel\n]);\n\n@Component({\n selector: 'si-chart',\n imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent],\n templateUrl: '../common/si-chart-base.component.html',\n styleUrl: '../common/si-chart-base.component.scss',\n changeDetection: ChangeDetectionStrategy.Default\n})\nexport class SiChartComponent extends SiChartBaseComponent {}\n","@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-chart.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;AAAA;;;AAGG;AAkCH,OAAO,CAAC,GAAG,CAAC;IACV,QAAQ;IACR,SAAS;IACT,YAAY;IACZ,gBAAgB;IAChB,YAAY;IACZ,QAAQ;IACR,UAAU;IACV,WAAW;IACX,aAAa;IACb,gBAAgB;IAChB,WAAW;IACX,eAAe;IACf,aAAa;IACb,iBAAiB;IACjB,kBAAkB;IAClB,gBAAgB;IAChB,cAAc;IACd,iBAAiB;IACjB,iBAAiB;IACjB,kBAAkB;IAClB,oBAAoB;IACpB,cAAc;IACd,mBAAmB;IACnB;AACD,CAAA,CAAC;AASI,MAAO,gBAAiB,SAAQ,oBAAoB,CAAA;uGAA7C,gBAAgB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,UAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECvE7B,omEAgEA,EAAA,MAAA,EAAA,CAAA,4/BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDEY,uBAAuB,+PAAE,8BAA8B,EAAA,QAAA,EAAA,0BAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,OAAA,EAAA,CAAA;;2FAKtD,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAP5B,SAAS;+BACE,UAAU,EAAA,OAAA,EACX,CAAC,uBAAuB,EAAE,8BAA8B,CAAC,EAAA,eAAA,EAGjD,uBAAuB,CAAC,OAAO,EAAA,QAAA,EAAA,omEAAA,EAAA,MAAA,EAAA,CAAA,4/BAAA,CAAA,EAAA;;;AErElD;;;AAGG;;ACHH;;AAEG;;;;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { input, Component } from '@angular/core';
|
|
2
|
+
import { input, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
3
|
import { echarts, SiChartBaseComponent } from '@siemens/charts-ng/common';
|
|
4
4
|
import { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';
|
|
5
5
|
import { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';
|
|
@@ -70,11 +70,11 @@ class SiChartCircleComponent extends SiChartBaseComponent {
|
|
|
70
70
|
this.updateEChart();
|
|
71
71
|
}
|
|
72
72
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartCircleComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
73
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiChartCircleComponent, isStandalone: true, selector: "si-chart-circle", inputs: { series: { classPropertyName: "series", publicName: "series", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "component", type: SiCustomLegendComponent, selector: "si-custom-legend", inputs: ["customLegend", "title", "subTitle", "titleColor", "subTitleColor", "textColor"], outputs: ["legendIconClickEvent", "legendClickEvent", "legendHoverStartEvent", "legendHoverEndEvent"] }, { kind: "component", type: SiChartLoadingSpinnerComponent, selector: "si-chart-loading-spinner" }] });
|
|
73
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiChartCircleComponent, isStandalone: true, selector: "si-chart-circle", inputs: { series: { classPropertyName: "series", publicName: "series", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "component", type: SiCustomLegendComponent, selector: "si-custom-legend", inputs: ["customLegend", "title", "subTitle", "titleColor", "subTitleColor", "textColor"], outputs: ["legendIconClickEvent", "legendClickEvent", "legendHoverStartEvent", "legendHoverEndEvent"] }, { kind: "component", type: SiChartLoadingSpinnerComponent, selector: "si-chart-loading-spinner" }], changeDetection: i0.ChangeDetectionStrategy.Default });
|
|
74
74
|
}
|
|
75
75
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartCircleComponent, decorators: [{
|
|
76
76
|
type: Component,
|
|
77
|
-
args: [{ selector: 'si-chart-circle', imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent], template: "@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"] }]
|
|
77
|
+
args: [{ selector: 'si-chart-circle', imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent], changeDetection: ChangeDetectionStrategy.Default, template: "@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"] }]
|
|
78
78
|
}], propDecorators: { series: [{ type: i0.Input, args: [{ isSignal: true, alias: "series", required: false }] }] } });
|
|
79
79
|
|
|
80
80
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"siemens-charts-ng-circle.mjs","sources":["../../../../projects/charts-ng/circle/si-chart-circle.component.ts","../../../../projects/charts-ng/common/si-chart-base.component.html","../../../../projects/charts-ng/circle/index.ts","../../../../projects/charts-ng/circle/siemens-charts-ng-circle.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Component, input } from '@angular/core';\nimport { SiChartBaseComponent, PieSeriesOption, echarts } from '@siemens/charts-ng/common';\nimport { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';\nimport { PieChart } from 'echarts/charts';\nimport { LegendComponent } from 'echarts/components';\n\nimport { CircleChartData, CircleChartSeries, CircleValueUpdate } from './si-chart-circle.interface';\n\necharts.use([PieChart, LegendComponent]);\n\n@Component({\n selector: 'si-chart-circle',\n imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent],\n templateUrl: '../common/si-chart-base.component.html',\n styleUrl: '../common/si-chart-base.component.scss'\n})\nexport class SiChartCircleComponent extends SiChartBaseComponent {\n /** The series for the chart. */\n readonly series = input<CircleChartSeries[]>();\n\n protected override applyOptions(): void {\n this.actualOptions = {\n series: [],\n legend: [\n {\n data: []\n }\n ],\n tooltip: {\n trigger: 'item',\n confine: true\n }\n };\n const optionSeries = this.actualOptions.series as PieSeriesOption[];\n\n const offset =\n !this.showCustomLegend() && this.subTitle()\n ? this.getThemeCustomValue(['subTitle', 'legend', 'top'], 0)\n : 0;\n const top = 32 + offset;\n this.series()?.forEach(series => {\n const s: PieSeriesOption = { type: 'pie', top, ...series };\n optionSeries.push(s);\n if (this.showLegend()) {\n series.data.forEach(data => {\n if (data.name) {\n this.addLegendItem(data.name);\n }\n });\n }\n });\n\n this.applyTitles();\n }\n\n protected override applyDataZoom(): void {}\n\n /**\n * Update single value of the circle chart.\n */\n changeSingleValue(index: number, valueIndex: number, value: number): void {\n const optionSeries = this.actualOptions.series as PieSeriesOption[];\n const series = optionSeries[index].data!;\n (series[valueIndex] as CircleChartData).value = value;\n this.updateEChart();\n }\n\n /**\n * Update multiple values of the circle chart.\n */\n changeMultiValues(updateValues: CircleValueUpdate[]): void {\n const optionSeries = this.actualOptions.series as PieSeriesOption[];\n updateValues.forEach(update => {\n const currentSeries = optionSeries[update.seriesIndex].data!;\n if (!currentSeries) {\n return;\n }\n (currentSeries[update.valueIndex] as CircleChartData).value = update.value;\n });\n\n this.updateEChart();\n }\n}\n","@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-chart-circle.component';\nexport * from './si-chart-circle.interface';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;AAAA;;;AAGG;AAUH,OAAO,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,eAAe,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"siemens-charts-ng-circle.mjs","sources":["../../../../projects/charts-ng/circle/si-chart-circle.component.ts","../../../../projects/charts-ng/common/si-chart-base.component.html","../../../../projects/charts-ng/circle/index.ts","../../../../projects/charts-ng/circle/siemens-charts-ng-circle.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { ChangeDetectionStrategy, Component, input } from '@angular/core';\nimport { SiChartBaseComponent, PieSeriesOption, echarts } from '@siemens/charts-ng/common';\nimport { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';\nimport { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';\nimport { PieChart } from 'echarts/charts';\nimport { LegendComponent } from 'echarts/components';\n\nimport { CircleChartData, CircleChartSeries, CircleValueUpdate } from './si-chart-circle.interface';\n\necharts.use([PieChart, LegendComponent]);\n\n@Component({\n selector: 'si-chart-circle',\n imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent],\n templateUrl: '../common/si-chart-base.component.html',\n styleUrl: '../common/si-chart-base.component.scss',\n changeDetection: ChangeDetectionStrategy.Default\n})\nexport class SiChartCircleComponent extends SiChartBaseComponent {\n /** The series for the chart. */\n readonly series = input<CircleChartSeries[]>();\n\n protected override applyOptions(): void {\n this.actualOptions = {\n series: [],\n legend: [\n {\n data: []\n }\n ],\n tooltip: {\n trigger: 'item',\n confine: true\n }\n };\n const optionSeries = this.actualOptions.series as PieSeriesOption[];\n\n const offset =\n !this.showCustomLegend() && this.subTitle()\n ? this.getThemeCustomValue(['subTitle', 'legend', 'top'], 0)\n : 0;\n const top = 32 + offset;\n this.series()?.forEach(series => {\n const s: PieSeriesOption = { type: 'pie', top, ...series };\n optionSeries.push(s);\n if (this.showLegend()) {\n series.data.forEach(data => {\n if (data.name) {\n this.addLegendItem(data.name);\n }\n });\n }\n });\n\n this.applyTitles();\n }\n\n protected override applyDataZoom(): void {}\n\n /**\n * Update single value of the circle chart.\n */\n changeSingleValue(index: number, valueIndex: number, value: number): void {\n const optionSeries = this.actualOptions.series as PieSeriesOption[];\n const series = optionSeries[index].data!;\n (series[valueIndex] as CircleChartData).value = value;\n this.updateEChart();\n }\n\n /**\n * Update multiple values of the circle chart.\n */\n changeMultiValues(updateValues: CircleValueUpdate[]): void {\n const optionSeries = this.actualOptions.series as PieSeriesOption[];\n updateValues.forEach(update => {\n const currentSeries = optionSeries[update.seriesIndex].data!;\n if (!currentSeries) {\n return;\n }\n (currentSeries[update.valueIndex] as CircleChartData).value = update.value;\n });\n\n this.updateEChart();\n }\n}\n","@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-chart-circle.component';\nexport * from './si-chart-circle.interface';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -3,7 +3,7 @@ import * as echarts from 'echarts/core';
|
|
|
3
3
|
export { echarts };
|
|
4
4
|
import { CanvasRenderer, SVGRenderer } from 'echarts/renderers';
|
|
5
5
|
import * as i0 from '@angular/core';
|
|
6
|
-
import { viewChild, viewChildren, input, model, output, signal, inject, ChangeDetectorRef, NgZone, Component } from '@angular/core';
|
|
6
|
+
import { viewChild, viewChildren, input, model, output, signal, inject, ChangeDetectorRef, NgZone, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
7
7
|
import { SiCustomLegendComponent } from '@siemens/charts-ng/custom-legend';
|
|
8
8
|
import { SiChartLoadingSpinnerComponent } from '@siemens/charts-ng/loading-spinner';
|
|
9
9
|
|
|
@@ -2317,11 +2317,11 @@ class SiChartBaseComponent {
|
|
|
2317
2317
|
this.cdRef.markForCheck();
|
|
2318
2318
|
}
|
|
2319
2319
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2320
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiChartBaseComponent, isStandalone: true, selector: "si-chart-base", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, additionalOptions: { classPropertyName: "additionalOptions", publicName: "additionalOptions", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subTitle: { classPropertyName: "subTitle", publicName: "subTitle", isSignal: true, isRequired: false, transformFunction: null }, showLegend: { classPropertyName: "showLegend", publicName: "showLegend", isSignal: true, isRequired: false, transformFunction: null }, showCustomLegend: { classPropertyName: "showCustomLegend", publicName: "showCustomLegend", isSignal: true, isRequired: false, transformFunction: null }, renderer: { classPropertyName: "renderer", publicName: "renderer", isSignal: true, isRequired: false, transformFunction: null }, zoomSlider: { classPropertyName: "zoomSlider", publicName: "zoomSlider", isSignal: true, isRequired: false, transformFunction: null }, zoomSliderShadow: { classPropertyName: "zoomSliderShadow", publicName: "zoomSliderShadow", isSignal: true, isRequired: false, transformFunction: null }, zoomSliderRealtime: { classPropertyName: "zoomSliderRealtime", publicName: "zoomSliderRealtime", isSignal: true, isRequired: false, transformFunction: null }, zoomSliderBrush: { classPropertyName: "zoomSliderBrush", publicName: "zoomSliderBrush", isSignal: true, isRequired: false, transformFunction: null }, zoomInside: { classPropertyName: "zoomInside", publicName: "zoomInside", isSignal: true, isRequired: false, transformFunction: null }, maxEntries: { classPropertyName: "maxEntries", publicName: "maxEntries", isSignal: true, isRequired: false, transformFunction: null }, visibleEntries: { classPropertyName: "visibleEntries", publicName: "visibleEntries", isSignal: true, isRequired: false, transformFunction: null }, visibleRange: { classPropertyName: "visibleRange", publicName: "visibleRange", isSignal: true, isRequired: false, transformFunction: null }, autoZoomSeriesIndex: { classPropertyName: "autoZoomSeriesIndex", publicName: "autoZoomSeriesIndex", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, themeCustomization: { classPropertyName: "themeCustomization", publicName: "themeCustomization", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, axisPointer: { classPropertyName: "axisPointer", publicName: "axisPointer", isSignal: true, isRequired: false, transformFunction: null }, dataZoomRange: { classPropertyName: "dataZoomRange", publicName: "dataZoomRange", isSignal: true, isRequired: false, transformFunction: null }, dataZoomMinValueSpan: { classPropertyName: "dataZoomMinValueSpan", publicName: "dataZoomMinValueSpan", isSignal: true, isRequired: false, transformFunction: null }, dataZoomMaxValueSpan: { classPropertyName: "dataZoomMaxValueSpan", publicName: "dataZoomMaxValueSpan", isSignal: true, isRequired: false, transformFunction: null }, dataZoomFilterMode: { classPropertyName: "dataZoomFilterMode", publicName: "dataZoomFilterMode", isSignal: true, isRequired: false, transformFunction: null }, customLegendAction: { classPropertyName: "customLegendAction", publicName: "customLegendAction", isSignal: true, isRequired: false, transformFunction: null }, selectedItem: { classPropertyName: "selectedItem", publicName: "selectedItem", isSignal: true, isRequired: false, transformFunction: null }, eChartContainerHeight: { classPropertyName: "eChartContainerHeight", publicName: "eChartContainerHeight", isSignal: true, isRequired: false, transformFunction: null }, externalZoomSlider: { classPropertyName: "externalZoomSlider", publicName: "externalZoomSlider", isSignal: true, isRequired: false, transformFunction: null }, externalXAxisFormatter: { classPropertyName: "externalXAxisFormatter", publicName: "externalXAxisFormatter", isSignal: true, isRequired: false, transformFunction: null }, showTimeRangeBar: { classPropertyName: "showTimeRangeBar", publicName: "showTimeRangeBar", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { showLegend: "showLegendChange", visibleEntries: "visibleEntriesChange", visibleRange: "visibleRangeChange", dataZoom: "dataZoom", pointer: "pointer", selectionChanged: "selectionChanged", chartSeriesClick: "chartSeriesClick", chartGridResized: "chartGridResized", customLegendMultiLineInfoEvent: "customLegendMultiLineInfoEvent", timeRangeChange: "timeRangeChange" }, host: { listeners: { "window:theme-switch": "themeSwitch()" } }, viewQueries: [{ propertyName: "chartContainerWrapper", first: true, predicate: ["chartContainerWrapper"], descendants: true, isSignal: true }, { propertyName: "chartContainer", first: true, predicate: ["chart"], descendants: true, isSignal: true }, { propertyName: "externalZoomSliderContainer", first: true, predicate: ["externalZoomSlider"], descendants: true, isSignal: true }, { propertyName: "siCustomLegend", predicate: ["siCustomLegend"], descendants: true, read: SiCustomLegendComponent, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "component", type: SiCustomLegendComponent, selector: "si-custom-legend", inputs: ["customLegend", "title", "subTitle", "titleColor", "subTitleColor", "textColor"], outputs: ["legendIconClickEvent", "legendClickEvent", "legendHoverStartEvent", "legendHoverEndEvent"] }, { kind: "component", type: SiChartLoadingSpinnerComponent, selector: "si-chart-loading-spinner" }] });
|
|
2320
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiChartBaseComponent, isStandalone: true, selector: "si-chart-base", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, additionalOptions: { classPropertyName: "additionalOptions", publicName: "additionalOptions", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subTitle: { classPropertyName: "subTitle", publicName: "subTitle", isSignal: true, isRequired: false, transformFunction: null }, showLegend: { classPropertyName: "showLegend", publicName: "showLegend", isSignal: true, isRequired: false, transformFunction: null }, showCustomLegend: { classPropertyName: "showCustomLegend", publicName: "showCustomLegend", isSignal: true, isRequired: false, transformFunction: null }, renderer: { classPropertyName: "renderer", publicName: "renderer", isSignal: true, isRequired: false, transformFunction: null }, zoomSlider: { classPropertyName: "zoomSlider", publicName: "zoomSlider", isSignal: true, isRequired: false, transformFunction: null }, zoomSliderShadow: { classPropertyName: "zoomSliderShadow", publicName: "zoomSliderShadow", isSignal: true, isRequired: false, transformFunction: null }, zoomSliderRealtime: { classPropertyName: "zoomSliderRealtime", publicName: "zoomSliderRealtime", isSignal: true, isRequired: false, transformFunction: null }, zoomSliderBrush: { classPropertyName: "zoomSliderBrush", publicName: "zoomSliderBrush", isSignal: true, isRequired: false, transformFunction: null }, zoomInside: { classPropertyName: "zoomInside", publicName: "zoomInside", isSignal: true, isRequired: false, transformFunction: null }, maxEntries: { classPropertyName: "maxEntries", publicName: "maxEntries", isSignal: true, isRequired: false, transformFunction: null }, visibleEntries: { classPropertyName: "visibleEntries", publicName: "visibleEntries", isSignal: true, isRequired: false, transformFunction: null }, visibleRange: { classPropertyName: "visibleRange", publicName: "visibleRange", isSignal: true, isRequired: false, transformFunction: null }, autoZoomSeriesIndex: { classPropertyName: "autoZoomSeriesIndex", publicName: "autoZoomSeriesIndex", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, themeCustomization: { classPropertyName: "themeCustomization", publicName: "themeCustomization", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, axisPointer: { classPropertyName: "axisPointer", publicName: "axisPointer", isSignal: true, isRequired: false, transformFunction: null }, dataZoomRange: { classPropertyName: "dataZoomRange", publicName: "dataZoomRange", isSignal: true, isRequired: false, transformFunction: null }, dataZoomMinValueSpan: { classPropertyName: "dataZoomMinValueSpan", publicName: "dataZoomMinValueSpan", isSignal: true, isRequired: false, transformFunction: null }, dataZoomMaxValueSpan: { classPropertyName: "dataZoomMaxValueSpan", publicName: "dataZoomMaxValueSpan", isSignal: true, isRequired: false, transformFunction: null }, dataZoomFilterMode: { classPropertyName: "dataZoomFilterMode", publicName: "dataZoomFilterMode", isSignal: true, isRequired: false, transformFunction: null }, customLegendAction: { classPropertyName: "customLegendAction", publicName: "customLegendAction", isSignal: true, isRequired: false, transformFunction: null }, selectedItem: { classPropertyName: "selectedItem", publicName: "selectedItem", isSignal: true, isRequired: false, transformFunction: null }, eChartContainerHeight: { classPropertyName: "eChartContainerHeight", publicName: "eChartContainerHeight", isSignal: true, isRequired: false, transformFunction: null }, externalZoomSlider: { classPropertyName: "externalZoomSlider", publicName: "externalZoomSlider", isSignal: true, isRequired: false, transformFunction: null }, externalXAxisFormatter: { classPropertyName: "externalXAxisFormatter", publicName: "externalXAxisFormatter", isSignal: true, isRequired: false, transformFunction: null }, showTimeRangeBar: { classPropertyName: "showTimeRangeBar", publicName: "showTimeRangeBar", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { showLegend: "showLegendChange", visibleEntries: "visibleEntriesChange", visibleRange: "visibleRangeChange", dataZoom: "dataZoom", pointer: "pointer", selectionChanged: "selectionChanged", chartSeriesClick: "chartSeriesClick", chartGridResized: "chartGridResized", customLegendMultiLineInfoEvent: "customLegendMultiLineInfoEvent", timeRangeChange: "timeRangeChange" }, host: { listeners: { "window:theme-switch": "themeSwitch()" } }, viewQueries: [{ propertyName: "chartContainerWrapper", first: true, predicate: ["chartContainerWrapper"], descendants: true, isSignal: true }, { propertyName: "chartContainer", first: true, predicate: ["chart"], descendants: true, isSignal: true }, { propertyName: "externalZoomSliderContainer", first: true, predicate: ["externalZoomSlider"], descendants: true, isSignal: true }, { propertyName: "siCustomLegend", predicate: ["siCustomLegend"], descendants: true, read: SiCustomLegendComponent, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "component", type: SiCustomLegendComponent, selector: "si-custom-legend", inputs: ["customLegend", "title", "subTitle", "titleColor", "subTitleColor", "textColor"], outputs: ["legendIconClickEvent", "legendClickEvent", "legendHoverStartEvent", "legendHoverEndEvent"] }, { kind: "component", type: SiChartLoadingSpinnerComponent, selector: "si-chart-loading-spinner" }], changeDetection: i0.ChangeDetectionStrategy.Default });
|
|
2321
2321
|
}
|
|
2322
2322
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiChartBaseComponent, decorators: [{
|
|
2323
2323
|
type: Component,
|
|
2324
|
-
args: [{ selector: 'si-chart-base', imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent], host: {
|
|
2324
|
+
args: [{ selector: 'si-chart-base', imports: [SiCustomLegendComponent, SiChartLoadingSpinnerComponent], changeDetection: ChangeDetectionStrategy.Default, host: {
|
|
2325
2325
|
'(window:theme-switch)': 'themeSwitch()'
|
|
2326
2326
|
}, template: "@if (showCustomLegend() && (title() || subTitle())) {\n <div class=\"si-h5 chart-title chart-title-width\" [style.background-color]=\"backgroundColor()\">\n <div class=\"chart-title-text\" [style.color]=\"titleColor()\">{{ title() }}</div>\n @if (subTitle()) {\n <div class=\"si-body\" [style.color]=\"subTitleColor()\">{{ subTitle() }}</div>\n }\n </div>\n}\n\n<div\n #chartContainerWrapper\n class=\"chart-container-wrapper\"\n [class.chart-scroll]=\"containerHeight()\"\n [attr.tabindex]=\"containerHeight() ? '0' : null\"\n>\n <div class=\"chart-container\" [style.height.px]=\"containerHeight()\">\n @if (showCustomLegend()) {\n @for (cl of customLegend; track $index) {\n <si-custom-legend\n #siCustomLegend\n class=\"custom-legend\"\n [style.top.px]=\"cl.top\"\n [title]=\"title()\"\n [subTitle]=\"subTitle()\"\n [customLegend]=\"cl\"\n [style.background-color]=\"backgroundColor()\"\n [titleColor]=\"titleColor()\"\n [subTitleColor]=\"subTitleColor()\"\n [textColor]=\"textColor()\"\n (legendIconClickEvent)=\"handleLegendClick($event)\"\n (legendClickEvent)=\"handleLegendClick($event)\"\n (legendHoverStartEvent)=\"handleLegendHover($event, true)\"\n (legendHoverEndEvent)=\"handleLegendHover($event, false)\"\n />\n }\n }\n <div #chart class=\"echart-container\" [style.height.px]=\"containerHeight()\"></div>\n </div>\n</div>\n@if (externalZoomSlider()) {\n <div\n #externalZoomSlider\n class=\"external-zoom-container\"\n [class.has-time-range-bar]=\"showTimeRangeBar()\"\n [style.--time-bar-height.px]=\"timeBarHeight()\"\n ></div>\n}\n\n@if (showTimeRangeBar() && zoomSlider()) {\n <div\n class=\"time-range-bar\"\n [style.bottom.px]=\"timeBarBottom()\"\n [style.padding-left.px]=\"timeBarLeft()\"\n [style.padding-right.px]=\"timeBarRight()\"\n >\n <ng-content select=\"[slot=timeRangeBar]\" />\n </div>\n}\n\n@if (inProgress()) {\n <div class=\"progress-container\">\n <si-chart-loading-spinner />\n </div>\n}\n", styles: [":host{block-size:100%;position:relative;display:flex!important;flex-direction:column;inline-size:100%}.chart-container-wrapper{display:flex;flex:1 0 0;inline-size:inherit;overflow:hidden}.chart-scroll{overflow-y:auto}.chart-container{position:relative;display:flex;flex:1 0 0;overflow:hidden}.echart-container{flex:1 0 0;inline-size:100%;min-block-size:var(--si-chart-min-height, 200px);overflow:hidden}.custom-legend{position:absolute;z-index:2;inline-size:100%}.chart-title{padding-block:12px 8px;padding-inline-start:24px}.external-zoom-container{display:flex;flex:1 0 0;inline-size:inherit;max-block-size:112px}.external-zoom-container.has-time-range-bar{max-block-size:calc(112px + var(--time-bar-height))}.tooltip-inner{max-inline-size:375px;min-inline-size:375px;color:#162938;font-size:18px;background-color:#162938}.time-range-bar{position:absolute;inset-inline:0;z-index:2}.progress-container{position:absolute;inset:0;pointer-events:none;z-index:100;display:flex;justify-content:center;align-items:center}\n"] }]
|
|
2327
2327
|
}], propDecorators: { chartContainerWrapper: [{ type: i0.ViewChild, args: ['chartContainerWrapper', { isSignal: true }] }], chartContainer: [{ type: i0.ViewChild, args: ['chart', { isSignal: true }] }], externalZoomSliderContainer: [{ type: i0.ViewChild, args: ['externalZoomSlider', { isSignal: true }] }], siCustomLegend: [{ type: i0.ViewChildren, args: ['siCustomLegend', { ...{
|