npm - @operato/scene-scichart - Versions diffs - 7.2.4 → 7.2.6 - Mend

@operato/scene-scichart 7.2.4 → 7.2.6

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.

Files changed (25) hide show

package/CHANGELOG.md +18 -0
package/db.sqlite +0 -0
package/dist/charts/ox-scichart-multiple.js +42 -27
package/dist/charts/ox-scichart-multiple.js.map +1 -1
package/dist/charts/ox-scichart.js +8 -4
package/dist/charts/ox-scichart.js.map +1 -1
package/dist/charts/scichart-builder.js +51 -28
package/dist/charts/scichart-builder.js.map +1 -1
package/logs/.08636eb59927f12972f6774f5947c8507b3564c2-audit.json +25 -0
package/logs/.5e5d741d8b7784a2fbad65eedc0fd46946aaf6f2-audit.json +25 -0
package/logs/application-2024-08-03-02.log +105 -0
package/logs/application-2024-08-03-11.log +105 -0
package/logs/application-2024-08-03-13.log +105 -0
package/logs/application-2024-08-03-14.log +105 -0
package/logs/application-2024-08-03-15.log +210 -0
package/logs/connections-2024-08-03-02.log +50 -0
package/logs/connections-2024-08-03-11.log +50 -0
package/logs/connections-2024-08-03-13.log +50 -0
package/logs/connections-2024-08-03-14.log +50 -0
package/logs/connections-2024-08-03-15.log +100 -0
package/package.json +2 -2
package/src/charts/ox-scichart-multiple.ts +53 -30
package/src/charts/ox-scichart.ts +7 -3
package/src/charts/scichart-builder.ts +63 -39
package/tsconfig.tsbuildinfo +1 -1

package/CHANGELOG.md CHANGED Viewed

@@ -3,6 +3,24 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+## [7.2.6](https://github.com/things-scene/operato-scene/compare/v7.2.5...v7.2.6) (2024-08-03)
+### :bug: Bug Fix
+* grouped multiple-timeseries ([747c7eb](https://github.com/things-scene/operato-scene/commit/747c7ebb46691ba7f7cebd3246dd520405aa036b))
+## [7.2.5](https://github.com/things-scene/operato-scene/compare/v7.2.4...v7.2.5) (2024-08-03)
+### :bug: Bug Fix
+* scichart yAxis precision ([07bfb65](https://github.com/things-scene/operato-scene/commit/07bfb65812a861951c255e42824d6be3f9817c2d))
 ## [7.2.4](https://github.com/things-scene/operato-scene/compare/v7.2.3...v7.2.4) (2024-08-02)

package/db.sqlite CHANGED Viewed

Binary file

package/dist/charts/ox-scichart-multiple.js CHANGED Viewed

@@ -30,8 +30,14 @@ let OxSciChartMultiple = OxSciChartMultiple_1 = class OxSciChartMultiple extends
         this.containerId = 'ox-scichart-multiple' + ++OxSciChartMultiple_1.idx;
     }
     async initializeSciChart() {
+        var _a;
         this.cleanup();
-        const { chart, dataSeries } = (await buildSciChartOverview(this.config, this.overviewContainer, {}, this.synchronizer)) || {};
+        // Overview 차트는 정확히 일치하는 시리즈 이름만 포함
+        const overviewDatasets = ((_a = this.config) === null || _a === void 0 ? void 0 : _a.data.datasets.filter(dataset => this.visibleSeries.includes(dataset.dataKey))) || [];
+        const { chart, dataSeries } = (await buildSciChartOverview({
+            ...this.config,
+            data: { datasets: overviewDatasets }
+        }, this.overviewContainer, {}, this.synchronizer)) || {};
         this.verticalGroup.addSurfaceToGroup(chart.sciChartSurface);
         this.overviewChart = chart;
         this.overviewDataSeries = dataSeries;
@@ -82,31 +88,39 @@ let OxSciChartMultiple = OxSciChartMultiple_1 = class OxSciChartMultiple extends
         this.groupCharts.length = 0;
     }
     async updateDataSeries() {
-        var _a, _b;
         const { config, data } = this;
         const { datasets = [], labelDataKey: attrX } = (config === null || config === void 0 ? void 0 : config.data) || {};
         if (!(data instanceof Array) || !attrX) {
             return [];
         }
         const newData = this.dataSet;
-        (this.groupCharts || []).forEach(({ dataKey, sciChartSurface, dataSeries }) => {
+        this.groupCharts.forEach(({ dataKey, sciChartSurface, dataSeries }) => {
             try {
-                dataSeries.forEach(ds => ds.clear());
-                const dataSet = newData.filter((data, index) => dataKey == datasets[index].dataKey);
-                dataSet.forEach((data, index) => {
-                    const filteredData = data.filter(d => typeof d.yValue === 'number');
-                    if (filteredData.length > 0) {
-                        dataSeries[index].appendRange(filteredData.map(d => d.xValue), filteredData.map(d => d.yValue));
+                // dataKey로 시작하는 모든 시리즈를 업데이트
+                const relatedDatasets = datasets.filter(dataset => { var _a; return (_a = dataset.dataKey) === null || _a === void 0 ? void 0 : _a.startsWith(dataKey); });
+                // 각 relatedDatasets에 대해 해당하는 dataSeries를 업데이트
+                dataSeries.forEach((ds, index) => {
+                    ds.clear();
+                    const relatedDataset = relatedDatasets[index];
+                    if (relatedDataset) {
+                        const filteredData = newData[datasets.findIndex(ds => ds.dataKey === relatedDataset.dataKey)].filter(d => typeof d.yValue === 'number');
+                        if (filteredData.length > 0) {
+                            ds.appendRange(filteredData.map(d => d.xValue), filteredData.map(d => d.yValue));
+                        }
                     }
                 });
+                // Zoom 및 리렌더링
+                setTimeout(() => {
+                    sciChartSurface.zoomExtents();
+                    sciChartSurface.invalidateElement();
+                }, 200);
             }
             catch (error) {
-                console.log(error);
+                console.error('Error updating data series:', error);
             }
-            sciChartSurface.zoomExtents();
-            sciChartSurface.invalidateElement();
         });
         try {
+            // Overview 차트 데이터 업데이트
             this.overviewDataSeries.forEach(ds => ds.clear());
             newData.forEach((data, index) => {
                 if (this.visibleSeries.includes(datasets[index].dataKey)) {
@@ -116,11 +130,9 @@ let OxSciChartMultiple = OxSciChartMultiple_1 = class OxSciChartMultiple extends
                     }
                 }
             });
-            (_a = this.overviewChart) === null || _a === void 0 ? void 0 : _a.sciChartSurface.zoomExtents();
-            (_b = this.overviewChart) === null || _b === void 0 ? void 0 : _b.sciChartSurface.invalidateElement();
         }
         catch (error) {
-            console.log(error);
+            console.error('Error updating overview data series:', error);
         }
     }
     get dataSet() {
@@ -154,7 +166,7 @@ let OxSciChartMultiple = OxSciChartMultiple_1 = class OxSciChartMultiple extends
         return html `
       <div id=${this.containerId + '-overview'} class="overview" ?hidden=${!this.showOverview}></div>
       <div id="chart-group">
-        ${datasets.map(({ dataKey }) => keyed(dataKey, html `
+        ${this.visibleSeries.map(dataKey => keyed(dataKey, html `
               <div
                 id=${this.containerId + '-' + dataKey}
                 class="grouped-chart"
@@ -190,6 +202,7 @@ let OxSciChartMultiple = OxSciChartMultiple_1 = class OxSciChartMultiple extends
         }
     }
     async addChart(dataKey) {
+        var _a, _b;
         const groupedChart = {
             dataKey: '',
             sciChartSurface: undefined,
@@ -197,35 +210,37 @@ let OxSciChartMultiple = OxSciChartMultiple_1 = class OxSciChartMultiple extends
         };
         const { data = {}, options = {} } = this.config || {};
         const { datasets = [] } = data;
-        const dataset = datasets.find(dataset => dataset.dataKey == dataKey);
-        if (!dataset) {
+        const primaryDataset = datasets.find(dataset => dataset.dataKey == dataKey);
+        if (!primaryDataset) {
             return;
         }
-        const { scales } = options;
-        const { yAxes = [] } = scales || {};
-        const { valueFormat } = dataset;
+        // 해당 dataKey로 시작하는 모든 시리즈를 함께 그룹화하여 차트를 구성
+        const relatedDatasets = datasets.filter(dataset => { var _a; return (_a = dataset.dataKey) === null || _a === void 0 ? void 0 : _a.startsWith(dataKey); });
         const yAxis = {
-            ...yAxes[0],
-            axisTitle: dataset === null || dataset === void 0 ? void 0 : dataset.label
+            ...(_b = (_a = options.scales) === null || _a === void 0 ? void 0 : _a.yAxes) === null || _b === void 0 ? void 0 : _b[0],
+            axisTitle: primaryDataset === null || primaryDataset === void 0 ? void 0 : primaryDataset.label
         };
         const config = {
             ...this.config,
             data: {
-                datasets: [dataset]
+                datasets: relatedDatasets // 이 차트에 포함될 모든 관련 시리즈들
             },
             options: {
                 ...options,
                 scales: {
-                    ...scales,
+                    ...options.scales,
                     yAxes: [yAxis]
                 }
             }
         };
         const container = this.renderRoot.querySelector(`#${this.containerId + '-' + dataKey}`);
-        var { chart, dataSeries } = (await buildSciChart(config, container, { fontSize: 14, fontFamily: 'Roboto', fontColor: undefined }, { precision: valueFormat ? calculatePrecision(valueFormat) : undefined, grouped: this.containerId }));
+        var { chart, dataSeries } = (await buildSciChart(config, container, { fontSize: 14, fontFamily: 'Roboto', fontColor: undefined }, {
+            precision: primaryDataset.valueFormat ? calculatePrecision(primaryDataset.valueFormat) : undefined,
+            grouped: this.containerId
+        }));
         this.verticalGroup.addSurfaceToGroup(chart.sciChartSurface);
         this.synchronizer.addAxis(chart.sciChartSurface.xAxes.get(0));
-        groupedChart.dataKey = config.data.datasets[0].dataKey;
+        groupedChart.dataKey = primaryDataset.dataKey;
         groupedChart.sciChartSurface = chart.sciChartSurface;
         groupedChart.dataSeries = dataSeries;
         this.groupCharts = this.groupSorter([...this.groupCharts, groupedChart]);

package/dist/charts/ox-scichart-multiple.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ox-scichart-multiple.js","sourceRoot":"","sources":["../../src/charts/ox-scichart-multiple.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, css } from 'lit'\nimport { property, query, customElement } from 'lit/decorators.js'\nimport { keyed } from 'lit/directives/keyed.js'\n\nimport { calculatePrecision, buildSciChart, buildSciChartOverview } from './scichart-builder'\nimport { AxisSynchroniser } from './axis-synchronizer'\nimport { NumberRange, scaleAxes, SciChartVerticalGroup } from 'scichart'\n\nimport { ScrollbarStyles } from '@operato/styles'\n\n@customElement('ox-scichart-multiple')\nexport class OxSciChartMultiple extends LitElement {\n @property({ type: Object }) config: OperatoChart.ChartConfig \| null = null\n @property({ type: Array }) data: { [attr: string]: any }[] = []\n @property({ type: Array }) visibleSeries: string[] = []\n @property({ type: Boolean, attribute: 'show-overview' }) showOverview: boolean = true\n\n private synchronizer: AxisSynchroniser = new AxisSynchroniser(new NumberRange(200, 500))\n private verticalGroup: SciChartVerticalGroup = new SciChartVerticalGroup()\n\n private isInitializing: boolean = false\n private overviewChart: any = null\n private overviewDataSeries: any[] = []\n private groupCharts: {\n dataKey: string\n sciChartSurface: any\n dataSeries: any[]\n }[] = []\n\n /\n [주의]\n ox-scichart container의 id를 글로벌 유니크하게 해야한다. \n SciChart가 특별히 container의 id를 기반으로 하위 컴포넌트를 구성하고 있기 때문이다.\n shadowDom 안에 있는 container 이더라도, 글로벌 유니크한 id를 제공해야 한다.\n 그렇지 않으면, 단 하나의 차트만 제대로 렌더링된다.\n /\n private containerId: string = 'ox-scichart-multiple' + ++OxSciChartMultiple.idx\n\n @query('.overview') overviewContainer!: HTMLDivElement\n\n static idx: number = 0\n\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n width: 100%;\n height: 100%;\n }\n\n .overview {\n height: 80px;\n }\n\n #chart-group {\n flex: 1;\n\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n }\n\n .grouped-chart {\n flex: 1;\n\n min-height: 25%;\n }\n\n [hidden] {\n display: none;\n }\n `\n ]\n\n async initializeSciChart() {\n this.cleanup()\n\n const { chart, dataSeries } =\n (await buildSciChartOverview(this.config, this.overviewContainer, {}, this.synchronizer)) \|\| {}\n\n this.verticalGroup.addSurfaceToGroup(chart.sciChartSurface)\n\n this.overviewChart = chart\n this.overviewDataSeries = dataSeries!\n }\n\n async updated(changedProperties: Map<string \| number \| symbol, unknown>) {\n var needDataUpdate = false\n\n if (changedProperties.has('config') && this.config) {\n this.isInitializing = true\n await this.initializeSciChart()\n this.isInitializing = false\n needDataUpdate = true\n }\n\n if (changedProperties.has('visibleSeries')) {\n if (this.isInitializing) {\n await this.ensureInitialization()\n }\n await this.updateSeries(this.visibleSeries, changedProperties.get('visibleSeries') as string[])\n needDataUpdate = true\n }\n\n if (changedProperties.has('data')) {\n needDataUpdate = true\n }\n\n if (needDataUpdate) {\n await this.updateDataSeries()\n }\n }\n\n private async ensureInitialization() {\n while (this.isInitializing) {\n await new Promise(resolve => setTimeout(resolve, 100)) // Check every 100ms\n }\n }\n\n cleanup() {\n this.cleanupGroup()\n\n if (this.overviewChart) {\n this.overviewChart.sciChartSurface?.delete()\n this.overviewChart = null\n }\n }\n\n cleanupGroup() {\n this.groupCharts.forEach(chart => {\n if (chart.sciChartSurface) {\n this.synchronizer.removeAxis(chart.sciChartSurface.xAxes.get(0))\n this.verticalGroup.removeSurface(chart.sciChartSurface)\n chart.sciChartSurface.delete()\n }\n })\n\n this.groupCharts.length = 0\n }\n\n async updateDataSeries() {\n const { config, data } = this\n const { datasets = [], labelDataKey: attrX } = config?.data \|\| {}\n\n if (!(data instanceof Array) \|\| !attrX) {\n return []\n }\n\n const newData = this.dataSet\n\n ;(this.groupCharts \|\| []).forEach(({ dataKey, sciChartSurface, dataSeries }) => {\n try {\n dataSeries.forEach(ds => ds.clear())\n const dataSet = newData.filter((data, index) => dataKey == datasets[index].dataKey!)\n\n dataSet.forEach((data, index) => {\n const filteredData = data.filter(d => typeof d.yValue === 'number')\n\n if (filteredData.length > 0) {\n dataSeries[index].appendRange(\n filteredData.map(d => d.xValue),\n filteredData.map(d => d.yValue)\n )\n }\n })\n } catch (error) {\n console.log(error)\n }\n\n sciChartSurface.zoomExtents()\n sciChartSurface.invalidateElement()\n })\n\n try {\n this.overviewDataSeries.forEach(ds => ds.clear())\n\n newData.forEach((data, index) => {\n if (this.visibleSeries.includes(datasets[index].dataKey!)) {\n const filteredData = data.filter(d => typeof d.yValue === 'number')\n if (filteredData.length > 0) {\n this.overviewDataSeries[index].appendRange(\n filteredData.map(d => d.xValue),\n filteredData.map(d => d.yValue)\n )\n }\n }\n })\n\n this.overviewChart?.sciChartSurface.zoomExtents()\n this.overviewChart?.sciChartSurface.invalidateElement()\n } catch (error) {\n console.log(error)\n }\n }\n\n get dataSet(): { xValue: number; yValue: number }[][] {\n const { config, data } = this\n const { datasets = [], labelDataKey: attrX } = config?.data \|\| {}\n\n if (!(data instanceof Array) \|\| !attrX) {\n return []\n }\n\n return datasets.map(dataset => {\n return data\n .map(item => {\n if (!item \|\| typeof item !== 'object') {\n return\n }\n\n const xValue = new Date(item[attrX])\n if (isNaN(xValue.getTime())) {\n console.error('Invalid date:', item[attrX])\n return\n }\n\n return {\n xValue: xValue.getTime() / 1000,\n yValue: item[dataset.dataKey!]\n }\n })\n .filter(Boolean) as { xValue: number; yValue: number }[]\n })\n }\n\n render() {\n const { datasets = [] } = this.config?.data \|\| {}\n\n return html`\n <div id=${this.containerId + '-overview'} class=\"overview\" ?hidden=${!this.showOverview}></div>\n <div id=\"chart-group\">\n ${datasets.map(({ dataKey }) =>\n keyed(\n dataKey,\n html`\n <div\n id=${this.containerId + '-' + dataKey}\n class=\"grouped-chart\"\n ?hidden=${!this.visibleSeries.includes(dataKey!)}\n ></div>\n `\n )\n )}\n </div>\n `\n }\n\n async buildChartGroup() {\n this.cleanupGroup()\n\n const { config } = this\n const { datasets = [] } = config?.data \|\| {}\n\n await Promise.all(\n datasets\n .filter(dataset => this.visibleSeries.includes(dataset.dataKey!))\n .map(async dataset => {\n await this.addChart(dataset.dataKey!)\n })\n )\n }\n\n async updateSeries(after: string[], before: string[]) {\n /* 기존 시리즈와 새로운 시리즈의 차이를 비교해서, before에는 있는데, after에는 없으면 await removeChart(string)를 호출하고, after에는 있는데, before에는 없으면, addChart(string) 한다. */\n // before에는 있는데 after에는 없는 시리즈를 제거합니다.\n for (const series of before \|\| []) {\n if (!after.includes(series)) {\n await this.removeChart(series)\n }\n }\n\n // after에는 있는데 before에는 없는 시리즈를 추가합니다.\n for (const series of after \|\| []) {\n if (!before \|\| !before.includes(series)) {\n await this.addChart(series)\n }\n }\n }\n\n async addChart(dataKey: string) {\n const groupedChart = {\n dataKey: '',\n sciChartSurface: undefined,\n dataSeries: [] as any[]\n }\n\n const { data = {}, options = {} } = this.config \|\| {}\n const { datasets = [] } = data as OperatoChart.ChartData\n const dataset = datasets.find(dataset => dataset.dataKey == dataKey)\n\n if (!dataset) {\n return\n }\n\n const { scales } = options\n const { yAxes = [] } = scales \|\| {}\n const { valueFormat } = dataset\n\n const yAxis = {\n ...yAxes[0],\n axisTitle: dataset?.label\n }\n\n const config = {\n ...this.config,\n data: {\n datasets: [dataset]\n },\n options: {\n ...options,\n scales: {\n ...scales,\n yAxes: [yAxis]\n }\n }\n }\n\n const container = this.renderRoot.querySelector(`#${this.containerId + '-' + dataKey}`)\n var { chart, dataSeries } = (await buildSciChart(\n config,\n container,\n { fontSize: 14, fontFamily: 'Roboto', fontColor: undefined },\n { precision: valueFormat ? calculatePrecision(valueFormat) : undefined, grouped: this.containerId }\n ))!\n\n this.verticalGroup.addSurfaceToGroup(chart.sciChartSurface)\n this.synchronizer.addAxis(chart.sciChartSurface.xAxes.get(0))\n\n groupedChart.dataKey = config.data.datasets[0]!.dataKey!\n groupedChart.sciChartSurface = chart.sciChartSurface\n groupedChart.dataSeries = dataSeries\n\n this.groupCharts = this.groupSorter([...this.groupCharts, groupedChart])\n }\n\n removeChart(dataKey: string) {\n const index = this.groupCharts.findIndex((chart: any) => chart.dataKey == dataKey)\n const [groupedChart] = this.groupCharts.splice(index, 1)\n\n if (!groupedChart) {\n return\n }\n\n this.verticalGroup.removeSurface(groupedChart.sciChartSurface)\n this.synchronizer.removeAxis(groupedChart.sciChartSurface.xAxes.get(0))\n\n groupedChart.sciChartSurface.delete()\n groupedChart.sciChartSurface = undefined\n\n this.groupCharts = this.groupSorter(this.groupCharts)\n }\n\n groupSorter(group: any[]) {\n return group.sort(\n (a, b) =>\n this.visibleSeries.findIndex((s: any) => s.dataKey == a.dataKey) -\n this.visibleSeries.findIndex((s: any) => s.dataKey == b.dataKey)\n )\n }\n\n async appendData(appendum: { [attr: string]: any }[]) {}\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ox-scichart-multiple': OxSciChartMultiple\n }\n}\n"]}
1	+ {"version":3,"file":"ox-scichart-multiple.js","sourceRoot":"","sources":["../../src/charts/ox-scichart-multiple.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, css } from 'lit'\nimport { property, query, customElement } from 'lit/decorators.js'\nimport { keyed } from 'lit/directives/keyed.js'\n\nimport { calculatePrecision, buildSciChart, buildSciChartOverview } from './scichart-builder'\nimport { AxisSynchroniser } from './axis-synchronizer'\nimport { NumberRange, scaleAxes, SciChartVerticalGroup } from 'scichart'\n\nimport { ScrollbarStyles } from '@operato/styles'\n\n@customElement('ox-scichart-multiple')\nexport class OxSciChartMultiple extends LitElement {\n @property({ type: Object }) config: OperatoChart.ChartConfig \| null = null\n @property({ type: Array }) data: { [attr: string]: any }[] = []\n @property({ type: Array }) visibleSeries: string[] = []\n @property({ type: Boolean, attribute: 'show-overview' }) showOverview: boolean = true\n\n private synchronizer: AxisSynchroniser = new AxisSynchroniser(new NumberRange(200, 500))\n private verticalGroup: SciChartVerticalGroup = new SciChartVerticalGroup()\n\n private isInitializing: boolean = false\n private overviewChart: any = null\n private overviewDataSeries: any[] = []\n private groupCharts: {\n dataKey: string\n sciChartSurface: any\n dataSeries: any[]\n }[] = []\n\n /\n [주의]\n ox-scichart container의 id를 글로벌 유니크하게 해야한다. \n SciChart가 특별히 container의 id를 기반으로 하위 컴포넌트를 구성하고 있기 때문이다.\n shadowDom 안에 있는 container 이더라도, 글로벌 유니크한 id를 제공해야 한다.\n 그렇지 않으면, 단 하나의 차트만 제대로 렌더링된다.\n /\n private containerId: string = 'ox-scichart-multiple' + ++OxSciChartMultiple.idx\n\n @query('.overview') overviewContainer!: HTMLDivElement\n\n static idx: number = 0\n\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n width: 100%;\n height: 100%;\n }\n\n .overview {\n height: 80px;\n }\n\n #chart-group {\n flex: 1;\n\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n }\n\n .grouped-chart {\n flex: 1;\n\n min-height: 25%;\n }\n\n [hidden] {\n display: none;\n }\n `\n ]\n\n async initializeSciChart() {\n this.cleanup()\n\n // Overview 차트는 정확히 일치하는 시리즈 이름만 포함\n const overviewDatasets =\n this.config?.data.datasets.filter(dataset => this.visibleSeries.includes(dataset.dataKey!)) \|\| []\n\n const { chart, dataSeries } =\n (await buildSciChartOverview(\n {\n ...this.config,\n data: { datasets: overviewDatasets }\n },\n this.overviewContainer,\n {},\n this.synchronizer\n )) \|\| {}\n\n this.verticalGroup.addSurfaceToGroup(chart.sciChartSurface)\n\n this.overviewChart = chart\n this.overviewDataSeries = dataSeries!\n }\n\n async updated(changedProperties: Map<string \| number \| symbol, unknown>) {\n var needDataUpdate = false\n\n if (changedProperties.has('config') && this.config) {\n this.isInitializing = true\n await this.initializeSciChart()\n this.isInitializing = false\n needDataUpdate = true\n }\n\n if (changedProperties.has('visibleSeries')) {\n if (this.isInitializing) {\n await this.ensureInitialization()\n }\n await this.updateSeries(this.visibleSeries, changedProperties.get('visibleSeries') as string[])\n needDataUpdate = true\n }\n\n if (changedProperties.has('data')) {\n needDataUpdate = true\n }\n\n if (needDataUpdate) {\n await this.updateDataSeries()\n }\n }\n\n private async ensureInitialization() {\n while (this.isInitializing) {\n await new Promise(resolve => setTimeout(resolve, 100)) // Check every 100ms\n }\n }\n\n cleanup() {\n this.cleanupGroup()\n\n if (this.overviewChart) {\n this.overviewChart.sciChartSurface?.delete()\n this.overviewChart = null\n }\n }\n\n cleanupGroup() {\n this.groupCharts.forEach(chart => {\n if (chart.sciChartSurface) {\n this.synchronizer.removeAxis(chart.sciChartSurface.xAxes.get(0))\n this.verticalGroup.removeSurface(chart.sciChartSurface)\n chart.sciChartSurface.delete()\n }\n })\n\n this.groupCharts.length = 0\n }\n\n async updateDataSeries() {\n const { config, data } = this\n const { datasets = [], labelDataKey: attrX } = config?.data \|\| {}\n\n if (!(data instanceof Array) \|\| !attrX) {\n return []\n }\n\n const newData = this.dataSet\n\n this.groupCharts.forEach(({ dataKey, sciChartSurface, dataSeries }) => {\n try {\n // dataKey로 시작하는 모든 시리즈를 업데이트\n const relatedDatasets = datasets.filter(dataset => dataset.dataKey?.startsWith(dataKey))\n\n // 각 relatedDatasets에 대해 해당하는 dataSeries를 업데이트\n dataSeries.forEach((ds, index) => {\n ds.clear()\n\n const relatedDataset = relatedDatasets[index]\n if (relatedDataset) {\n const filteredData = newData[datasets.findIndex(ds => ds.dataKey === relatedDataset.dataKey)].filter(\n d => typeof d.yValue === 'number'\n )\n\n if (filteredData.length > 0) {\n ds.appendRange(\n filteredData.map(d => d.xValue),\n filteredData.map(d => d.yValue)\n )\n }\n }\n })\n\n // Zoom 및 리렌더링\n setTimeout(() => {\n sciChartSurface.zoomExtents()\n sciChartSurface.invalidateElement()\n }, 200)\n } catch (error) {\n console.error('Error updating data series:', error)\n }\n })\n\n try {\n // Overview 차트 데이터 업데이트\n this.overviewDataSeries.forEach(ds => ds.clear())\n\n newData.forEach((data, index) => {\n if (this.visibleSeries.includes(datasets[index].dataKey!)) {\n const filteredData = data.filter(d => typeof d.yValue === 'number')\n if (filteredData.length > 0) {\n this.overviewDataSeries[index].appendRange(\n filteredData.map(d => d.xValue),\n filteredData.map(d => d.yValue)\n )\n }\n }\n })\n } catch (error) {\n console.error('Error updating overview data series:', error)\n }\n }\n\n get dataSet(): { xValue: number; yValue: number }[][] {\n const { config, data } = this\n const { datasets = [], labelDataKey: attrX } = config?.data \|\| {}\n\n if (!(data instanceof Array) \|\| !attrX) {\n return []\n }\n\n return datasets.map(dataset => {\n return data\n .map(item => {\n if (!item \|\| typeof item !== 'object') {\n return\n }\n\n const xValue = new Date(item[attrX])\n if (isNaN(xValue.getTime())) {\n console.error('Invalid date:', item[attrX])\n return\n }\n\n return {\n xValue: xValue.getTime() / 1000,\n yValue: item[dataset.dataKey!]\n }\n })\n .filter(Boolean) as { xValue: number; yValue: number }[]\n })\n }\n\n render() {\n const { datasets = [] } = this.config?.data \|\| {}\n\n return html`\n <div id=${this.containerId + '-overview'} class=\"overview\" ?hidden=${!this.showOverview}></div>\n <div id=\"chart-group\">\n ${this.visibleSeries.map(dataKey =>\n keyed(\n dataKey,\n html`\n <div\n id=${this.containerId + '-' + dataKey}\n class=\"grouped-chart\"\n ?hidden=${!this.visibleSeries.includes(dataKey!)}\n ></div>\n `\n )\n )}\n </div>\n `\n }\n\n async buildChartGroup() {\n this.cleanupGroup()\n\n const { config } = this\n const { datasets = [] } = config?.data \|\| {}\n\n await Promise.all(\n datasets\n .filter(dataset => this.visibleSeries.includes(dataset.dataKey!))\n .map(async dataset => {\n await this.addChart(dataset.dataKey!)\n })\n )\n }\n\n async updateSeries(after: string[], before: string[]) {\n /* 기존 시리즈와 새로운 시리즈의 차이를 비교해서, before에는 있는데, after에는 없으면 await removeChart(string)를 호출하고, after에는 있는데, before에는 없으면, addChart(string) 한다. */\n // before에는 있는데 after에는 없는 시리즈를 제거합니다.\n for (const series of before \|\| []) {\n if (!after.includes(series)) {\n await this.removeChart(series)\n }\n }\n\n // after에는 있는데 before에는 없는 시리즈를 추가합니다.\n for (const series of after \|\| []) {\n if (!before \|\| !before.includes(series)) {\n await this.addChart(series)\n }\n }\n }\n\n async addChart(dataKey: string) {\n const groupedChart = {\n dataKey: '',\n sciChartSurface: undefined,\n dataSeries: [] as any[]\n }\n\n const { data = {}, options = {} } = this.config \|\| {}\n const { datasets = [] } = data as OperatoChart.ChartData\n const primaryDataset = datasets.find(dataset => dataset.dataKey == dataKey)\n\n if (!primaryDataset) {\n return\n }\n\n // 해당 dataKey로 시작하는 모든 시리즈를 함께 그룹화하여 차트를 구성\n const relatedDatasets = datasets.filter(dataset => dataset.dataKey?.startsWith(dataKey))\n\n const yAxis = {\n ...options.scales?.yAxes?.[0],\n axisTitle: primaryDataset?.label\n }\n\n const config = {\n ...this.config,\n data: {\n datasets: relatedDatasets // 이 차트에 포함될 모든 관련 시리즈들\n },\n options: {\n ...options,\n scales: {\n ...options.scales,\n yAxes: [yAxis]\n }\n }\n }\n\n const container = this.renderRoot.querySelector(`#${this.containerId + '-' + dataKey}`)\n var { chart, dataSeries } = (await buildSciChart(\n config,\n container,\n { fontSize: 14, fontFamily: 'Roboto', fontColor: undefined },\n {\n precision: primaryDataset.valueFormat ? calculatePrecision(primaryDataset.valueFormat) : undefined,\n grouped: this.containerId\n }\n ))!\n\n this.verticalGroup.addSurfaceToGroup(chart.sciChartSurface)\n this.synchronizer.addAxis(chart.sciChartSurface.xAxes.get(0))\n\n groupedChart.dataKey = primaryDataset.dataKey!\n groupedChart.sciChartSurface = chart.sciChartSurface\n groupedChart.dataSeries = dataSeries\n\n this.groupCharts = this.groupSorter([...this.groupCharts, groupedChart])\n }\n\n removeChart(dataKey: string) {\n const index = this.groupCharts.findIndex((chart: any) => chart.dataKey == dataKey)\n const [groupedChart] = this.groupCharts.splice(index, 1)\n\n if (!groupedChart) {\n return\n }\n\n this.verticalGroup.removeSurface(groupedChart.sciChartSurface)\n this.synchronizer.removeAxis(groupedChart.sciChartSurface.xAxes.get(0))\n\n groupedChart.sciChartSurface.delete()\n groupedChart.sciChartSurface = undefined\n\n this.groupCharts = this.groupSorter(this.groupCharts)\n }\n\n groupSorter(group: any[]) {\n return group.sort(\n (a, b) =>\n this.visibleSeries.findIndex((s: any) => s.dataKey == a.dataKey) -\n this.visibleSeries.findIndex((s: any) => s.dataKey == b.dataKey)\n )\n }\n\n async appendData(appendum: { [attr: string]: any }[]) {}\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ox-scichart-multiple': OxSciChartMultiple\n }\n}\n"]}

package/dist/charts/ox-scichart.js CHANGED Viewed

@@ -43,9 +43,10 @@ let OxSciChart = OxSciChart_1 = class OxSciChart extends LitElement {
         }
     }
     updateDataSeries() {
-        var _a, _b, _c;
-        if (!((_a = this.dataSeries) === null || _a === void 0 ? void 0 : _a.length))
+        var _a;
+        if (!((_a = this.dataSeries) === null || _a === void 0 ? void 0 : _a.length)) {
             return;
+        }
         this.dataSeries.forEach(ds => ds.clear());
         const newData = this.dataSet;
         newData.forEach((data, index) => {
@@ -54,8 +55,11 @@ let OxSciChart = OxSciChart_1 = class OxSciChart extends LitElement {
                 this.dataSeries[index].appendRange(filteredData.map(d => d.xValue), filteredData.map(d => d.yValue));
             }
         });
-        (_b = this.chart) === null || _b === void 0 ? void 0 : _b.sciChartSurface.zoomExtents();
-        (_c = this.chart) === null || _c === void 0 ? void 0 : _c.sciChartSurface.invalidateElement();
+        setTimeout(() => {
+            var _a, _b;
+            (_a = this.chart) === null || _a === void 0 ? void 0 : _a.sciChartSurface.zoomExtents();
+            (_b = this.chart) === null || _b === void 0 ? void 0 : _b.sciChartSurface.invalidateElement();
+        }, 200);
     }
     get dataSet() {
         const { config, data } = this;

package/dist/charts/ox-scichart.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ox-scichart.js","sourceRoot":"","sources":["../../src/charts/ox-scichart.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AAClE,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAG3C,IAAM,UAAU,kBAAhB,MAAM,UAAW,SAAQ,UAAU;IAAnC;;QACuB,WAAM,GAAoC,IAAI,CAAA;QAC/C,SAAI,GAA8B,EAAE,CAAA;QAExD,UAAK,GAAQ,IAAI,CAAA;QAChB,eAAU,GAAU,EAAE,CAAA;QAC9B;;;;;;WAMG;QACK,gBAAW,GAAW,cAAc,GAAG,EAAE,YAAU,CAAC,GAAG,CAAA;~~IA8GjE~~,CAAC;~~IArFC~~,KAAK,CAAC,kBAAkB;;QACtB,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,MAAA,IAAI,CAAC,KAAK,CAAC,eAAe,0CAAE,MAAM,EAAE,CAAA;YACpC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAA;QACnB,CAAC;QAED,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,GAAG,CAAC,MAAM,aAAa,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,SAAS,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,EAAE,CAAA;QAE9F,IAAI,CAAC,KAAK,GAAG,KAAK,CAAA;QAClB,IAAI,CAAC,UAAU,GAAG,UAAW,CAAA;IAC/B,CAAC;IAED,KAAK,CAAC,OAAO,CAAC,iBAAyD;QACrE,IAAI,cAAc,GAAG,KAAK,CAAA;QAE1B,IAAI,iBAAiB,CAAC,GAAG,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YACnD,MAAM,IAAI,CAAC,kBAAkB,EAAE,CAAA;YAC/B,cAAc,GAAG,IAAI,CAAA;QACvB,CAAC;QAED,IAAI,iBAAiB,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC;YAClC,cAAc,GAAG,IAAI,CAAA;QACvB,CAAC;QAED,IAAI,cAAc,EAAE,CAAC;YACnB,MAAM,IAAI,CAAC,gBAAgB,EAAE,CAAA;QAC/B,CAAC;IACH,CAAC;IAED,gBAAgB;;QACd,IAAI,CAAC,CAAA,MAAA,IAAI,CAAC,UAAU,0CAAE,MAAM,CAAA;~~YAAE~~,OAAM;~~QAEpC~~,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,CAAA;QACzC,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAA;QAE5B,OAAO,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YAC9B,MAAM,YAAY,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,MAAM,KAAK,QAAQ,CAAC,CAAA;YAEnE,IAAI,YAAY,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;gBAC5B,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,WAAW,CAChC,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,EAC/B,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAChC,CAAA;YACH,CAAC;QACH,CAAC,CAAC,CAAA;QAEF,MAAA,IAAI,CAAC,KAAK,0CAAE,eAAe,CAAC,WAAW,EAAE,CAAA;~~QACzC~~,MAAA,IAAI,CAAC,KAAK,0CAAE,eAAe,CAAC,iBAAiB,EAAE,CAAA;~~IACjD~~,CAAC;IAED,IAAI,OAAO;QACT,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,CAAA;QAC7B,MAAM,EAAE,QAAQ,GAAG,EAAE,EAAE,YAAY,EAAE,KAAK,EAAE,GAAG,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,IAAI,KAAI,EAAE,CAAA;QAEjE,IAAI,CAAC,CAAC,IAAI,YAAY,KAAK,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YACvC,OAAO,EAAE,CAAA;QACX,CAAC;QAED,OAAO,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;YAC5B,OAAO,IAAI;iBACR,GAAG,CAAC,IAAI,CAAC,EAAE;gBACV,IAAI,CAAC,IAAI,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE,CAAC;oBACtC,OAAM;gBACR,CAAC;gBAED,MAAM,MAAM,GAAG,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAA;gBACpC,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC,EAAE,CAAC;oBAC5B,OAAO,CAAC,KAAK,CAAC,eAAe,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAA;oBAC3C,OAAM;gBACR,CAAC;gBAED,OAAO;oBACL,MAAM,EAAE,MAAM,CAAC,OAAO,EAAE,GAAG,IAAI;oBAC/B,MAAM,EAAE,IAAI,CAAC,OAAO,CAAC,OAAQ,CAAC;iBAC/B,CAAA;YACH,CAAC,CAAC;iBACD,MAAM,CAAC,OAAO,CAAyC,CAAA;QAC5D,CAAC,CAAC,CAAA;IACJ,CAAC;IAED,KAAK,CAAC,UAAU,CAAC,QAAmC,IAAG,CAAC;IAExD,MAAM;QACJ,OAAO,IAAI,CAAA,YAAY,IAAI,CAAC,WAAW,kCAAkC,CAAA;IAC3E,CAAC;;~~AAzGM~~,cAAG,GAAW,CAAC,AAAZ,CAAY;AAEf,iBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;GAiBlB,AAjBY,CAiBZ;AAnC2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAA+C;AAC/C;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;wCAAqC;AAapC;IAA1B,KAAK,CAAC,kBAAkB,CAAC;6CAA2B;AAf1C,UAAU;IADtB,aAAa,CAAC,aAAa,CAAC;GAChB,UAAU,~~CA2HtB~~","sourcesContent":["import { LitElement, html, css } from 'lit'\nimport { property, query, customElement } from 'lit/decorators.js'\nimport { buildSciChart } from './scichart-builder'\n\n@customElement('ox-scichart')\nexport class OxSciChart extends LitElement {\n @property({ type: Object }) config: OperatoChart.ChartConfig \| null = null\n @property({ type: Array }) data: { [attr: string]: any }[] = []\n\n public chart: any = null\n private dataSeries: any[] = []\n /\n [주의]\n ox-scichart container의 id를 글로벌 유니크하게 해야한다. \n SciChart가 특별히 container의 id를 기반으로 하위 컴포넌트를 구성하고 있기 때문이다.\n shadowDom 안에 있는 container 이더라도, 글로벌 유니크한 id를 제공해야 한다.\n 그렇지 않으면, 단 하나의 차트만 제대로 렌더링된다.\n /\n private containerId: string = 'ox-sci-chart' + ++OxSciChart.idx\n\n @query('.chart-container') container!: HTMLDivElement\n\n static idx: number = 0\n\n static styles = css`\n :host {\n display: block;\n width: 100%;\n height: 100%;\n }\n\n .chart-container {\n display: flex;\n width: 100%;\n height: 100%;\n }\n\n .chart-content {\n flex: 1;\n position: relative;\n }\n `\n\n async initializeSciChart() {\n if (this.chart) {\n this.chart.sciChartSurface?.delete()\n this.chart = null\n }\n\n const { chart, dataSeries } = (await buildSciChart(this.config, this.container, {}, {})) \|\| {}\n\n this.chart = chart\n this.dataSeries = dataSeries!\n }\n\n async updated(changedProperties: Map<string \| number \| symbol, unknown>) {\n var needDataUpdate = false\n\n if (changedProperties.has('config') && this.config) {\n await this.initializeSciChart()\n needDataUpdate = true\n }\n\n if (changedProperties.has('data')) {\n needDataUpdate = true\n }\n\n if (needDataUpdate) {\n await this.updateDataSeries()\n }\n }\n\n updateDataSeries() {\n if (!this.dataSeries?.length) return\n\n this.dataSeries.forEach(ds => ds.clear())\n const newData = this.dataSet\n\n newData.forEach((data, index) => {\n const filteredData = data.filter(d => typeof d.yValue === 'number')\n\n if (filteredData.length > 0) {\n this.dataSeries[index].appendRange(\n filteredData.map(d => d.xValue),\n filteredData.map(d => d.yValue)\n )\n }\n })\n\n this.chart?.sciChartSurface.zoomExtents()\n this.chart?.sciChartSurface.invalidateElement()\n }\n\n get dataSet(): { xValue: number; yValue: number }[][] {\n const { config, data } = this\n const { datasets = [], labelDataKey: attrX } = config?.data \|\| {}\n\n if (!(data instanceof Array) \|\| !attrX) {\n return []\n }\n\n return datasets.map(dataset => {\n return data\n .map(item => {\n if (!item \|\| typeof item !== 'object') {\n return\n }\n\n const xValue = new Date(item[attrX])\n if (isNaN(xValue.getTime())) {\n console.error('Invalid date:', item[attrX])\n return\n }\n\n return {\n xValue: xValue.getTime() / 1000,\n yValue: item[dataset.dataKey!]\n }\n })\n .filter(Boolean) as { xValue: number; yValue: number }[]\n })\n }\n\n async appendData(appendum: { [attr: string]: any }[]) {}\n\n render() {\n return html` <div id=${this.containerId} class=\"chart-container\"></div> `\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ox-scichart': OxSciChart\n }\n}\n"]}
1	+ {"version":3,"file":"ox-scichart.js","sourceRoot":"","sources":["../../src/charts/ox-scichart.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, css } from 'lit'\nimport { property, query, customElement } from 'lit/decorators.js'\nimport { buildSciChart } from './scichart-builder'\n\n@customElement('ox-scichart')\nexport class OxSciChart extends LitElement {\n @property({ type: Object }) config: OperatoChart.ChartConfig \| null = null\n @property({ type: Array }) data: { [attr: string]: any }[] = []\n\n public chart: any = null\n private dataSeries: any[] = []\n /\n [주의]\n ox-scichart container의 id를 글로벌 유니크하게 해야한다. \n SciChart가 특별히 container의 id를 기반으로 하위 컴포넌트를 구성하고 있기 때문이다.\n shadowDom 안에 있는 container 이더라도, 글로벌 유니크한 id를 제공해야 한다.\n 그렇지 않으면, 단 하나의 차트만 제대로 렌더링된다.\n /\n private containerId: string = 'ox-sci-chart' + ++OxSciChart.idx\n\n @query('.chart-container') container!: HTMLDivElement\n\n static idx: number = 0\n\n static styles = css`\n :host {\n display: block;\n width: 100%;\n height: 100%;\n }\n\n .chart-container {\n display: flex;\n width: 100%;\n height: 100%;\n }\n\n .chart-content {\n flex: 1;\n position: relative;\n }\n `\n\n async initializeSciChart() {\n if (this.chart) {\n this.chart.sciChartSurface?.delete()\n this.chart = null\n }\n\n const { chart, dataSeries } = (await buildSciChart(this.config, this.container, {}, {})) \|\| {}\n\n this.chart = chart\n this.dataSeries = dataSeries!\n }\n\n async updated(changedProperties: Map<string \| number \| symbol, unknown>) {\n var needDataUpdate = false\n\n if (changedProperties.has('config') && this.config) {\n await this.initializeSciChart()\n needDataUpdate = true\n }\n\n if (changedProperties.has('data')) {\n needDataUpdate = true\n }\n\n if (needDataUpdate) {\n await this.updateDataSeries()\n }\n }\n\n updateDataSeries() {\n if (!this.dataSeries?.length) {\n return\n }\n\n this.dataSeries.forEach(ds => ds.clear())\n const newData = this.dataSet\n\n newData.forEach((data, index) => {\n const filteredData = data.filter(d => typeof d.yValue === 'number')\n\n if (filteredData.length > 0) {\n this.dataSeries[index].appendRange(\n filteredData.map(d => d.xValue),\n filteredData.map(d => d.yValue)\n )\n }\n })\n\n setTimeout(() => {\n this.chart?.sciChartSurface.zoomExtents()\n this.chart?.sciChartSurface.invalidateElement()\n }, 200)\n }\n\n get dataSet(): { xValue: number; yValue: number }[][] {\n const { config, data } = this\n const { datasets = [], labelDataKey: attrX } = config?.data \|\| {}\n\n if (!(data instanceof Array) \|\| !attrX) {\n return []\n }\n\n return datasets.map(dataset => {\n return data\n .map(item => {\n if (!item \|\| typeof item !== 'object') {\n return\n }\n\n const xValue = new Date(item[attrX])\n if (isNaN(xValue.getTime())) {\n console.error('Invalid date:', item[attrX])\n return\n }\n\n return {\n xValue: xValue.getTime() / 1000,\n yValue: item[dataset.dataKey!]\n }\n })\n .filter(Boolean) as { xValue: number; yValue: number }[]\n })\n }\n\n async appendData(appendum: { [attr: string]: any }[]) {}\n\n render() {\n return html` <div id=${this.containerId} class=\"chart-container\"></div> `\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ox-scichart': OxSciChart\n }\n}\n"]}

package/dist/charts/scichart-builder.js CHANGED Viewed

@@ -58,10 +58,10 @@ function createPointMarker(wasmContext, dataset, color = DEFAULT_COLOR) {
 }
 function createAxis(wasmContext, axis, index, isXAxis, fontColor, fontFamily, fontSize, precision, options) {
     const { axisTitle, ticks } = axis;
-    const { autoMax, autoMin, min, max, stepSize, beginAtZero, color = fontColor, textStrokeColor = fontColor, display } = ticks || {};
+    const { autoMax, autoMin, min, max, stepSize, beginAtZero, color = fontColor, textStrokeColor = fontColor, display = false } = ticks || {};
     const axisOptions = {
         axisTitle,
-        autoRange: autoMin || autoMax ? EAutoRange.Always : undefined,
+        autoRange: autoMin || autoMax ? EAutoRange.Always : EAutoRange.Once,
         axisAlignment: isXAxis ? EAxisAlignment.Bottom : index === 0 ? EAxisAlignment.Left : EAxisAlignment.Right,
         visibleRange: min !== undefined && max !== undefined ? new NumberRange(min, max) : undefined,
         majorDelta: stepSize,
@@ -76,7 +76,8 @@ function createAxis(wasmContext, axis, index, isXAxis, fontColor, fontFamily, fo
             fontSize,
             color: textStrokeColor
         },
-        ...options
+        ...options,
+        drawLabels: display
     };
     const labelProvider = isXAxis
         ? new SmartDateLabelProvider({
@@ -167,7 +168,7 @@ export async function buildSciChart(config, container, { fontSize = 14, fontFami
     var { theme, tooltip = true, animation = true, legend = {
         display: true,
         position: 'top'
-    }, scales: fromScales, xGridLine = true, yGridLine = true, y2ndGridLine = false, stacked = false, multiAxis = false, annotations = [] } = options || {};
+    }, scales: fromScales, xGridLine = false, yGridLine = false, y2ndGridLine = false, stacked = false, multiAxis = false, annotations = [] } = options || {};
     var baseColor = getBaseColorFromTheme(theme);
     if (theme === 'auto') {
         theme = getThemeFromBrowser();
@@ -178,16 +179,24 @@ export async function buildSciChart(config, container, { fontSize = 14, fontFami
         theme: theme == 'dark' ? new SciChartJSDarkv2Theme() : new SciChartJSLightTheme()
     });
     const { sciChartSurface, wasmContext } = chart;
-    // X 축 설정
     xAxes.forEach((axis, index) => {
-        const xAxis = createAxis(wasmContext, axis, index, true, fontColor, fontFamily, fontSize);
+        const xAxis = createAxis(wasmContext, axis, index, true, fontColor, fontFamily, fontSize, undefined, {
+            drawMajorTickLines: true,
+            drawMinorTickLines: true,
+            drawMajorGridLines: xGridLine,
+            drawMinorGridLines: xGridLine
+        });
         sciChartSurface.xAxes.add(xAxis);
     });
     (multiAxis ? yAxes : [yAxes[0]]).forEach((axis, index) => {
-        const yAxis = createAxis(wasmContext, axis, index, false, fontColor, fontFamily, fontSize, precision);
+        const yAxis = createAxis(wasmContext, axis, index, false, fontColor, fontFamily, fontSize, precision, {
+            drawMajorTickLines: true,
+            drawMinorTickLines: true,
+            drawMajorGridLines: index == 0 ? yGridLine : y2ndGridLine,
+            drawMinorGridLines: index == 0 ? yGridLine : y2ndGridLine
+        });
         sciChartSurface.yAxes.add(yAxis);
     });
-    // 시리즈 설정
     const dataSeriesArray = datasets.map((dataset, index) => {
         const yAxisId = dataset.yAxisID == 'right' && multiAxis ? 'yAxis1' : undefined;
         const { series, dataSeries } = createSeries(wasmContext, dataset, index, !!stacked, !!animation, yAxisId);
@@ -195,14 +204,19 @@ export async function buildSciChart(config, container, { fontSize = 14, fontFami
         if (tooltip) {
             const rolloverModifier = new RolloverModifier({
                 showTooltip: true,
-                showAxisLabel: true /* 한글의 크기를 잘 계산하지 못하므로 false */,
-                modifierGroup: grouped
+                showAxisLabel: true /* show x-axis label for cursor */,
+                modifierGroup: grouped,
+                tooltipDataTemplate: (seriesInfo) => {
+                    const valuesWithLabels = [];
+                    const xySeriesInfo = seriesInfo;
+                    valuesWithLabels.push(xySeriesInfo.formattedYValue);
+                    return valuesWithLabels;
+                }
             });
             sciChartSurface.chartModifiers.add(rolloverModifier);
         }
         return dataSeries;
     });
-    // Stacked collections 추가
     if (stacked) {
         const stackedColumnCollection = new StackedColumnCollection(wasmContext);
         const stackedMountainCollection = new StackedMountainCollection(wasmContext);
@@ -300,10 +314,9 @@ export async function buildSciChart(config, container, { fontSize = 14, fontFami
             }
         });
     }
-    // 줌인/줌아웃 모디파이어 추가
     sciChartSurface.chartModifiers.add(new RubberBandXyZoomModifier({ executeOn: EExecuteOn.MouseRightButton, modifierGroup: grouped }),
     // new ZoomPanModifier({ xyDirection: EXyDirection.XDirection }),
-    new ZoomPanModifier(), new MouseWheelZoomModifier({ xyDirection: EXyDirection.XDirection }), new ZoomExtentsModifier(), new XAxisDragModifier(), new YAxisDragModifier());
+    new ZoomPanModifier({ xyDirection: EXyDirection.XDirection }), new MouseWheelZoomModifier({ xyDirection: EXyDirection.XDirection }), new ZoomExtentsModifier(), new XAxisDragModifier(), new YAxisDragModifier());
     if (legend === null || legend === void 0 ? void 0 : legend.display) {
         const legendModifier = new LegendModifier({
             showCheckboxes: true,
@@ -333,28 +346,45 @@ export async function buildSciChartOverview(config, container, { fontSize = 14,
     }
     fontColor = fontColor || baseColor.clone().toString();
     const { xAxes = [], yAxes = [] } = fromScales || {};
-    // Instead we create a normal chart and then manually add the OverviewRangeSelectionModifier and bind it to the axisSynchroniser
     const chart = await SciChartSurface.create(container, {
         theme: theme == 'dark' ? new SciChartJSDarkv2Theme() : new SciChartJSLightTheme()
     });
     const { sciChartSurface, wasmContext } = chart;
-    // X 축 설정
     xAxes.forEach((axis, index) => {
-        const xAxis = createAxis(wasmContext, axis, index, true, fontColor, fontFamily, fontSize);
+        const xAxis = createAxis(wasmContext, axis, index, true, fontColor, fontFamily, fontSize, undefined, {
+            drawMajorTickLines: false,
+            drawMinorTickLines: false,
+            drawMajorGridLines: false,
+            drawMinorGridLines: false
+        });
         sciChartSurface.xAxes.add(xAxis);
     });
-    (multiAxis ? yAxes : [yAxes[0]]).forEach((axis, index) => {
-        const yAxis = createAxis(wasmContext, axis, index, false, fontColor, fontFamily, fontSize, undefined, {
+    const dataSeriesArray = datasets.map((dataset, index) => {
+        const yAxisId = `yAxis${index}`;
+        const dataSeries = new XyDataSeries(wasmContext, {
+            dataSeriesName: dataset.label,
+            containsNaN: false
+        });
+        const yAxis = new NumericAxis(wasmContext, {
+            id: yAxisId,
+            autoRange: EAutoRange.Always,
             drawLabels: false,
-            drawMajorTicks: false,
-            drawMinorTicks: false,
+            drawMajorTickLines: false,
+            drawMinorTickLines: false,
             drawMajorGridLines: false,
             drawMinorGridLines: false
         });
         sciChartSurface.yAxes.add(yAxis);
+        const series = new FastLineRenderableSeries(wasmContext, {
+            dataSeries,
+            strokeThickness: 1,
+            stroke: convertColor(dataset.color, DEFAULT_COLOR),
+            yAxisId: yAxisId
+        });
+        sciChartSurface.renderableSeries.add(series);
+        return dataSeries;
     });
     const rangeSelectionModifier = new OverviewRangeSelectionModifier();
-    // When the range selection is moved, updated the linked charts
     rangeSelectionModifier.onSelectedAreaChanged = (selectedRange) => {
         if (!selectedRange.equals(axisSynchroniser.visibleRange)) {
             axisSynchroniser.publishChange({ visibleRange: selectedRange });
@@ -362,7 +392,6 @@ export async function buildSciChartOverview(config, container, { fontSize = 14,
     };
     rangeSelectionModifier.selectedArea = axisSynchroniser.visibleRange;
     sciChartSurface.chartModifiers.add(rangeSelectionModifier);
-    // When charts are moved, update the range selection
     axisSynchroniser.visibleRangeChanged.subscribe(({ visibleRange }) => {
         const updatedSelectedRange = visibleRange.clip(sciChartSurface.xAxes.get(0).visibleRange);
         const shouldUpdateSelectedRange = !updatedSelectedRange.equals(rangeSelectionModifier.selectedArea);
@@ -370,12 +399,6 @@ export async function buildSciChartOverview(config, container, { fontSize = 14,
             rangeSelectionModifier.selectedArea = updatedSelectedRange;
         }
     });
-    const dataSeriesArray = datasets.map((dataset, index) => {
-        const yAxisId = dataset.yAxisID == 'right' && multiAxis ? 'yAxis1' : undefined;
-        const { series, dataSeries } = createSeries(wasmContext, dataset, index, !!stacked, !!animation, yAxisId);
-        sciChartSurface.renderableSeries.add(series);
-        return dataSeries;
-    });
     return { chart, dataSeries: dataSeriesArray };
 }
 //# sourceMappingURL=scichart-builder.js.map