@visactor/vrender-components 0.18.11-alpha.6 → 0.18.11-alpha.7

package/es/marker/config.d.ts

@@ -1,6 +1,7 @@
 import type { TextAlignType, TextBaselineType } from '@visactor/vrender-core';
-import { IMarkAreaLabelPosition, IMarkLineLabelPosition } from './type';
+import { IMarkAreaLabelPosition, IMarkLineLabelPosition, IMarkCommonArcLabelPosition } from './type';
 export declare const DEFAULT_MARK_LINE_THEME: {
+    interactive: boolean;
     startSymbol: {
         visible: boolean;
         symbolType: string;
@@ -27,6 +28,8 @@ export declare const DEFAULT_MARK_LINE_THEME: {
             fontSize: number;
             fontWeight: string;
             fontStyle: string;
+            textAlign: string;
+            textBaseline: string;
         };
         padding: number[];
         panel: {
@@ -42,13 +45,53 @@ export declare const DEFAULT_MARK_LINE_THEME: {
         lineDash: number[];
     };
 };
-export declare const DEFAULT_MARK_LINE_TEXT_STYLE_MAP: {
-    [K: string]: {
-        textAlign: TextAlignType;
-        textBaseline: TextBaselineType;
+export declare const DEFAULT_MARK_ARC_LINE_THEME: {
+    interactive: boolean;
+    startSymbol: {
+        visible: boolean;
+        symbolType: string;
+        size: number;
+        fill: string;
+        lineWidth: number;
+    };
+    endSymbol: {
+        visible: boolean;
+        symbolType: string;
+        size: number;
+        fill: string;
+        lineWidth: number;
+    };
+    label: {
+        position: IMarkCommonArcLabelPosition;
+        refX: number;
+        refY: number;
+        refAngle: number;
+        textStyle: {
+            fill: string;
+            stroke: string;
+            lineWidth: number;
+            fontSize: number;
+            fontWeight: string;
+            fontStyle: string;
+            textAlign: string;
+            textBaseline: string;
+        };
+        padding: number[];
+        panel: {
+            visible: boolean;
+            cornerRadius: number;
+            fill: string;
+            fillOpacity: number;
+        };
+    };
+    lineStyle: {
+        stroke: string;
+        lineWidth: number;
+        lineDash: number[];
     };
 };
 export declare const DEFAULT_MARK_AREA_THEME: {
+    interactive: boolean;
     label: {
         position: IMarkAreaLabelPosition;
         textStyle: {
@@ -58,6 +101,35 @@ export declare const DEFAULT_MARK_AREA_THEME: {
             fontSize: number;
             fontWeight: string;
             fontStyle: string;
+            textAlign: string;
+            textBaseline: string;
+        };
+        padding: number[];
+        panel: {
+            visible: boolean;
+            cornerRadius: number;
+            fill: string;
+            fillOpacity: number;
+        };
+    };
+    areaStyle: {
+        fill: string;
+        visible: boolean;
+    };
+};
+export declare const DEFAULT_MARK_ARC_AREA_THEME: {
+    interactive: boolean;
+    label: {
+        position: IMarkCommonArcLabelPosition;
+        textStyle: {
+            fill: string;
+            stroke: string;
+            lineWidth: number;
+            fontSize: number;
+            fontWeight: string;
+            fontStyle: string;
+            textAlign: string;
+            textBaseline: string;
         };
         padding: number[];
         panel: {
@@ -72,13 +144,14 @@ export declare const DEFAULT_MARK_AREA_THEME: {
         visible: boolean;
     };
 };
-export declare const DEFAULT_MARK_AREA_TEXT_STYLE_MAP: {
+export declare const DEFAULT_CARTESIAN_MARK_AREA_TEXT_STYLE_MAP: {
     [K: string]: {
         textAlign: TextAlignType;
         textBaseline: TextBaselineType;
     };
 };
 export declare const DEFAULT_MARK_POINT_THEME: {
+    interactive: boolean;
     itemLine: {
         visible: boolean;
         decorativeLine: {

package/es/marker/config.js

@@ -1,6 +1,7 @@
-import { IMarkAreaLabelPosition, IMarkLineLabelPosition } from "./type";
+import { IMarkAreaLabelPosition, IMarkLineLabelPosition, IMarkCommonArcLabelPosition } from "./type";
 
 export const DEFAULT_MARK_LINE_THEME = {
+    interactive: !0,
     startSymbol: {
         visible: !1,
         symbolType: "triangle",
@@ -26,7 +27,9 @@ export const DEFAULT_MARK_LINE_THEME = {
             lineWidth: 0,
             fontSize: 10,
             fontWeight: "normal",
-            fontStyle: "normal"
+            fontStyle: "normal",
+            textAlign: "center",
+            textBaseline: "middle"
         },
         padding: [ 2, 2, 4, 4 ],
         panel: {
@@ -43,46 +46,54 @@ export const DEFAULT_MARK_LINE_THEME = {
     }
 };
 
-export const DEFAULT_MARK_LINE_TEXT_STYLE_MAP = {
-    start: {
-        textAlign: "right",
-        textBaseline: "middle"
-    },
-    insideStartTop: {
-        textAlign: "left",
-        textBaseline: "bottom"
-    },
-    insideStartBottom: {
-        textAlign: "left",
-        textBaseline: "top"
-    },
-    middle: {
-        textAlign: "center",
-        textBaseline: "middle"
-    },
-    insideMiddleTop: {
-        textAlign: "center",
-        textBaseline: "bottom"
-    },
-    insideMiddleBottom: {
-        textAlign: "center",
-        textBaseline: "top"
+export const DEFAULT_MARK_ARC_LINE_THEME = {
+    interactive: !0,
+    startSymbol: {
+        visible: !1,
+        symbolType: "triangle",
+        size: 12,
+        fill: "rgba(46, 47, 50)",
+        lineWidth: 0
     },
-    end: {
-        textAlign: "left",
-        textBaseline: "middle"
+    endSymbol: {
+        visible: !0,
+        symbolType: "triangle",
+        size: 12,
+        fill: "rgba(46, 47, 50)",
+        lineWidth: 0
     },
-    insideEndTop: {
-        textAlign: "right",
-        textBaseline: "bottom"
+    label: {
+        position: IMarkCommonArcLabelPosition.arcOuterMiddle,
+        refX: 0,
+        refY: 0,
+        refAngle: 0,
+        textStyle: {
+            fill: "#fff",
+            stroke: "#fff",
+            lineWidth: 0,
+            fontSize: 10,
+            fontWeight: "normal",
+            fontStyle: "normal",
+            textAlign: "center",
+            textBaseline: "middle"
+        },
+        padding: [ 2, 2, 4, 4 ],
+        panel: {
+            visible: !0,
+            cornerRadius: 0,
+            fill: "rgb(48, 115, 242)",
+            fillOpacity: .8
+        }
     },
-    insideEndBottom: {
-        textAlign: "right",
-        textBaseline: "top"
+    lineStyle: {
+        stroke: "#b2bacf",
+        lineWidth: 1,
+        lineDash: [ 2 ]
     }
 };
 
 export const DEFAULT_MARK_AREA_THEME = {
+    interactive: !0,
     label: {
         position: IMarkAreaLabelPosition.right,
         textStyle: {
@@ -91,7 +102,37 @@ export const DEFAULT_MARK_AREA_THEME = {
             lineWidth: 0,
             fontSize: 10,
             fontWeight: "normal",
-            fontStyle: "normal"
+            fontStyle: "normal",
+            textAlign: "center",
+            textBaseline: "middle"
+        },
+        padding: [ 2, 2, 4, 4 ],
+        panel: {
+            visible: !0,
+            cornerRadius: 0,
+            fill: "rgb(48, 115, 242)",
+            fillOpacity: .8
+        }
+    },
+    areaStyle: {
+        fill: "#b2bacf",
+        visible: !0
+    }
+};
+
+export const DEFAULT_MARK_ARC_AREA_THEME = {
+    interactive: !0,
+    label: {
+        position: IMarkCommonArcLabelPosition.arcOuterMiddle,
+        textStyle: {
+            fill: "#fff",
+            stroke: "#fff",
+            lineWidth: 0,
+            fontSize: 10,
+            fontWeight: "normal",
+            fontStyle: "normal",
+            textAlign: "center",
+            textBaseline: "middle"
         },
         padding: [ 2, 2, 4, 4 ],
         panel: {
@@ -107,7 +148,7 @@ export const DEFAULT_MARK_AREA_THEME = {
     }
 };
 
-export const DEFAULT_MARK_AREA_TEXT_STYLE_MAP = {
+export const DEFAULT_CARTESIAN_MARK_AREA_TEXT_STYLE_MAP = {
     left: {
         textAlign: "right",
         textBaseline: "middle"
@@ -147,6 +188,7 @@ export const DEFAULT_MARK_AREA_TEXT_STYLE_MAP = {
 };
 
 export const DEFAULT_MARK_POINT_THEME = {
+    interactive: !0,
     itemLine: {
         visible: !0,
         decorativeLine: {

package/es/marker/config.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/marker/config.ts"],"names":[],"mappings":"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","file":"config.js","sourcesContent":["import type { TextAlignType, TextBaselineType } from '@visactor/vrender-core';\nimport { IMarkAreaLabelPosition, IMarkLineLabelPosition } from './type';\n\nexport const DEFAULT_MARK_LINE_THEME = {\n  startSymbol: {\n    visible: false,\n    symbolType: 'triangle',\n    size: 12,\n    fill: 'rgba(46, 47, 50)',\n    lineWidth: 0\n  },\n  endSymbol: {\n    visible: true,\n    symbolType: 'triangle',\n    size: 12,\n    fill: 'rgba(46, 47, 50)',\n    lineWidth: 0\n  },\n  label: {\n    position: IMarkLineLabelPosition.end,\n    refX: 0,\n    refY: 0,\n    refAngle: 0,\n    textStyle: {\n      fill: '#fff',\n      stroke: '#fff',\n      lineWidth: 0,\n      fontSize: 10,\n      fontWeight: 'normal',\n      fontStyle: 'normal'\n    },\n    padding: [2, 2, 4, 4],\n    panel: {\n      visible: true,\n      cornerRadius: 0,\n      fill: 'rgb(48, 115, 242)',\n      fillOpacity: 0.8\n    }\n  },\n  lineStyle: {\n    stroke: '#b2bacf',\n    lineWidth: 1,\n    lineDash: [2]\n  }\n};\n\nexport const DEFAULT_MARK_LINE_TEXT_STYLE_MAP: {\n  [K: string]: {\n    textAlign: TextAlignType;\n    textBaseline: TextBaselineType;\n  };\n} = {\n  start: {\n    textAlign: 'right',\n    textBaseline: 'middle'\n  },\n  insideStartTop: {\n    textAlign: 'left',\n    textBaseline: 'bottom'\n  },\n  insideStartBottom: {\n    textAlign: 'left',\n    textBaseline: 'top'\n  },\n\n  middle: {\n    textAlign: 'center',\n    textBaseline: 'middle'\n  },\n  insideMiddleTop: {\n    textAlign: 'center',\n    textBaseline: 'bottom'\n  },\n  insideMiddleBottom: {\n    textAlign: 'center',\n    textBaseline: 'top'\n  },\n\n  end: {\n    textAlign: 'left',\n    textBaseline: 'middle'\n  },\n  insideEndTop: {\n    textAlign: 'right',\n    textBaseline: 'bottom'\n  },\n  insideEndBottom: {\n    textAlign: 'right',\n    textBaseline: 'top'\n  }\n};\n\nexport const DEFAULT_MARK_AREA_THEME = {\n  label: {\n    position: IMarkAreaLabelPosition.right,\n    textStyle: {\n      fill: '#fff',\n      stroke: '#fff',\n      lineWidth: 0,\n      fontSize: 10,\n      fontWeight: 'normal',\n      fontStyle: 'normal'\n    },\n    padding: [2, 2, 4, 4],\n    panel: {\n      visible: true,\n      cornerRadius: 0,\n      fill: 'rgb(48, 115, 242)',\n      fillOpacity: 0.8\n    }\n  },\n  areaStyle: {\n    fill: '#b2bacf',\n    visible: true\n  }\n};\n\nexport const DEFAULT_MARK_AREA_TEXT_STYLE_MAP: {\n  [K: string]: {\n    textAlign: TextAlignType;\n    textBaseline: TextBaselineType;\n  };\n} = {\n  left: {\n    textAlign: 'right',\n    textBaseline: 'middle'\n  },\n  insideLeft: {\n    textAlign: 'left',\n    textBaseline: 'middle'\n  },\n\n  right: {\n    textAlign: 'left',\n    textBaseline: 'middle'\n  },\n  insideRight: {\n    textAlign: 'right',\n    textBaseline: 'middle'\n  },\n\n  top: {\n    textAlign: 'center',\n    textBaseline: 'bottom'\n  },\n  insideTop: {\n    textAlign: 'center',\n    textBaseline: 'top'\n  },\n\n  bottom: {\n    textAlign: 'center',\n    textBaseline: 'top'\n  },\n  insideBottom: {\n    textAlign: 'center',\n    textBaseline: 'bottom'\n  },\n\n  middle: {\n    textAlign: 'center',\n    textBaseline: 'middle'\n  }\n};\n\nexport const DEFAULT_MARK_POINT_THEME = {\n  itemLine: {\n    visible: true,\n    decorativeLine: {\n      visible: false,\n      length: 30\n    },\n    startSymbol: {\n      visible: true,\n      clip: true,\n      symbolType: 'circle',\n      size: 20,\n      style: {\n        fill: false,\n        stroke: 'rgba(46, 47, 50)'\n      }\n    },\n    endSymbol: {\n      visible: false,\n      clip: true,\n      symbolType: 'triangle',\n      size: 12,\n      style: {\n        fill: false,\n        stroke: 'rgba(46, 47, 50)'\n      }\n    },\n    lineStyle: {\n      stroke: '#000',\n      lineWidth: 1\n    }\n  },\n  itemContent: {\n    type: 'text',\n    position: 'middle',\n    refX: 10,\n    symbolStyle: {\n      symbolType: 'star',\n      fill: 'rgb(48, 115, 242)',\n      fillOpacity: 0.8,\n      size: 20\n    },\n    textStyle: {\n      dx: 0,\n      dy: 0\n    },\n    imageStyle: {\n      width: 80,\n      height: 80\n    },\n    richTextStyle: {\n      width: 100,\n      height: 100\n    }\n  }\n};\n\nexport const DEFAULT_MARK_POINT_TEXT_STYLE_MAP: {\n  [K: string]: {\n    textAlign: TextAlignType;\n    textBaseline: TextBaselineType;\n  };\n} = {\n  top: {\n    textAlign: 'left',\n    textBaseline: 'bottom'\n  },\n  bottom: {\n    textAlign: 'left',\n    textBaseline: 'top'\n  },\n  middle: {\n    textAlign: 'left',\n    textBaseline: 'middle'\n  },\n  insideTop: {\n    textAlign: 'right',\n    textBaseline: 'bottom'\n  },\n  insideBottom: {\n    textAlign: 'right',\n    textBaseline: 'top'\n  },\n  insideMiddle: {\n    textAlign: 'right',\n    textBaseline: 'middle'\n  }\n};\n"]}
+{"version":3,"sources":["../src/marker/config.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,sBAAsB,EAAE,sBAAsB,EAAE,2BAA2B,EAAE,MAAM,QAAQ,CAAC;AAErG,MAAM,CAAC,MAAM,uBAAuB,GAAG;IACrC,WAAW,EAAE,IAAI;IACjB,WAAW,EAAE;QACX,OAAO,EAAE,KAAK;QACd,UAAU,EAAE,UAAU;QACtB,IAAI,EAAE,EAAE;QACR,IAAI,EAAE,kBAAkB;QACxB,SAAS,EAAE,CAAC;KACb;IACD,SAAS,EAAE;QACT,OAAO,EAAE,IAAI;QACb,UAAU,EAAE,UAAU;QACtB,IAAI,EAAE,EAAE;QACR,IAAI,EAAE,kBAAkB;QACxB,SAAS,EAAE,CAAC;KACb;IACD,KAAK,EAAE;QACL,QAAQ,EAAE,sBAAsB,CAAC,GAAG;QACpC,IAAI,EAAE,CAAC;QACP,IAAI,EAAE,CAAC;QACP,QAAQ,EAAE,CAAC;QACX,SAAS,EAAE;YACT,IAAI,EAAE,MAAM;YACZ,MAAM,EAAE,MAAM;YACd,SAAS,EAAE,CAAC;YACZ,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,QAAQ;YACpB,SAAS,EAAE,QAAQ;YACnB,SAAS,EAAE,QAAQ;YACnB,YAAY,EAAE,QAAQ;SACvB;QACD,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;QACrB,KAAK,EAAE;YACL,OAAO,EAAE,IAAI;YACb,YAAY,EAAE,CAAC;YACf,IAAI,EAAE,mBAAmB;YACzB,WAAW,EAAE,GAAG;SACjB;KACF;IACD,SAAS,EAAE;QACT,MAAM,EAAE,SAAS;QACjB,SAAS,EAAE,CAAC;QACZ,QAAQ,EAAE,CAAC,CAAC,CAAC;KACd;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,2BAA2B,GAAG;IACzC,WAAW,EAAE,IAAI;IACjB,WAAW,EAAE;QACX,OAAO,EAAE,KAAK;QACd,UAAU,EAAE,UAAU;QACtB,IAAI,EAAE,EAAE;QACR,IAAI,EAAE,kBAAkB;QACxB,SAAS,EAAE,CAAC;KACb;IACD,SAAS,EAAE;QACT,OAAO,EAAE,IAAI;QACb,UAAU,EAAE,UAAU;QACtB,IAAI,EAAE,EAAE;QACR,IAAI,EAAE,kBAAkB;QACxB,SAAS,EAAE,CAAC;KACb;IACD,KAAK,EAAE;QACL,QAAQ,EAAE,2BAA2B,CAAC,cAAc;QACpD,IAAI,EAAE,CAAC;QACP,IAAI,EAAE,CAAC;QACP,QAAQ,EAAE,CAAC;QACX,SAAS,EAAE;YACT,IAAI,EAAE,MAAM;YACZ,MAAM,EAAE,MAAM;YACd,SAAS,EAAE,CAAC;YACZ,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,QAAQ;YACpB,SAAS,EAAE,QAAQ;YACnB,SAAS,EAAE,QAAQ;YACnB,YAAY,EAAE,QAAQ;SACvB;QACD,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;QACrB,KAAK,EAAE;YACL,OAAO,EAAE,IAAI;YACb,YAAY,EAAE,CAAC;YACf,IAAI,EAAE,mBAAmB;YACzB,WAAW,EAAE,GAAG;SACjB;KACF;IACD,SAAS,EAAE;QACT,MAAM,EAAE,SAAS;QACjB,SAAS,EAAE,CAAC;QACZ,QAAQ,EAAE,CAAC,CAAC,CAAC;KACd;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAG;IACrC,WAAW,EAAE,IAAI;IACjB,KAAK,EAAE;QACL,QAAQ,EAAE,sBAAsB,CAAC,KAAK;QACtC,SAAS,EAAE;YACT,IAAI,EAAE,MAAM;YACZ,MAAM,EAAE,MAAM;YACd,SAAS,EAAE,CAAC;YACZ,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,QAAQ;YACpB,SAAS,EAAE,QAAQ;YACnB,SAAS,EAAE,QAAQ;YACnB,YAAY,EAAE,QAAQ;SACvB;QACD,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;QACrB,KAAK,EAAE;YACL,OAAO,EAAE,IAAI;YACb,YAAY,EAAE,CAAC;YACf,IAAI,EAAE,mBAAmB;YACzB,WAAW,EAAE,GAAG;SACjB;KACF;IACD,SAAS,EAAE;QACT,IAAI,EAAE,SAAS;QACf,OAAO,EAAE,IAAI;KACd;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,2BAA2B,GAAG;IACzC,WAAW,EAAE,IAAI;IACjB,KAAK,EAAE;QACL,QAAQ,EAAE,2BAA2B,CAAC,cAAc;QACpD,SAAS,EAAE;YACT,IAAI,EAAE,MAAM;YACZ,MAAM,EAAE,MAAM;YACd,SAAS,EAAE,CAAC;YACZ,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,QAAQ;YACpB,SAAS,EAAE,QAAQ;YACnB,SAAS,EAAE,QAAQ;YACnB,YAAY,EAAE,QAAQ;SACvB;QACD,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;QACrB,KAAK,EAAE;YACL,OAAO,EAAE,IAAI;YACb,YAAY,EAAE,CAAC;YACf,IAAI,EAAE,mBAAmB;YACzB,WAAW,EAAE,GAAG;SACjB;KACF;IACD,SAAS,EAAE;QACT,IAAI,EAAE,SAAS;QACf,OAAO,EAAE,IAAI;KACd;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,0CAA0C,GAKnD;IACF,IAAI,EAAE;QACJ,SAAS,EAAE,OAAO;QAClB,YAAY,EAAE,QAAQ;KACvB;IACD,UAAU,EAAE;QACV,SAAS,EAAE,MAAM;QACjB,YAAY,EAAE,QAAQ;KACvB;IAED,KAAK,EAAE;QACL,SAAS,EAAE,MAAM;QACjB,YAAY,EAAE,QAAQ;KACvB;IACD,WAAW,EAAE;QACX,SAAS,EAAE,OAAO;QAClB,YAAY,EAAE,QAAQ;KACvB;IAED,GAAG,EAAE;QACH,SAAS,EAAE,QAAQ;QACnB,YAAY,EAAE,QAAQ;KACvB;IACD,SAAS,EAAE;QACT,SAAS,EAAE,QAAQ;QACnB,YAAY,EAAE,KAAK;KACpB;IAED,MAAM,EAAE;QACN,SAAS,EAAE,QAAQ;QACnB,YAAY,EAAE,KAAK;KACpB;IACD,YAAY,EAAE;QACZ,SAAS,EAAE,QAAQ;QACnB,YAAY,EAAE,QAAQ;KACvB;IAED,MAAM,EAAE;QACN,SAAS,EAAE,QAAQ;QACnB,YAAY,EAAE,QAAQ;KACvB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,wBAAwB,GAAG;IACtC,WAAW,EAAE,IAAI;IACjB,QAAQ,EAAE;QACR,OAAO,EAAE,IAAI;QACb,cAAc,EAAE;YACd,OAAO,EAAE,KAAK;YACd,MAAM,EAAE,EAAE;SACX;QACD,WAAW,EAAE;YACX,OAAO,EAAE,IAAI;YACb,IAAI,EAAE,IAAI;YACV,UAAU,EAAE,QAAQ;YACpB,IAAI,EAAE,EAAE;YACR,KAAK,EAAE;gBACL,IAAI,EAAE,KAAK;gBACX,MAAM,EAAE,kBAAkB;aAC3B;SACF;QACD,SAAS,EAAE;YACT,OAAO,EAAE,KAAK;YACd,IAAI,EAAE,IAAI;YACV,UAAU,EAAE,UAAU;YACtB,IAAI,EAAE,EAAE;YACR,KAAK,EAAE;gBACL,IAAI,EAAE,KAAK;gBACX,MAAM,EAAE,kBAAkB;aAC3B;SACF;QACD,SAAS,EAAE;YACT,MAAM,EAAE,MAAM;YACd,SAAS,EAAE,CAAC;SACb;KACF;IACD,WAAW,EAAE;QACX,IAAI,EAAE,MAAM;QACZ,QAAQ,EAAE,QAAQ;QAClB,IAAI,EAAE,EAAE;QACR,WAAW,EAAE;YACX,UAAU,EAAE,MAAM;YAClB,IAAI,EAAE,mBAAmB;YACzB,WAAW,EAAE,GAAG;YAChB,IAAI,EAAE,EAAE;SACT;QACD,SAAS,EAAE;YACT,EAAE,EAAE,CAAC;YACL,EAAE,EAAE,CAAC;SACN;QACD,UAAU,EAAE;YACV,KAAK,EAAE,EAAE;YACT,MAAM,EAAE,EAAE;SACX;QACD,aAAa,EAAE;YACb,KAAK,EAAE,GAAG;YACV,MAAM,EAAE,GAAG;SACZ;KACF;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,iCAAiC,GAK1C;IACF,GAAG,EAAE;QACH,SAAS,EAAE,MAAM;QACjB,YAAY,EAAE,QAAQ;KACvB;IACD,MAAM,EAAE;QACN,SAAS,EAAE,MAAM;QACjB,YAAY,EAAE,KAAK;KACpB;IACD,MAAM,EAAE;QACN,SAAS,EAAE,MAAM;QACjB,YAAY,EAAE,QAAQ;KACvB;IACD,SAAS,EAAE;QACT,SAAS,EAAE,OAAO;QAClB,YAAY,EAAE,QAAQ;KACvB;IACD,YAAY,EAAE;QACZ,SAAS,EAAE,OAAO;QAClB,YAAY,EAAE,KAAK;KACpB;IACD,YAAY,EAAE;QACZ,SAAS,EAAE,OAAO;QAClB,YAAY,EAAE,QAAQ;KACvB;CACF,CAAC","file":"config.js","sourcesContent":["import type { TextAlignType, TextBaselineType } from '@visactor/vrender-core';\nimport { IMarkAreaLabelPosition, IMarkLineLabelPosition, IMarkCommonArcLabelPosition } from './type';\n\nexport const DEFAULT_MARK_LINE_THEME = {\n  interactive: true,\n  startSymbol: {\n    visible: false,\n    symbolType: 'triangle',\n    size: 12,\n    fill: 'rgba(46, 47, 50)',\n    lineWidth: 0\n  },\n  endSymbol: {\n    visible: true,\n    symbolType: 'triangle',\n    size: 12,\n    fill: 'rgba(46, 47, 50)',\n    lineWidth: 0\n  },\n  label: {\n    position: IMarkLineLabelPosition.end,\n    refX: 0,\n    refY: 0,\n    refAngle: 0,\n    textStyle: {\n      fill: '#fff',\n      stroke: '#fff',\n      lineWidth: 0,\n      fontSize: 10,\n      fontWeight: 'normal',\n      fontStyle: 'normal',\n      textAlign: 'center',\n      textBaseline: 'middle'\n    },\n    padding: [2, 2, 4, 4],\n    panel: {\n      visible: true,\n      cornerRadius: 0,\n      fill: 'rgb(48, 115, 242)',\n      fillOpacity: 0.8\n    }\n  },\n  lineStyle: {\n    stroke: '#b2bacf',\n    lineWidth: 1,\n    lineDash: [2]\n  }\n};\n\nexport const DEFAULT_MARK_ARC_LINE_THEME = {\n  interactive: true,\n  startSymbol: {\n    visible: false,\n    symbolType: 'triangle',\n    size: 12,\n    fill: 'rgba(46, 47, 50)',\n    lineWidth: 0\n  },\n  endSymbol: {\n    visible: true,\n    symbolType: 'triangle',\n    size: 12,\n    fill: 'rgba(46, 47, 50)',\n    lineWidth: 0\n  },\n  label: {\n    position: IMarkCommonArcLabelPosition.arcOuterMiddle,\n    refX: 0,\n    refY: 0,\n    refAngle: 0,\n    textStyle: {\n      fill: '#fff',\n      stroke: '#fff',\n      lineWidth: 0,\n      fontSize: 10,\n      fontWeight: 'normal',\n      fontStyle: 'normal',\n      textAlign: 'center',\n      textBaseline: 'middle'\n    },\n    padding: [2, 2, 4, 4],\n    panel: {\n      visible: true,\n      cornerRadius: 0,\n      fill: 'rgb(48, 115, 242)',\n      fillOpacity: 0.8\n    }\n  },\n  lineStyle: {\n    stroke: '#b2bacf',\n    lineWidth: 1,\n    lineDash: [2]\n  }\n};\n\nexport const DEFAULT_MARK_AREA_THEME = {\n  interactive: true,\n  label: {\n    position: IMarkAreaLabelPosition.right,\n    textStyle: {\n      fill: '#fff',\n      stroke: '#fff',\n      lineWidth: 0,\n      fontSize: 10,\n      fontWeight: 'normal',\n      fontStyle: 'normal',\n      textAlign: 'center',\n      textBaseline: 'middle'\n    },\n    padding: [2, 2, 4, 4],\n    panel: {\n      visible: true,\n      cornerRadius: 0,\n      fill: 'rgb(48, 115, 242)',\n      fillOpacity: 0.8\n    }\n  },\n  areaStyle: {\n    fill: '#b2bacf',\n    visible: true\n  }\n};\n\nexport const DEFAULT_MARK_ARC_AREA_THEME = {\n  interactive: true,\n  label: {\n    position: IMarkCommonArcLabelPosition.arcOuterMiddle,\n    textStyle: {\n      fill: '#fff',\n      stroke: '#fff',\n      lineWidth: 0,\n      fontSize: 10,\n      fontWeight: 'normal',\n      fontStyle: 'normal',\n      textAlign: 'center',\n      textBaseline: 'middle'\n    },\n    padding: [2, 2, 4, 4],\n    panel: {\n      visible: true,\n      cornerRadius: 0,\n      fill: 'rgb(48, 115, 242)',\n      fillOpacity: 0.8\n    }\n  },\n  areaStyle: {\n    fill: '#b2bacf',\n    visible: true\n  }\n};\n\nexport const DEFAULT_CARTESIAN_MARK_AREA_TEXT_STYLE_MAP: {\n  [K: string]: {\n    textAlign: TextAlignType;\n    textBaseline: TextBaselineType;\n  };\n} = {\n  left: {\n    textAlign: 'right',\n    textBaseline: 'middle'\n  },\n  insideLeft: {\n    textAlign: 'left',\n    textBaseline: 'middle'\n  },\n\n  right: {\n    textAlign: 'left',\n    textBaseline: 'middle'\n  },\n  insideRight: {\n    textAlign: 'right',\n    textBaseline: 'middle'\n  },\n\n  top: {\n    textAlign: 'center',\n    textBaseline: 'bottom'\n  },\n  insideTop: {\n    textAlign: 'center',\n    textBaseline: 'top'\n  },\n\n  bottom: {\n    textAlign: 'center',\n    textBaseline: 'top'\n  },\n  insideBottom: {\n    textAlign: 'center',\n    textBaseline: 'bottom'\n  },\n\n  middle: {\n    textAlign: 'center',\n    textBaseline: 'middle'\n  }\n};\n\nexport const DEFAULT_MARK_POINT_THEME = {\n  interactive: true,\n  itemLine: {\n    visible: true,\n    decorativeLine: {\n      visible: false,\n      length: 30\n    },\n    startSymbol: {\n      visible: true,\n      clip: true,\n      symbolType: 'circle',\n      size: 20,\n      style: {\n        fill: false,\n        stroke: 'rgba(46, 47, 50)'\n      }\n    },\n    endSymbol: {\n      visible: false,\n      clip: true,\n      symbolType: 'triangle',\n      size: 12,\n      style: {\n        fill: false,\n        stroke: 'rgba(46, 47, 50)'\n      }\n    },\n    lineStyle: {\n      stroke: '#000',\n      lineWidth: 1\n    }\n  },\n  itemContent: {\n    type: 'text',\n    position: 'middle',\n    refX: 10,\n    symbolStyle: {\n      symbolType: 'star',\n      fill: 'rgb(48, 115, 242)',\n      fillOpacity: 0.8,\n      size: 20\n    },\n    textStyle: {\n      dx: 0,\n      dy: 0\n    },\n    imageStyle: {\n      width: 80,\n      height: 80\n    },\n    richTextStyle: {\n      width: 100,\n      height: 100\n    }\n  }\n};\n\nexport const DEFAULT_MARK_POINT_TEXT_STYLE_MAP: {\n  [K: string]: {\n    textAlign: TextAlignType;\n    textBaseline: TextBaselineType;\n  };\n} = {\n  top: {\n    textAlign: 'left',\n    textBaseline: 'bottom'\n  },\n  bottom: {\n    textAlign: 'left',\n    textBaseline: 'top'\n  },\n  middle: {\n    textAlign: 'left',\n    textBaseline: 'middle'\n  },\n  insideTop: {\n    textAlign: 'right',\n    textBaseline: 'bottom'\n  },\n  insideBottom: {\n    textAlign: 'right',\n    textBaseline: 'top'\n  },\n  insideMiddle: {\n    textAlign: 'right',\n    textBaseline: 'middle'\n  }\n};\n"]}

package/es/marker/index.d.ts

@@ -1,4 +1,6 @@
 export * from './type';
 export * from './line';
 export * from './area';
+export * from './arc-line';
+export * from './arc-area';
 export * from './point';

package/es/marker/index.js

@@ -4,5 +4,9 @@ export * from "./line";
 
 export * from "./area";
 
+export * from "./arc-line";
+
+export * from "./arc-area";
+
 export * from "./point";
 //# sourceMappingURL=index.js.map

package/es/marker/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/marker/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC","file":"index.js","sourcesContent":["export * from './type';\nexport * from './line';\nexport * from './area';\nexport * from './point';\n"]}
+{"version":3,"sources":["../src/marker/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAE3B,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC","file":"index.js","sourcesContent":["export * from './type';\nexport * from './line';\nexport * from './area';\nexport * from './arc-line';\n// export * from './polar/line';\nexport * from './arc-area';\nexport * from './point';\n"]}

package/es/marker/line.d.ts

@@ -1,18 +1,30 @@
-import type { IGroup } from '@visactor/vrender-core';
-import { Segment } from '../segment';
-import { Tag } from '../tag';
-import { Marker } from './base';
-import type { MarkLineAttrs } from './type';
+import { IMarkLineLabelPosition } from './type';
+import type { MarkLineAttrs, MarkerAnimationState } from './type';
 import type { ComponentOptions } from '../interface';
-export declare class MarkLine extends Marker<MarkLineAttrs> {
+import { MarkCommonLine } from './common-line';
+import type { ArcSegment } from '../segment';
+import { Segment } from '../segment';
+import type { ILineGraphicAttribute } from '@visactor/vrender-core';
+export declare function registerMarkLineAnimate(): void;
+export declare class MarkLine extends MarkCommonLine<ILineGraphicAttribute, IMarkLineLabelPosition> {
     name: string;
     static defaultAttributes: Partial<MarkLineAttrs>;
-    private _line;
-    getLine(): Segment;
-    getLabel(): Tag;
+    protected _line: Segment | ArcSegment;
+    protected markerAnimate(state: MarkerAnimationState): void;
     constructor(attributes: MarkLineAttrs, options?: ComponentOptions);
-    protected setLabelPos(): void;
-    protected initMarker(container: IGroup): void;
-    protected updateMarker(): void;
+    protected getLabelOffsetByPosition(position: IMarkLineLabelPosition): {
+        offsetX: number;
+        offsetY: number;
+    };
+    protected getPointAttrByPosition(position: IMarkLineLabelPosition): {
+        position: {
+            x: number;
+            y: number;
+        };
+        angle: number;
+    };
+    protected getRotateByAngle(angle: number): number;
+    protected createSegment(): Segment;
+    protected setLineAttributes(): void;
     protected isValidPoints(): boolean;
 }

package/es/marker/line.js

@@ -1,73 +1,144 @@
 import { isValidNumber, merge } from "@visactor/vutils";
 
-import { Segment } from "../segment";
+import { IMarkLineLabelPosition } from "./type";
+
+import { loadMarkLineComponent } from "./register";
 
-import { Tag } from "../tag";
+import { MarkCommonLine } from "./common-line";
 
-import { Marker } from "./base";
+import { Segment } from "../segment";
 
-import { DEFAULT_MARK_LINE_THEME, DEFAULT_MARK_LINE_TEXT_STYLE_MAP } from "./config";
+import { DEFAULT_STATES } from "../constant";
 
-import { limitShapeInBounds } from "../util/limit-shape";
+import { DEFAULT_MARK_LINE_THEME } from "./config";
 
-import { loadMarkLineComponent } from "./register";
+import { commonMarkLineAnimate } from "./animate/animate";
 
 loadMarkLineComponent();
 
-export class MarkLine extends Marker {
-    getLine() {
-        return this._line;
-    }
-    getLabel() {
-        return this._label;
+export function registerMarkLineAnimate() {
+    MarkLine._animate = commonMarkLineAnimate;
+}
+
+export class MarkLine extends MarkCommonLine {
+    markerAnimate(state) {
+        MarkLine._animate && MarkLine._animate(this._line, this._label, this._animationConfig, state);
     }
     constructor(attributes, options) {
         super((null == options ? void 0 : options.skipDefault) ? attributes : merge({}, MarkLine.defaultAttributes, attributes)), 
         this.name = "markLine";
     }
-    setLabelPos() {
-        var _a, _b;
-        const {label: label = {}, limitRect: limitRect} = this.attribute, {position: position = "end", refX: refX = 0, refY: refY = 0, confine: confine} = label, points = this._line.getMainSegmentPoints(), labelAngle = null !== (_a = this._line.getEndAngle()) && void 0 !== _a ? _a : 0, labelOffsetX = refX * Math.cos(labelAngle) + refY * Math.cos(labelAngle - Math.PI / 2), labelOffsetY = refX * Math.sin(labelAngle) + refY * Math.sin(labelAngle - Math.PI / 2);
-        let labelPoint;
-        if (labelPoint = position.includes("start") || position.includes("Start") ? {
-            x: points[0].x + labelOffsetX,
-            y: points[0].y + labelOffsetY
+    getLabelOffsetByPosition(position) {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
+        const labelRectHeight = Math.abs((null !== (_c = null === (_b = null === (_a = this._label.getTextShape()) || void 0 === _a ? void 0 : _a.AABBBounds) || void 0 === _b ? void 0 : _b.y2) && void 0 !== _c ? _c : 0) - (null !== (_e = null === (_d = this._label.getTextShape()) || void 0 === _d ? void 0 : _d.AABBBounds.y1) && void 0 !== _e ? _e : 0)), labelTextHeight = Math.abs((null !== (_h = null === (_g = null === (_f = this._label.getBgRect()) || void 0 === _f ? void 0 : _f.AABBBounds) || void 0 === _g ? void 0 : _g.y2) && void 0 !== _h ? _h : 0) - (null !== (_k = null === (_j = this._label.getBgRect()) || void 0 === _j ? void 0 : _j.AABBBounds.y1) && void 0 !== _k ? _k : 0)), labelHeight = Math.max(labelRectHeight, labelTextHeight), labelRectWidth = Math.abs((null !== (_o = null === (_m = null === (_l = this._label.getTextShape()) || void 0 === _l ? void 0 : _l.AABBBounds) || void 0 === _m ? void 0 : _m.x2) && void 0 !== _o ? _o : 0) - (null !== (_q = null === (_p = this._label.getTextShape()) || void 0 === _p ? void 0 : _p.AABBBounds.x1) && void 0 !== _q ? _q : 0)), labelTextWidth = Math.abs((null !== (_t = null === (_s = null === (_r = this._label.getBgRect()) || void 0 === _r ? void 0 : _r.AABBBounds) || void 0 === _s ? void 0 : _s.x2) && void 0 !== _t ? _t : 0) - (null !== (_v = null === (_u = this._label.getBgRect()) || void 0 === _u ? void 0 : _u.AABBBounds.x1) && void 0 !== _v ? _v : 0)), labelWidth = Math.max(labelRectWidth, labelTextWidth);
+        switch (position) {
+          case IMarkLineLabelPosition.start:
+            return {
+                offsetX: -labelWidth / 2,
+                offsetY: 0
+            };
+
+          case IMarkLineLabelPosition.insideStartTop:
+            return {
+                offsetX: labelWidth / 2,
+                offsetY: labelHeight / 2
+            };
+
+          case IMarkLineLabelPosition.insideStartBottom:
+            return {
+                offsetX: labelWidth / 2,
+                offsetY: -labelHeight / 2
+            };
+
+          case IMarkLineLabelPosition.middle:
+            return {
+                offsetX: 0,
+                offsetY: 0
+            };
+
+          case IMarkLineLabelPosition.insideMiddleTop:
+            return {
+                offsetX: 0,
+                offsetY: labelHeight / 2
+            };
+
+          case IMarkLineLabelPosition.insideMiddleBottom:
+            return {
+                offsetX: 0,
+                offsetY: -labelHeight / 2
+            };
+
+          case IMarkLineLabelPosition.end:
+            return {
+                offsetX: labelWidth / 2,
+                offsetY: 0
+            };
+
+          case IMarkLineLabelPosition.insideEndTop:
+            return {
+                offsetX: -labelWidth / 2,
+                offsetY: labelHeight / 2
+            };
+
+          case IMarkLineLabelPosition.insideEndBottom:
+            return {
+                offsetX: -labelWidth / 2,
+                offsetY: -labelHeight / 2
+            };
+
+          default:
+            return {
+                offsetX: labelWidth / 2,
+                offsetY: 0
+            };
+        }
+    }
+    getPointAttrByPosition(position) {
+        var _a;
+        const {label: label = {}} = this.attribute, {refX: refX = 0, refY: refY = 0} = label, points = this._line.getMainSegmentPoints(), labelAngle = null !== (_a = this._line.getEndAngle()) && void 0 !== _a ? _a : 0, totalRefX = refX + this.getLabelOffsetByPosition(position).offsetX, totalRefY = refY + this.getLabelOffsetByPosition(position).offsetY, labelOffsetX = totalRefX * Math.cos(labelAngle) + totalRefY * Math.cos(labelAngle - Math.PI / 2), labelOffsetY = totalRefX * Math.sin(labelAngle) + totalRefY * Math.sin(labelAngle - Math.PI / 2);
+        return position.includes("start") || position.includes("Start") ? {
+            position: {
+                x: points[0].x + labelOffsetX,
+                y: points[0].y + labelOffsetY
+            },
+            angle: labelAngle
         } : position.includes("middle") || position.includes("Middle") ? {
-            x: (points[0].x + points[points.length - 1].x) / 2 + labelOffsetX,
-            y: (points[0].y + points[points.length - 1].y) / 2 + labelOffsetY
+            position: {
+                x: (points[0].x + points[points.length - 1].x) / 2 + labelOffsetX,
+                y: (points[0].y + points[points.length - 1].y) / 2 + labelOffsetY
+            },
+            angle: labelAngle
         } : {
-            x: points[points.length - 1].x + labelOffsetX,
-            y: points[points.length - 1].y + labelOffsetY
-        }, this._label.setAttributes(Object.assign(Object.assign({}, labelPoint), {
-            angle: label.autoRotate ? labelAngle + (null !== (_b = label.refAngle) && void 0 !== _b ? _b : 0) : 0,
-            textStyle: Object.assign(Object.assign({}, DEFAULT_MARK_LINE_TEXT_STYLE_MAP[position]), label.textStyle)
-        })), limitRect && confine) {
-            const {x: x, y: y, width: width, height: height} = limitRect;
-            limitShapeInBounds(this._label, {
-                x1: x,
-                y1: y,
-                x2: x + width,
-                y2: y + height
-            });
-        }
+            position: {
+                x: points[points.length - 1].x + labelOffsetX,
+                y: points[points.length - 1].y + labelOffsetY
+            },
+            angle: labelAngle
+        };
     }
-    initMarker(container) {
-        const {points: points, startSymbol: startSymbol, endSymbol: endSymbol, label: label, lineStyle: lineStyle, mainSegmentIndex: mainSegmentIndex, multiSegment: multiSegment} = this.attribute, line = new Segment({
+    getRotateByAngle(angle) {
+        var _a;
+        return angle + (null !== (_a = this.attribute.label.refAngle) && void 0 !== _a ? _a : 0);
+    }
+    createSegment() {
+        const {points: points, startSymbol: startSymbol, endSymbol: endSymbol, lineStyle: lineStyle, mainSegmentIndex: mainSegmentIndex, multiSegment: multiSegment, state: state} = this.attribute;
+        return new Segment({
             points: points,
             startSymbol: startSymbol,
             endSymbol: endSymbol,
             lineStyle: lineStyle,
             mainSegmentIndex: mainSegmentIndex,
             multiSegment: multiSegment,
-            pickable: !1
+            pickable: !1,
+            state: {
+                line: merge({}, DEFAULT_STATES, null == state ? void 0 : state.line),
+                startSymbol: merge({}, DEFAULT_STATES, null == state ? void 0 : state.lineStartSymbol),
+                endSymbol: merge({}, DEFAULT_STATES, null == state ? void 0 : state.lineEndSymbol)
+            }
         });
-        line.name = "mark-line-line", this._line = line, container.add(line);
-        const markLabel = new Tag(Object.assign({}, label));
-        markLabel.name = "mark-line-label", this._label = markLabel, container.add(markLabel), 
-        this.setLabelPos();
     }
-    updateMarker() {
-        const {points: points, startSymbol: startSymbol, endSymbol: endSymbol, label: label, lineStyle: lineStyle, mainSegmentIndex: mainSegmentIndex, multiSegment: multiSegment} = this.attribute;
+    setLineAttributes() {
+        const {points: points, startSymbol: startSymbol, endSymbol: endSymbol, lineStyle: lineStyle, mainSegmentIndex: mainSegmentIndex, multiSegment: multiSegment} = this.attribute;
         this._line && this._line.setAttributes({
             points: points,
             startSymbol: startSymbol,
@@ -75,10 +146,7 @@ export class MarkLine extends Marker {
             lineStyle: lineStyle,
             mainSegmentIndex: mainSegmentIndex,
             multiSegment: multiSegment
-        }), this._label && this._label.setAttributes(Object.assign({
-            dx: 0,
-            dy: 0
-        }, label)), this.setLabelPos();
+        });
     }
     isValidPoints() {
         const {points: points} = this.attribute;