@operato/scene-scichart 9.0.0-beta.7 → 9.0.0

package/dist/charts/scichart-builder.js

@@ -211,7 +211,7 @@ export async function buildSciChart(config, container, { fontSize = 14, fontFami
     var { theme, tooltip = true, animation = true, legend = {
         display: true,
         position: 'top'
-    }, scales: fromScales, xGridLine = false, yGridLine = false, y2ndGridLine = false, stacked = false, multiAxis = false, annotations = [] } = options || {};
+    }, scales: fromScales, xGridLine = false, yGridLine = false, y2ndGridLine = false, stacked = false, multiAxis = false } = options || {};
     var baseColor = getBaseColorFromTheme(theme);
     if (theme === 'auto') {
         theme = getThemeFromBrowser();
@@ -250,9 +250,31 @@ export async function buildSciChart(config, container, { fontSize = 14, fontFami
                 showAxisLabel: true /* show x-axis label for cursor */,
                 modifierGroup: grouped,
                 tooltipDataTemplate: (seriesInfo) => {
+                    var _a, _b;
                     const valuesWithLabels = [];
                     const xySeriesInfo = seriesInfo;
-                    valuesWithLabels.push(xySeriesInfo.formattedYValue);
+                    let formattedValue = xySeriesInfo.yValue;
+                    // 시리즈 이름으로 인덱스 찾기
+                    const datasetIdx = datasets.findIndex(ds => ds.label === xySeriesInfo.seriesName);
+                    const thisDataset = datasets[datasetIdx >= 0 ? datasetIdx : index];
+                    const valueFormat = (thisDataset === null || thisDataset === void 0 ? void 0 : thisDataset.valueFormat) || '0.##';
+                    if (typeof formattedValue === 'number') {
+                        // prefix, numberFormat, suffix 분리
+                        const match = valueFormat.match(/^(.*?)([#,0.]+)(.*?)$/);
+                        const prefix = match ? match[1] : '';
+                        const numberFormat = match ? match[2] : valueFormat;
+                        const suffix = match ? match[3] : '';
+                        const decimalPart = (_a = numberFormat.split('.')[1]) === null || _a === void 0 ? void 0 : _a.replace(/[^#0]/g, '');
+                        let minFrac = decimalPart ? decimalPart.length : 0;
+                        let maxFrac = ((_b = numberFormat.split('.')[1]) === null || _b === void 0 ? void 0 : _b.length) || 2;
+                        const formattedNumber = new Intl.NumberFormat(undefined, {
+                            minimumFractionDigits: minFrac,
+                            maximumFractionDigits: maxFrac,
+                            useGrouping: numberFormat.includes(',')
+                        }).format(formattedValue);
+                        formattedValue = `${prefix}${formattedNumber}${suffix}`;
+                    }
+                    valuesWithLabels.push(formattedValue);
                     return valuesWithLabels;
                 }
             });
@@ -278,85 +300,6 @@ export async function buildSciChart(config, container, { fontSize = 14, fontFami
             sciChartSurface.renderableSeries.add(stackedMountainCollection);
         }
     }
-    if (annotations) {
-        annotations.forEach(annotation => {
-            let sciAnnotation;
-            let horizontalAnchorPoint = annotation.horizontalAnchorPoint == 'Right'
-                ? EHorizontalAnchorPoint.Right
-                : annotation.horizontalAnchorPoint == 'Left'
-                    ? EHorizontalAnchorPoint.Left
-                    : EHorizontalAnchorPoint.Center;
-            let verticalAnchorPoint = annotation.verticalAnchorPoint == 'Top'
-                ? EVerticalAnchorPoint.Top
-                : annotation.verticalAnchorPoint == 'Bottom'
-                    ? EVerticalAnchorPoint.Bottom
-                    : EVerticalAnchorPoint.Center;
-            switch (annotation.type) {
-                case 'text':
-                    sciAnnotation = new TextAnnotation({
-                        x1: annotation.x1,
-                        y1: annotation.y1,
-                        text: annotation.text,
-                        horizontalAnchorPoint,
-                        verticalAnchorPoint,
-                        fontSize: annotation.fontSize,
-                        fontFamily: annotation.fontFamily,
-                        textColor: convertColor(annotation.stroke, fontColor),
-                        xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue),
-                        yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue)
-                    });
-                    break;
-                case 'line':
-                    sciAnnotation = new LineAnnotation({
-                        x1: annotation.x1,
-                        y1: annotation.y1,
-                        x2: annotation.x2,
-                        y2: annotation.y2,
-                        stroke: convertColor(annotation.stroke, '#FF0000'),
-                        strokeThickness: annotation.strokeThickness,
-                        xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue),
-                        yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue)
-                    });
-                    break;
-                case 'box':
-                    sciAnnotation = new BoxAnnotation({
-                        x1: annotation.x1,
-                        y1: annotation.y1,
-                        x2: annotation.x2,
-                        y2: annotation.y2,
-                        fill: convertColor(annotation.fill, '#FF0000'),
-                        stroke: convertColor(annotation.stroke, '#FF0000'),
-                        strokeThickness: annotation.strokeThickness,
-                        xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue),
-                        yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue)
-                    });
-                    break;
-                case 'horizontalLine':
-                    sciAnnotation = new HorizontalLineAnnotation({
-                        y1: annotation.y1,
-                        stroke: convertColor(annotation.stroke, '#FF0000'),
-                        strokeThickness: annotation.strokeThickness,
-                        xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue),
-                        yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue)
-                    });
-                    break;
-                case 'verticalLine':
-                    sciAnnotation = new VerticalLineAnnotation({
-                        x1: annotation.x1,
-                        stroke: convertColor(annotation.stroke, '#FF0000'),
-                        strokeThickness: annotation.strokeThickness,
-                        xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue),
-                        yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue)
-                    });
-                    break;
-                default:
-                    break;
-            }
-            if (sciAnnotation) {
-                sciChartSurface.annotations.add(sciAnnotation);
-            }
-        });
-    }
     sciChartSurface.chartModifiers.add(new RubberBandXyZoomModifier({ executeOn: EExecuteOn.MouseRightButton, modifierGroup: grouped }), 
     // new ZoomPanModifier({ xyDirection: EXyDirection.XDirection }),
     new ZoomPanModifier({ xyDirection: EXyDirection.XDirection }), new MouseWheelZoomModifier({ xyDirection: EXyDirection.XDirection }), new ZoomExtentsModifier(), new XAxisDragModifier(), new YAxisDragModifier());
@@ -458,4 +401,407 @@ function getDefaultYAxis(wasmContext, sciChartSurface) {
     });
     sciChartSurface.yAxes.add(yAxis);
 }
+// Helper 함수 - verticalAnchorPoint에 따라 적절한 y1 값을 반환
+function getYPositionByAnchor(anchor) {
+    if (anchor === EVerticalAnchorPoint.Top) {
+        return 0.05; // 상단에서 5% 위치
+    }
+    else if (anchor === EVerticalAnchorPoint.Center) {
+        return 0.5; // 중앙
+    }
+    else if (anchor === EVerticalAnchorPoint.Bottom) {
+        return 0.95; // 차트 맨 아래
+    }
+    // 기본값 (Bottom이거나 값이 없는 경우)
+    return 0.95; // 바닥에서 5% 위치
+}
+// Helper 함수 - verticalAnchorPoint에 따라 적절한 좌표 모드 반환
+function getYCoordModeByAnchor(anchor) {
+    // verticalAnchorPoint 값과 상관없이 상대 좌표 사용
+    return ECoordinateMode.Relative;
+}
+export function updateAnnotations(sciChartSurface, annotations = [], fromData, rawData = [], fontFamily, fontColor) {
+    sciChartSurface.annotations.clear();
+    if (annotations) {
+        annotations.forEach(annotation => {
+            let sciAnnotation;
+            let horizontalAnchorPoint = annotation.horizontalAnchorPoint == 'Right'
+                ? EHorizontalAnchorPoint.Right
+                : annotation.horizontalAnchorPoint == 'Left'
+                    ? EHorizontalAnchorPoint.Left
+                    : EHorizontalAnchorPoint.Center;
+            let verticalAnchorPoint = annotation.verticalAnchorPoint == 'Top'
+                ? EVerticalAnchorPoint.Top
+                : annotation.verticalAnchorPoint == 'Bottom'
+                    ? EVerticalAnchorPoint.Bottom
+                    : EVerticalAnchorPoint.Center;
+            // dataKey가 있는 경우 데이터와 연동
+            if (annotation.dataKey && rawData && rawData.length > 0) {
+                const attrX = (fromData === null || fromData === void 0 ? void 0 : fromData.labelDataKey) || ''; // X축 데이터 키 가져오기
+                if (annotation.type === 'verticalLine') {
+                    // 수직 라인: falsy => truthy 변화 지점에만 표시
+                    let prevValue = undefined;
+                    for (let i = 0; i < rawData.length; i++) {
+                        // 원본 데이터에서 직접 값 가져오기
+                        const currentValue = rawData[i][annotation.dataKey];
+                        const isChanged = prevValue !== currentValue;
+                        const isTruthy = !!currentValue || annotation.text;
+                        if (isTruthy && isChanged) {
+                            // falsy에서 truthy로 변화한 지점
+                            // X 값은 인덱스나 타임스탬프 사용
+                            const xValue = attrX ? new Date(rawData[i][attrX]).getTime() / 1000 : i;
+                            // 수직선 추가
+                            const sciVerticalLine = new VerticalLineAnnotation({
+                                x1: xValue,
+                                stroke: convertColor(annotation.stroke, '#FF0000'),
+                                strokeThickness: annotation.strokeThickness,
+                                xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue),
+                                yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue)
+                            });
+                            sciChartSurface.annotations.add(sciVerticalLine);
+                            // 텍스트 레이블 추가
+                            // if (annotation.text !== undefined || currentValue !== undefined) {
+                            // 표시할 텍스트 결정
+                            const labelText = currentValue ? String(currentValue) : annotation.text;
+                            // 텍스트 주석 추가 (수직선 상단에)
+                            const sciTextAnnotation = new TextAnnotation({
+                                // 동일한 X 위치 사용
+                                x1: xValue,
+                                // verticalAnchorPoint에 따라 Y 위치 결정
+                                y1: getYPositionByAnchor(annotation.verticalAnchorPoint),
+                                text: labelText,
+                                // 가운데 정렬
+                                horizontalAnchorPoint: (annotation.horizontalAnchorPoint ||
+                                    EHorizontalAnchorPoint.Center),
+                                // 텍스트의 하단이 y1에 위치
+                                verticalAnchorPoint: (annotation.verticalAnchorPoint ||
+                                    EVerticalAnchorPoint.Bottom),
+                                fontFamily: annotation.fontFamily || fontFamily,
+                                fontSize: annotation.fontSize || 14,
+                                textColor: convertColor(annotation.stroke, '#FF0000'),
+                                background: 'rgba(255, 255, 255, 0.7)', // 텍스트 배경 추가
+                                padding: { left: 5, top: 5, right: 5, bottom: 5 }, // 패딩 추가
+                                xCoordinateMode: ECoordinateMode.DataValue,
+                                // verticalAnchorPoint에 따라 좌표 모드 결정
+                                yCoordinateMode: getYCoordModeByAnchor(annotation.verticalAnchorPoint)
+                            });
+                            sciChartSurface.annotations.add(sciTextAnnotation);
+                            // }
+                        }
+                        prevValue = currentValue;
+                    }
+                    // 기본 annotation 처리 건너뛰기
+                    return;
+                }
+                else if (annotation.type === 'text') {
+                    // 텍스트: 해당 값을 그대로 출력
+                    for (let i = 0; i < rawData.length; i++) {
+                        // 원본 데이터에서 직접 값 가져오기
+                        const value = rawData[i][annotation.dataKey];
+                        // null이나 undefined가 아닌 값만 표시
+                        if (value !== undefined && value !== null) {
+                            // X 값은 인덱스나 타임스탬프 사용
+                            const xValue = attrX ? new Date(rawData[i][attrX]).getTime() / 1000 : i;
+                            const sciTextAnnotation = new TextAnnotation({
+                                x1: xValue,
+                                y1: value,
+                                text: String(value),
+                                horizontalAnchorPoint,
+                                verticalAnchorPoint,
+                                fontSize: annotation.fontSize,
+                                fontFamily: annotation.fontFamily,
+                                textColor: convertColor(annotation.stroke, fontColor),
+                                xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue),
+                                yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue)
+                            });
+                            sciChartSurface.annotations.add(sciTextAnnotation);
+                        }
+                    }
+                    // 기본 annotation 처리 건너뛰기
+                    return;
+                }
+                else {
+                    // 다른 타입의 annotation은 원래 로직으로 처리
+                    // 원본 데이터에서 값 추출
+                    const dataValues = rawData.map(item => item[annotation.dataKey]).filter(v => v !== undefined);
+                    if (dataValues.length > 0) {
+                        // annotation 타입에 따라 데이터 값을 적용
+                        if (annotation.type === 'horizontalLine') {
+                            annotation.y1 = dataValues[0];
+                        }
+                        else if (annotation.type === 'line' || annotation.type === 'box') {
+                            // 데이터 값이 최소 한 개 이상인 경우에만 적용
+                            if (annotation.yCoordinateMode === 'DataValue') {
+                                annotation.y1 = dataValues[0];
+                            }
+                            if (annotation.xCoordinateMode === 'DataValue' && !annotation.x1) {
+                                annotation.x1 = 0;
+                            }
+                            // 두 번째 지점이 필요한 경우 (line, box)
+                            if (dataValues.length > 1) {
+                                if (annotation.yCoordinateMode === 'DataValue') {
+                                    annotation.y2 = dataValues[dataValues.length - 1];
+                                }
+                                if (annotation.xCoordinateMode === 'DataValue' && !annotation.x2) {
+                                    annotation.x2 = dataValues.length - 1;
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+            else {
+                // 기본 annotation 생성 (dataKey가 없거나 rawData가 없는 경우)
+                switch (annotation.type) {
+                    case 'text':
+                        sciAnnotation = new TextAnnotation({
+                            x1: annotation.x1,
+                            y1: annotation.y1,
+                            text: annotation.text,
+                            horizontalAnchorPoint,
+                            verticalAnchorPoint,
+                            fontSize: annotation.fontSize,
+                            fontFamily: annotation.fontFamily,
+                            textColor: convertColor(annotation.stroke, fontColor),
+                            xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue),
+                            yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue)
+                        });
+                        break;
+                    case 'line':
+                        sciAnnotation = new LineAnnotation({
+                            x1: annotation.x1,
+                            y1: annotation.y1,
+                            x2: annotation.x2,
+                            y2: annotation.y2,
+                            stroke: convertColor(annotation.stroke, '#FF0000'),
+                            strokeThickness: annotation.strokeThickness,
+                            xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue),
+                            yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue)
+                        });
+                        break;
+                    case 'box':
+                        sciAnnotation = new BoxAnnotation({
+                            x1: annotation.x1,
+                            y1: annotation.y1,
+                            x2: annotation.x2,
+                            y2: annotation.y2,
+                            fill: convertColor(annotation.fill, '#FF0000'),
+                            stroke: convertColor(annotation.stroke, '#FF0000'),
+                            strokeThickness: annotation.strokeThickness,
+                            xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue),
+                            yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue)
+                        });
+                        break;
+                    case 'horizontalLine':
+                        sciAnnotation = new HorizontalLineAnnotation({
+                            y1: annotation.y1,
+                            stroke: convertColor(annotation.stroke, '#FF0000'),
+                            strokeThickness: annotation.strokeThickness,
+                            xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue),
+                            yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue)
+                        });
+                        break;
+                    case 'verticalLine':
+                        sciAnnotation = new VerticalLineAnnotation({
+                            x1: annotation.x1,
+                            stroke: convertColor(annotation.stroke, '#FF0000'),
+                            strokeThickness: annotation.strokeThickness,
+                            xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue),
+                            yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue)
+                        });
+                        // 텍스트가 있는 경우에만 텍스트 주석 추가
+                        if (annotation.text) {
+                            // 수직선을 먼저 추가
+                            if (sciAnnotation) {
+                                sciChartSurface.annotations.add(sciAnnotation);
+                            }
+                            // 텍스트 주석 생성
+                            const textAnnotation = new TextAnnotation({
+                                x1: annotation.x1,
+                                y1: getYPositionByAnchor(annotation.verticalAnchorPoint),
+                                text: annotation.text,
+                                horizontalAnchorPoint: (annotation.horizontalAnchorPoint ||
+                                    EHorizontalAnchorPoint.Center),
+                                verticalAnchorPoint: (annotation.verticalAnchorPoint ||
+                                    EVerticalAnchorPoint.Bottom),
+                                fontFamily: annotation.fontFamily || fontFamily,
+                                fontSize: annotation.fontSize || 14,
+                                textColor: convertColor(annotation.stroke, '#FF0000'),
+                                background: 'rgba(255, 255, 255, 0.7)', // 텍스트 배경 추가
+                                padding: { left: 5, top: 5, right: 5, bottom: 5 }, // 패딩 추가
+                                xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue),
+                                yCoordinateMode: getYCoordModeByAnchor(annotation.verticalAnchorPoint)
+                            });
+                            // 텍스트 주석 추가
+                            sciChartSurface.annotations.add(textAnnotation);
+                            sciAnnotation = null; // 이미 추가했으므로 아래에서 다시 추가하지 않도록 null로 설정
+                        }
+                        break;
+                    default:
+                        console.error('Unknown annotation type:', annotation.type);
+                        break;
+                }
+            }
+            // switch (annotation.type) {
+            //   case 'text':
+            //     sciAnnotation = new TextAnnotation({
+            //       x1: annotation.x1,
+            //       y1: annotation.y1,
+            //       text: annotation.text,
+            //       horizontalAnchorPoint,
+            //       verticalAnchorPoint,
+            //       fontSize: annotation.fontSize,
+            //       fontFamily: annotation.fontFamily,
+            //       textColor: convertColor(annotation.stroke, fontColor),
+            //       xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue) as ECoordinateMode,
+            //       yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue) as ECoordinateMode
+            //     })
+            //     break
+            //   case 'line':
+            //     sciAnnotation = new LineAnnotation({
+            //       x1: annotation.x1,
+            //       y1: annotation.y1,
+            //       x2: annotation.x2,
+            //       y2: annotation.y2,
+            //       stroke: convertColor(annotation.stroke, '#FF0000'),
+            //       strokeThickness: annotation.strokeThickness,
+            //       xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue) as ECoordinateMode,
+            //       yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue) as ECoordinateMode
+            //     })
+            //     break
+            //   case 'box':
+            //     sciAnnotation = new BoxAnnotation({
+            //       x1: annotation.x1,
+            //       y1: annotation.y1,
+            //       x2: annotation.x2,
+            //       y2: annotation.y2,
+            //       fill: convertColor(annotation.fill, '#FF0000'),
+            //       stroke: convertColor(annotation.stroke, '#FF0000'),
+            //       strokeThickness: annotation.strokeThickness,
+            //       xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue) as ECoordinateMode,
+            //       yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue) as ECoordinateMode
+            //     })
+            //     break
+            //   case 'horizontalLine':
+            //     sciAnnotation = new HorizontalLineAnnotation({
+            //       y1: annotation.y1,
+            //       stroke: convertColor(annotation.stroke, '#FF0000'),
+            //       strokeThickness: annotation.strokeThickness,
+            //       xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue) as ECoordinateMode,
+            //       yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue) as ECoordinateMode
+            //     })
+            //     break
+            //   case 'verticalLine':
+            //     sciAnnotation = new VerticalLineAnnotation({
+            //       x1: annotation.x1,
+            //       stroke: convertColor(annotation.stroke, '#FF0000'),
+            //       strokeThickness: annotation.strokeThickness,
+            //       xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue) as ECoordinateMode,
+            //       yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue) as ECoordinateMode
+            //     })
+            //     break
+            //   default:
+            //     break
+            // }
+            if (sciAnnotation) {
+                sciChartSurface.annotations.add(sciAnnotation);
+            }
+        });
+    }
+}
+/**
+ * 데이터 append 시, 값이 변경된 경우(이전 값과 다를 때)만 annotation을 추가하고,
+ * annotation의 텍스트는 변경된 값이 되도록 한다.
+ */
+export function addAnnotationsOnDataChange(sciChartSurface, annotations = [], fromData, prevData = [], appendum = [], fontFamily, fontColor) {
+    if (!annotations || !appendum || !appendum.length)
+        return;
+    const attrX = (fromData === null || fromData === void 0 ? void 0 : fromData.labelDataKey) || '';
+    annotations
+        .filter(annotation => annotation.dataKey && (annotation.type == 'text' || annotation.type == 'verticalLine'))
+        .forEach(annotation => {
+        if (!annotation.dataKey)
+            return;
+        let prevValue = prevData.length > 0 ? prevData[prevData.length - 1][annotation.dataKey] : undefined;
+        appendum.forEach((item, idx) => {
+            const currentValue = item[annotation.dataKey];
+            const isChanged = prevValue !== currentValue;
+            const isTruthy = !!currentValue || annotation.text;
+            if (isChanged && isTruthy) {
+                const xValue = attrX ? new Date(item[attrX]).getTime() / 1000 : prevData.length + idx;
+                // 수직선 annotation 추가
+                if (annotation.type === 'verticalLine') {
+                    const sciVerticalLine = new VerticalLineAnnotation({
+                        x1: xValue,
+                        stroke: convertColor(annotation.stroke, '#FF0000'),
+                        strokeThickness: annotation.strokeThickness,
+                        xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue),
+                        yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue)
+                    });
+                    sciChartSurface.annotations.add(sciVerticalLine);
+                    // 텍스트 annotation 추가 (변경된 값이 텍스트)
+                    const labelText = currentValue ? String(currentValue) : annotation.text;
+                    const sciTextAnnotation = new TextAnnotation({
+                        x1: xValue,
+                        y1: getYPositionByAnchor(annotation.verticalAnchorPoint),
+                        text: labelText,
+                        horizontalAnchorPoint: (annotation.horizontalAnchorPoint ||
+                            EHorizontalAnchorPoint.Center),
+                        verticalAnchorPoint: (annotation.verticalAnchorPoint ||
+                            EVerticalAnchorPoint.Bottom),
+                        fontFamily: annotation.fontFamily || fontFamily,
+                        fontSize: annotation.fontSize || 14,
+                        textColor: convertColor(annotation.stroke, '#FF0000'),
+                        background: 'rgba(255, 255, 255, 0.7)',
+                        padding: { left: 5, top: 5, right: 5, bottom: 5 },
+                        xCoordinateMode: ECoordinateMode.DataValue,
+                        yCoordinateMode: getYCoordModeByAnchor(annotation.verticalAnchorPoint)
+                    });
+                    sciChartSurface.annotations.add(sciTextAnnotation);
+                }
+                // 텍스트 annotation 타입도 지원
+                if (annotation.type === 'text') {
+                    const sciTextAnnotation = new TextAnnotation({
+                        x1: xValue,
+                        y1: currentValue,
+                        text: String(currentValue),
+                        horizontalAnchorPoint: (annotation.horizontalAnchorPoint ||
+                            EHorizontalAnchorPoint.Center),
+                        verticalAnchorPoint: (annotation.verticalAnchorPoint ||
+                            EVerticalAnchorPoint.Bottom),
+                        fontFamily: annotation.fontFamily || fontFamily,
+                        fontSize: annotation.fontSize || 14,
+                        textColor: convertColor(annotation.stroke, fontColor),
+                        xCoordinateMode: (annotation.xCoordinateMode || ECoordinateMode.DataValue),
+                        yCoordinateMode: (annotation.yCoordinateMode || ECoordinateMode.DataValue)
+                    });
+                    sciChartSurface.annotations.add(sciTextAnnotation);
+                }
+            }
+            prevValue = currentValue;
+        });
+    });
+}
+export function removeAnnotationsByData(sciChartSurface, removedData = [], fromData, annotations = []) {
+    if (!removedData || !removedData.length || !annotations.length)
+        return;
+    const attrX = (fromData === null || fromData === void 0 ? void 0 : fromData.labelDataKey) || '';
+    const removedXValues = removedData
+        .map(item => {
+        const xValue = attrX ? new Date(item[attrX]).getTime() / 1000 : undefined;
+        return isNaN(Number(xValue)) ? undefined : xValue;
+    })
+        .filter(x => x !== undefined);
+    if (!removedXValues.length)
+        return;
+    // annotation config 조건에 맞는 것만 삭제
+    annotations
+        .filter(annotation => annotation.dataKey && (annotation.type === 'text' || annotation.type === 'verticalLine'))
+        .forEach(() => {
+        sciChartSurface.annotations
+            .asArray()
+            .filter((a) => removedXValues.includes(a.x1))
+            .forEach((a) => sciChartSurface.annotations.remove(a));
+    });
+}
 //# sourceMappingURL=scichart-builder.js.map