@visactor/vrender-components 0.17.2-alpha.4 → 0.17.2

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 (29) hide show
  1. package/cjs/data-zoom/config.d.ts +18 -0
  2. package/cjs/data-zoom/config.js +19 -1
  3. package/cjs/data-zoom/config.js.map +1 -1
  4. package/cjs/data-zoom/data-zoom.d.ts +4 -0
  5. package/cjs/data-zoom/data-zoom.js +95 -76
  6. package/cjs/data-zoom/data-zoom.js.map +1 -1
  7. package/cjs/data-zoom/type.d.ts +6 -2
  8. package/cjs/data-zoom/type.js.map +1 -1
  9. package/cjs/index.d.ts +1 -1
  10. package/cjs/index.js +1 -1
  11. package/cjs/index.js.map +1 -1
  12. package/cjs/scrollbar/scrollbar.js +2 -2
  13. package/cjs/scrollbar/scrollbar.js.map +1 -1
  14. package/dist/index.js +63 -33
  15. package/dist/index.min.js +1 -1
  16. package/es/data-zoom/config.d.ts +18 -0
  17. package/es/data-zoom/config.js +19 -0
  18. package/es/data-zoom/config.js.map +1 -1
  19. package/es/data-zoom/data-zoom.d.ts +4 -0
  20. package/es/data-zoom/data-zoom.js +95 -77
  21. package/es/data-zoom/data-zoom.js.map +1 -1
  22. package/es/data-zoom/type.d.ts +6 -2
  23. package/es/data-zoom/type.js.map +1 -1
  24. package/es/index.d.ts +1 -1
  25. package/es/index.js +1 -1
  26. package/es/index.js.map +1 -1
  27. package/es/scrollbar/scrollbar.js +2 -2
  28. package/es/scrollbar/scrollbar.js.map +1 -1
  29. package/package.json +5 -5
package/es/data-zoom/config.d.ts CHANGED
@@ -68,6 +68,7 @@ export declare const DEFAULT_DATA_ZOOM_ATTRIBUTES: {
68
68
  };
69
69
  startHandlerStyle: {
70
70
  visible: boolean;
71
+ triggerMinSize: number;
71
72
  symbolType: string;
72
73
  fill: string;
73
74
  stroke: string;
@@ -75,6 +76,7 @@ export declare const DEFAULT_DATA_ZOOM_ATTRIBUTES: {
75
76
  };
76
77
  endHandlerStyle: {
77
78
  visible: boolean;
79
+ triggerMinSize: number;
78
80
  symbolType: string;
79
81
  fill: string;
80
82
  stroke: string;
@@ -95,3 +97,19 @@ export declare const DEFAULT_DATA_ZOOM_ATTRIBUTES: {
95
97
  };
96
98
  };
97
99
  };
100
+ export declare const DEFAULT_HANDLER_ATTR_MAP: {
101
+ horizontal: {
102
+ angle: number;
103
+ strokeBoundsBuffer: number;
104
+ boundsPadding: number;
105
+ pickMode: string;
106
+ cursor: string;
107
+ };
108
+ vertical: {
109
+ angle: number;
110
+ cursor: string;
111
+ boundsPadding: number;
112
+ pickMode: string;
113
+ strokeBoundsBuffer: number;
114
+ };
115
+ };
package/es/data-zoom/config.js CHANGED
@@ -68,6 +68,7 @@ export const DEFAULT_DATA_ZOOM_ATTRIBUTES = {
68
68
  },
69
69
  startHandlerStyle: {
70
70
  visible: !0,
71
+ triggerMinSize: 40,
71
72
  symbolType: "M -0.0544 0.25 C -0.0742 0.25 -0.0901 0.234 -0.0901 0.2143 L -0.0901 -0.1786 C -0.0901 -0.1983 -0.0742 -0.2143 -0.0544 -0.2143 L -0.0187 -0.2143 L -0.0187 -0.5 L 0.017 -0.5 L 0.017 -0.2143 L 0.0527 -0.2143 C 0.0724 -0.2143 0.0884 -0.1983 0.0884 -0.1786 L 0.0884 0.2143 C 0.0884 0.234 0.0724 0.25 0.0527 0.25 L 0.017 0.25 L 0.017 0.5 L -0.0187 0.5 L -0.0187 0.25 L -0.0544 0.25 Z M -0.0187 -0.1429 L -0.0544 -0.1429 L -0.0544 0.1786 L -0.0187 0.1786 L -0.0187 -0.1429 Z M 0.0527 -0.1429 L 0.017 -0.1429 L 0.017 0.1786 L 0.0527 0.1786 L 0.0527 -0.1429 Z",
72
73
  fill: "white",
73
74
  stroke: "#B0C8F9",
@@ -75,6 +76,7 @@ export const DEFAULT_DATA_ZOOM_ATTRIBUTES = {
75
76
  },
76
77
  endHandlerStyle: {
77
78
  visible: !0,
79
+ triggerMinSize: 40,
78
80
  symbolType: "M -0.0544 0.25 C -0.0742 0.25 -0.0901 0.234 -0.0901 0.2143 L -0.0901 -0.1786 C -0.0901 -0.1983 -0.0742 -0.2143 -0.0544 -0.2143 L -0.0187 -0.2143 L -0.0187 -0.5 L 0.017 -0.5 L 0.017 -0.2143 L 0.0527 -0.2143 C 0.0724 -0.2143 0.0884 -0.1983 0.0884 -0.1786 L 0.0884 0.2143 C 0.0884 0.234 0.0724 0.25 0.0527 0.25 L 0.017 0.25 L 0.017 0.5 L -0.0187 0.5 L -0.0187 0.25 L -0.0544 0.25 Z M -0.0187 -0.1429 L -0.0544 -0.1429 L -0.0544 0.1786 L -0.0187 0.1786 L -0.0187 -0.1429 Z M 0.0527 -0.1429 L 0.017 -0.1429 L 0.017 0.1786 L 0.0527 0.1786 L 0.0527 -0.1429 Z",
79
81
  fill: "white",
80
82
  stroke: "#B0C8F9",
@@ -94,4 +96,21 @@ export const DEFAULT_DATA_ZOOM_ATTRIBUTES = {
94
96
  fill: "#6F6F6F"
95
97
  }
96
98
  }
99
+ };
100
+
101
+ export const DEFAULT_HANDLER_ATTR_MAP = {
102
+ horizontal: {
103
+ angle: 0,
104
+ strokeBoundsBuffer: 0,
105
+ boundsPadding: 2,
106
+ pickMode: "imprecise",
107
+ cursor: "ew-resize"
108
+ },
109
+ vertical: {
110
+ angle: Math.PI / 180 * 90,
111
+ cursor: "ns-resize",
112
+ boundsPadding: 2,
113
+ pickMode: "imprecise",
114
+ strokeBoundsBuffer: 0
115
+ }
97
116
  };
package/es/data-zoom/config.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/data-zoom/config.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,4BAA4B,GAAG;IAC1C,MAAM,EAAE,QAAQ;IAChB,UAAU,EAAE,MAAM;IAClB,WAAW,EAAE,IAAI;IACjB,QAAQ,EAAE,KAAK;IACf,OAAO,EAAE,CAAC;IACV,OAAO,EAAE,CAAC;IACV,SAAS,EAAE,UAAU;IACrB,SAAS,EAAE,CAAC;IACZ,QAAQ,EAAE,IAAI;IACd,eAAe,EAAE;QACf,IAAI,EAAE,OAAO;QACb,MAAM,EAAE,SAAS;QACjB,SAAS,EAAE,CAAC;QACZ,YAAY,EAAE,CAAC;KAChB;IACD,aAAa,EAAE;QACb,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,GAAG;KACjB;IACD,oBAAoB,EAAE;QACpB,IAAI,EAAE;YACJ,OAAO,EAAE,IAAI;YACb,MAAM,EAAE,SAAS;YACjB,SAAS,EAAE,CAAC;YACZ,IAAI,EAAE,SAAS;SAChB;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,IAAI;YACb,MAAM,EAAE,SAAS;YACjB,SAAS,EAAE,CAAC;SACb;KACF;IACD,uBAAuB,EAAE;QACvB,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,GAAG;KACjB;IACD,4BAA4B,EAAE;QAC5B,IAAI,EAAE;YACJ,OAAO,EAAE,IAAI;YACb,MAAM,EAAE,SAAS;YACjB,SAAS,EAAE,CAAC;YACZ,IAAI,EAAE,SAAS;SAChB;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,IAAI;YACb,MAAM,EAAE,SAAS;YACjB,SAAS,EAAE,CAAC;SACb;KACF;IACD,kBAAkB,EAAE;QAClB,OAAO,EAAE,IAAI;QACb,UAAU,EAAE;YACV,IAAI,EAAE,CAAC;YACP,KAAK,EAAE;gBACL,IAAI,EAAE,OAAO;gBACb,MAAM,EAAE,SAAS;gBACjB,YAAY,EAAE,CAAC;aAChB;SACF;QACD,IAAI,EAAE;YACJ,IAAI,EAAE,CAAC;YACP,IAAI,EAAE,OAAO;YACb,MAAM,EAAE,SAAS;YACjB,UAAU,EAER,8PAA8P;YAChQ,SAAS,EAAE,GAAG;SACf;KACF;IACD,iBAAiB,EAAE;QACjB,OAAO,EAAE,IAAI;QACb,UAAU,EAER,yiBAAyiB;QAE3iB,IAAI,EAAE,OAAO;QACb,MAAM,EAAE,SAAS;QACjB,SAAS,EAAE,GAAG;KACf;IACD,eAAe,EAAE;QACf,OAAO,EAAE,IAAI;QACb,UAAU,EAER,yiBAAyiB;QAE3iB,IAAI,EAAE,OAAO;QACb,MAAM,EAAE,SAAS;QACjB,SAAS,EAAE,GAAG;KACf;IACD,cAAc,EAAE;QACd,OAAO,EAAE,CAAC;QACV,SAAS,EAAE;YACT,QAAQ,EAAE,EAAE;YACZ,IAAI,EAAE,SAAS;SAChB;KACF;IACD,YAAY,EAAE;QACZ,OAAO,EAAE,CAAC;QACV,SAAS,EAAE;YACT,QAAQ,EAAE,EAAE;YACZ,IAAI,EAAE,SAAS;SAChB;KACF;CACF,CAAC","file":"config.js","sourcesContent":["export const DEFAULT_DATA_ZOOM_ATTRIBUTES = {\n orient: 'bottom',\n showDetail: 'auto',\n brushSelect: true,\n zoomLock: false,\n minSpan: 0,\n maxSpan: 1,\n delayType: 'throttle',\n delayTime: 0,\n realTime: true,\n backgroundStyle: {\n fill: 'white',\n stroke: '#D1DBEE',\n lineWidth: 1,\n cornerRadius: 2\n },\n dragMaskStyle: {\n fill: '#B0C8F9',\n fillOpacity: 0.2\n },\n backgroundChartStyle: {\n area: {\n visible: true,\n stroke: '#D1DBEE',\n lineWidth: 1,\n fill: '#F6F8FC'\n },\n line: {\n visible: true,\n stroke: '#D1DBEE',\n lineWidth: 1\n }\n },\n selectedBackgroundStyle: {\n fill: '#B0C8F9',\n fillOpacity: 0.5\n },\n selectedBackgroundChartStyle: {\n area: {\n visible: true,\n stroke: '#B0C8F9',\n lineWidth: 1,\n fill: '#fbb934'\n },\n line: {\n visible: true,\n stroke: '#fbb934',\n lineWidth: 1\n }\n },\n middleHandlerStyle: {\n visible: true,\n background: {\n size: 8,\n style: {\n fill: 'white',\n stroke: '#B0C8F9',\n cornerRadius: 2\n }\n },\n icon: {\n size: 6,\n fill: 'white',\n stroke: '#B0C8F9',\n symbolType:\n // eslint-disable-next-line max-len\n 'M 0.3 -0.5 C 0.41 -0.5 0.5 -0.41 0.5 -0.3 C 0.5 -0.3 0.5 0.3 0.5 0.3 C 0.5 0.41 0.41 0.5 0.3 0.5 C 0.3 0.5 -0.3 0.5 -0.3 0.5 C -0.41 0.5 -0.5 0.41 -0.5 0.3 C -0.5 0.3 -0.5 -0.3 -0.5 -0.3 C -0.5 -0.41 -0.41 -0.5 -0.3 -0.5 C -0.3 -0.5 0.3 -0.5 0.3 -0.5 Z',\n lineWidth: 0.5\n }\n },\n startHandlerStyle: {\n visible: true,\n symbolType:\n // eslint-disable-next-line max-len\n 'M -0.0544 0.25 C -0.0742 0.25 -0.0901 0.234 -0.0901 0.2143 L -0.0901 -0.1786 C -0.0901 -0.1983 -0.0742 -0.2143 -0.0544 -0.2143 L -0.0187 -0.2143 L -0.0187 -0.5 L 0.017 -0.5 L 0.017 -0.2143 L 0.0527 -0.2143 C 0.0724 -0.2143 0.0884 -0.1983 0.0884 -0.1786 L 0.0884 0.2143 C 0.0884 0.234 0.0724 0.25 0.0527 0.25 L 0.017 0.25 L 0.017 0.5 L -0.0187 0.5 L -0.0187 0.25 L -0.0544 0.25 Z M -0.0187 -0.1429 L -0.0544 -0.1429 L -0.0544 0.1786 L -0.0187 0.1786 L -0.0187 -0.1429 Z M 0.0527 -0.1429 L 0.017 -0.1429 L 0.017 0.1786 L 0.0527 0.1786 L 0.0527 -0.1429 Z',\n // size: 40,\n fill: 'white',\n stroke: '#B0C8F9',\n lineWidth: 0.5\n },\n endHandlerStyle: {\n visible: true,\n symbolType:\n // eslint-disable-next-line max-len\n 'M -0.0544 0.25 C -0.0742 0.25 -0.0901 0.234 -0.0901 0.2143 L -0.0901 -0.1786 C -0.0901 -0.1983 -0.0742 -0.2143 -0.0544 -0.2143 L -0.0187 -0.2143 L -0.0187 -0.5 L 0.017 -0.5 L 0.017 -0.2143 L 0.0527 -0.2143 C 0.0724 -0.2143 0.0884 -0.1983 0.0884 -0.1786 L 0.0884 0.2143 C 0.0884 0.234 0.0724 0.25 0.0527 0.25 L 0.017 0.25 L 0.017 0.5 L -0.0187 0.5 L -0.0187 0.25 L -0.0544 0.25 Z M -0.0187 -0.1429 L -0.0544 -0.1429 L -0.0544 0.1786 L -0.0187 0.1786 L -0.0187 -0.1429 Z M 0.0527 -0.1429 L 0.017 -0.1429 L 0.017 0.1786 L 0.0527 0.1786 L 0.0527 -0.1429 Z',\n // size: 40,\n fill: 'white',\n stroke: '#B0C8F9',\n lineWidth: 0.5\n },\n startTextStyle: {\n padding: 4,\n textStyle: {\n fontSize: 10,\n fill: '#6F6F6F'\n }\n },\n endTextStyle: {\n padding: 4,\n textStyle: {\n fontSize: 10,\n fill: '#6F6F6F'\n }\n }\n};\n"]}
1
+ {"version":3,"sources":["../src/data-zoom/config.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,4BAA4B,GAAG;IAC1C,MAAM,EAAE,QAAQ;IAChB,UAAU,EAAE,MAAM;IAClB,WAAW,EAAE,IAAI;IACjB,QAAQ,EAAE,KAAK;IACf,OAAO,EAAE,CAAC;IACV,OAAO,EAAE,CAAC;IACV,SAAS,EAAE,UAAU;IACrB,SAAS,EAAE,CAAC;IACZ,QAAQ,EAAE,IAAI;IACd,eAAe,EAAE;QACf,IAAI,EAAE,OAAO;QACb,MAAM,EAAE,SAAS;QACjB,SAAS,EAAE,CAAC;QACZ,YAAY,EAAE,CAAC;KAChB;IACD,aAAa,EAAE;QACb,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,GAAG;KACjB;IACD,oBAAoB,EAAE;QACpB,IAAI,EAAE;YACJ,OAAO,EAAE,IAAI;YACb,MAAM,EAAE,SAAS;YACjB,SAAS,EAAE,CAAC;YACZ,IAAI,EAAE,SAAS;SAChB;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,IAAI;YACb,MAAM,EAAE,SAAS;YACjB,SAAS,EAAE,CAAC;SACb;KACF;IACD,uBAAuB,EAAE;QACvB,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,GAAG;KACjB;IACD,4BAA4B,EAAE;QAC5B,IAAI,EAAE;YACJ,OAAO,EAAE,IAAI;YACb,MAAM,EAAE,SAAS;YACjB,SAAS,EAAE,CAAC;YACZ,IAAI,EAAE,SAAS;SAChB;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,IAAI;YACb,MAAM,EAAE,SAAS;YACjB,SAAS,EAAE,CAAC;SACb;KACF;IACD,kBAAkB,EAAE;QAClB,OAAO,EAAE,IAAI;QACb,UAAU,EAAE;YACV,IAAI,EAAE,CAAC;YACP,KAAK,EAAE;gBACL,IAAI,EAAE,OAAO;gBACb,MAAM,EAAE,SAAS;gBACjB,YAAY,EAAE,CAAC;aAChB;SACF;QACD,IAAI,EAAE;YACJ,IAAI,EAAE,CAAC;YACP,IAAI,EAAE,OAAO;YACb,MAAM,EAAE,SAAS;YACjB,UAAU,EAER,8PAA8P;YAChQ,SAAS,EAAE,GAAG;SACf;KACF;IACD,iBAAiB,EAAE;QACjB,OAAO,EAAE,IAAI;QACb,cAAc,EAAE,EAAE;QAClB,UAAU,EAER,yiBAAyiB;QAE3iB,IAAI,EAAE,OAAO;QACb,MAAM,EAAE,SAAS;QACjB,SAAS,EAAE,GAAG;KACf;IACD,eAAe,EAAE;QACf,OAAO,EAAE,IAAI;QACb,cAAc,EAAE,EAAE;QAClB,UAAU,EAER,yiBAAyiB;QAE3iB,IAAI,EAAE,OAAO;QACb,MAAM,EAAE,SAAS;QACjB,SAAS,EAAE,GAAG;KACf;IACD,cAAc,EAAE;QACd,OAAO,EAAE,CAAC;QACV,SAAS,EAAE;YACT,QAAQ,EAAE,EAAE;YACZ,IAAI,EAAE,SAAS;SAChB;KACF;IACD,YAAY,EAAE;QACZ,OAAO,EAAE,CAAC;QACV,SAAS,EAAE;YACT,QAAQ,EAAE,EAAE;YACZ,IAAI,EAAE,SAAS;SAChB;KACF;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,wBAAwB,GAAG;IACtC,UAAU,EAAE;QACV,KAAK,EAAE,CAAC;QACR,kBAAkB,EAAE,CAAC;QACrB,aAAa,EAAE,CAAC;QAChB,QAAQ,EAAE,WAAW;QACrB,MAAM,EAAE,WAAW;KACpB;IACD,QAAQ,EAAE;QACR,KAAK,EAAE,EAAE,GAAG,CAAC,IAAI,CAAC,EAAE,GAAG,GAAG,CAAC;QAC3B,MAAM,EAAE,WAAW;QACnB,aAAa,EAAE,CAAC;QAChB,QAAQ,EAAE,WAAW;QACrB,kBAAkB,EAAE,CAAC;KACtB;CACF,CAAC","file":"config.js","sourcesContent":["export const DEFAULT_DATA_ZOOM_ATTRIBUTES = {\n orient: 'bottom',\n showDetail: 'auto',\n brushSelect: true,\n zoomLock: false,\n minSpan: 0,\n maxSpan: 1,\n delayType: 'throttle',\n delayTime: 0,\n realTime: true,\n backgroundStyle: {\n fill: 'white',\n stroke: '#D1DBEE',\n lineWidth: 1,\n cornerRadius: 2\n },\n dragMaskStyle: {\n fill: '#B0C8F9',\n fillOpacity: 0.2\n },\n backgroundChartStyle: {\n area: {\n visible: true,\n stroke: '#D1DBEE',\n lineWidth: 1,\n fill: '#F6F8FC'\n },\n line: {\n visible: true,\n stroke: '#D1DBEE',\n lineWidth: 1\n }\n },\n selectedBackgroundStyle: {\n fill: '#B0C8F9',\n fillOpacity: 0.5\n },\n selectedBackgroundChartStyle: {\n area: {\n visible: true,\n stroke: '#B0C8F9',\n lineWidth: 1,\n fill: '#fbb934'\n },\n line: {\n visible: true,\n stroke: '#fbb934',\n lineWidth: 1\n }\n },\n middleHandlerStyle: {\n visible: true,\n background: {\n size: 8,\n style: {\n fill: 'white',\n stroke: '#B0C8F9',\n cornerRadius: 2\n }\n },\n icon: {\n size: 6,\n fill: 'white',\n stroke: '#B0C8F9',\n symbolType:\n // eslint-disable-next-line max-len\n 'M 0.3 -0.5 C 0.41 -0.5 0.5 -0.41 0.5 -0.3 C 0.5 -0.3 0.5 0.3 0.5 0.3 C 0.5 0.41 0.41 0.5 0.3 0.5 C 0.3 0.5 -0.3 0.5 -0.3 0.5 C -0.41 0.5 -0.5 0.41 -0.5 0.3 C -0.5 0.3 -0.5 -0.3 -0.5 -0.3 C -0.5 -0.41 -0.41 -0.5 -0.3 -0.5 C -0.3 -0.5 0.3 -0.5 0.3 -0.5 Z',\n lineWidth: 0.5\n }\n },\n startHandlerStyle: {\n visible: true,\n triggerMinSize: 40,\n symbolType:\n // eslint-disable-next-line max-len\n 'M -0.0544 0.25 C -0.0742 0.25 -0.0901 0.234 -0.0901 0.2143 L -0.0901 -0.1786 C -0.0901 -0.1983 -0.0742 -0.2143 -0.0544 -0.2143 L -0.0187 -0.2143 L -0.0187 -0.5 L 0.017 -0.5 L 0.017 -0.2143 L 0.0527 -0.2143 C 0.0724 -0.2143 0.0884 -0.1983 0.0884 -0.1786 L 0.0884 0.2143 C 0.0884 0.234 0.0724 0.25 0.0527 0.25 L 0.017 0.25 L 0.017 0.5 L -0.0187 0.5 L -0.0187 0.25 L -0.0544 0.25 Z M -0.0187 -0.1429 L -0.0544 -0.1429 L -0.0544 0.1786 L -0.0187 0.1786 L -0.0187 -0.1429 Z M 0.0527 -0.1429 L 0.017 -0.1429 L 0.017 0.1786 L 0.0527 0.1786 L 0.0527 -0.1429 Z',\n // size: 40,\n fill: 'white',\n stroke: '#B0C8F9',\n lineWidth: 0.5\n },\n endHandlerStyle: {\n visible: true,\n triggerMinSize: 40,\n symbolType:\n // eslint-disable-next-line max-len\n 'M -0.0544 0.25 C -0.0742 0.25 -0.0901 0.234 -0.0901 0.2143 L -0.0901 -0.1786 C -0.0901 -0.1983 -0.0742 -0.2143 -0.0544 -0.2143 L -0.0187 -0.2143 L -0.0187 -0.5 L 0.017 -0.5 L 0.017 -0.2143 L 0.0527 -0.2143 C 0.0724 -0.2143 0.0884 -0.1983 0.0884 -0.1786 L 0.0884 0.2143 C 0.0884 0.234 0.0724 0.25 0.0527 0.25 L 0.017 0.25 L 0.017 0.5 L -0.0187 0.5 L -0.0187 0.25 L -0.0544 0.25 Z M -0.0187 -0.1429 L -0.0544 -0.1429 L -0.0544 0.1786 L -0.0187 0.1786 L -0.0187 -0.1429 Z M 0.0527 -0.1429 L 0.017 -0.1429 L 0.017 0.1786 L 0.0527 0.1786 L 0.0527 -0.1429 Z',\n // size: 40,\n fill: 'white',\n stroke: '#B0C8F9',\n lineWidth: 0.5\n },\n startTextStyle: {\n padding: 4,\n textStyle: {\n fontSize: 10,\n fill: '#6F6F6F'\n }\n },\n endTextStyle: {\n padding: 4,\n textStyle: {\n fontSize: 10,\n fill: '#6F6F6F'\n }\n }\n};\n\nexport const DEFAULT_HANDLER_ATTR_MAP = {\n horizontal: {\n angle: 0,\n strokeBoundsBuffer: 0,\n boundsPadding: 2,\n pickMode: 'imprecise',\n cursor: 'ew-resize'\n },\n vertical: {\n angle: 90 * (Math.PI / 180),\n cursor: 'ns-resize',\n boundsPadding: 2,\n pickMode: 'imprecise',\n strokeBoundsBuffer: 0\n }\n};\n"]}
package/es/data-zoom/data-zoom.d.ts CHANGED
@@ -78,6 +78,7 @@ export declare class DataZoom extends AbstractComponent<Required<DataZoomAttribu
78
78
  };
79
79
  startHandlerStyle: {
80
80
  visible: boolean;
81
+ triggerMinSize: number;
81
82
  symbolType: string;
82
83
  fill: string;
83
84
  stroke: string;
@@ -85,6 +86,7 @@ export declare class DataZoom extends AbstractComponent<Required<DataZoomAttribu
85
86
  };
86
87
  endHandlerStyle: {
87
88
  visible: boolean;
89
+ triggerMinSize: number;
88
90
  symbolType: string;
89
91
  fill: string;
90
92
  stroke: string;
@@ -108,9 +110,11 @@ export declare class DataZoom extends AbstractComponent<Required<DataZoomAttribu
108
110
  private _isHorizontal;
109
111
  private _background;
110
112
  private _container;
113
+ private _startHandlerMask;
111
114
  private _startHandler;
112
115
  private _middleHandlerSymbol;
113
116
  private _middleHandlerRect;
117
+ private _endHandlerMask;
114
118
  private _endHandler;
115
119
  private _selectedBackground;
116
120
  private _dragMask;
package/es/data-zoom/data-zoom.js CHANGED
@@ -16,7 +16,7 @@ import { AbstractComponent } from "../core/base";
16
16
 
17
17
  import { Tag } from "../tag";
18
18
 
19
- import { DEFAULT_DATA_ZOOM_ATTRIBUTES } from "./config";
19
+ import { DEFAULT_DATA_ZOOM_ATTRIBUTES, DEFAULT_HANDLER_ATTR_MAP } from "./config";
20
20
 
21
21
  import { DataZoomActiveTag } from "./type";
22
22
 
@@ -50,8 +50,8 @@ export class DataZoom extends AbstractComponent {
50
50
  end: 1
51
51
  }, this._statePointToData = state => state, this._onHandlerPointerDown = (e, tag) => {
52
52
  e.stopPropagation(), "start" === tag ? (this._activeTag = DataZoomActiveTag.startHandler,
53
- this._activeItem = this._startHandler) : "end" === tag ? (this._activeTag = DataZoomActiveTag.endHandler,
54
- this._activeItem = this._endHandler) : "middleRect" === tag ? (this._activeTag = DataZoomActiveTag.middleHandler,
53
+ this._activeItem = this._startHandlerMask) : "end" === tag ? (this._activeTag = DataZoomActiveTag.endHandler,
54
+ this._activeItem = this._endHandlerMask) : "middleRect" === tag ? (this._activeTag = DataZoomActiveTag.middleHandler,
55
55
  this._activeItem = this._middleHandlerRect) : "middleSymbol" === tag ? (this._activeTag = DataZoomActiveTag.middleHandler,
56
56
  this._activeItem = this._middleHandlerSymbol) : "background" === tag && (this._activeTag = DataZoomActiveTag.background,
57
57
  this._activeItem = this._background), this._activeState = !0, this._activeCache.startPos = this.eventPosToStagePos(e),
@@ -88,8 +88,8 @@ export class DataZoom extends AbstractComponent {
88
88
  bindEvents() {
89
89
  if (this.attribute.disableTriggerEvent) return;
90
90
  const {showDetail: showDetail, brushSelect: brushSelect} = this.attribute;
91
- this._startHandler && this._startHandler.addEventListener("pointerdown", (e => this._onHandlerPointerDown(e, "start"))),
92
- this._endHandler && this._endHandler.addEventListener("pointerdown", (e => this._onHandlerPointerDown(e, "end"))),
91
+ this._startHandlerMask && this._startHandlerMask.addEventListener("pointerdown", (e => this._onHandlerPointerDown(e, "start"))),
92
+ this._endHandlerMask && this._endHandlerMask.addEventListener("pointerdown", (e => this._onHandlerPointerDown(e, "end"))),
93
93
  this._middleHandlerSymbol && this._middleHandlerSymbol.addEventListener("pointerdown", (e => this._onHandlerPointerDown(e, "middleSymbol"))),
94
94
  this._middleHandlerRect && this._middleHandlerRect.addEventListener("pointerdown", (e => this._onHandlerPointerDown(e, "middleRect")));
95
95
  const selectedTag = brushSelect ? "background" : "middleRect";
@@ -247,17 +247,17 @@ export class DataZoom extends AbstractComponent {
247
247
  }, this._layoutAttrFromConfig;
248
248
  }
249
249
  render() {
250
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
250
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
251
251
  this._layoutAttrFromConfig = null;
252
- const {orient: orient, backgroundStyle: backgroundStyle, backgroundChartStyle: backgroundChartStyle, selectedBackgroundStyle: selectedBackgroundStyle, selectedBackgroundChartStyle: selectedBackgroundChartStyle, middleHandlerStyle: middleHandlerStyle, startHandlerStyle: startHandlerStyle, endHandlerStyle: endHandlerStyle, brushSelect: brushSelect} = this.attribute, {start: start, end: end} = this.state, {position: position, width: width, height: height} = this.getLayoutAttrFromConfig(), group = this.createOrUpdateChild("dataZoom-container", {}, "group");
253
- this._container = group, this._background = group.createOrUpdateChild("background", Object.assign({
252
+ const {orient: orient, backgroundStyle: backgroundStyle, backgroundChartStyle: backgroundChartStyle, selectedBackgroundStyle: selectedBackgroundStyle, selectedBackgroundChartStyle: selectedBackgroundChartStyle, middleHandlerStyle: middleHandlerStyle, startHandlerStyle: startHandlerStyle, endHandlerStyle: endHandlerStyle, brushSelect: brushSelect} = this.attribute, {start: start, end: end} = this.state, {position: position, width: width, height: height} = this.getLayoutAttrFromConfig(), startHandlerMinSize = null !== (_a = startHandlerStyle.triggerMinSize) && void 0 !== _a ? _a : 40, endHandlerMinSize = null !== (_b = endHandlerStyle.triggerMinSize) && void 0 !== _b ? _b : 40, group = this.createOrUpdateChild("dataZoom-container", {}, "group");
253
+ if (this._container = group, this._background = group.createOrUpdateChild("background", Object.assign({
254
254
  x: position.x,
255
255
  y: position.y,
256
256
  width: width,
257
257
  height: height,
258
258
  cursor: brushSelect ? "crosshair" : "auto"
259
- }, backgroundStyle), "rect"), (null === (_a = null == backgroundChartStyle ? void 0 : backgroundChartStyle.line) || void 0 === _a ? void 0 : _a.visible) && this.setPreviewAttributes("line", group),
260
- (null === (_b = null == backgroundChartStyle ? void 0 : backgroundChartStyle.area) || void 0 === _b ? void 0 : _b.visible) && this.setPreviewAttributes("area", group),
259
+ }, backgroundStyle), "rect"), (null === (_c = null == backgroundChartStyle ? void 0 : backgroundChartStyle.line) || void 0 === _c ? void 0 : _c.visible) && this.setPreviewAttributes("line", group),
260
+ (null === (_d = null == backgroundChartStyle ? void 0 : backgroundChartStyle.area) || void 0 === _d ? void 0 : _d.visible) && this.setPreviewAttributes("area", group),
261
261
  brushSelect && this.renderDragMask(), this._isHorizontal ? this._selectedBackground = group.createOrUpdateChild("selectedBackground", Object.assign({
262
262
  x: position.x + start * width,
263
263
  y: position.y,
@@ -270,73 +270,91 @@ export class DataZoom extends AbstractComponent {
270
270
  width: width,
271
271
  height: (end - start) * height,
272
272
  cursor: brushSelect ? "crosshair" : "move"
273
- }, selectedBackgroundStyle), "rect"), (null === (_c = null == selectedBackgroundChartStyle ? void 0 : selectedBackgroundChartStyle.line) || void 0 === _c ? void 0 : _c.visible) && this.setSelectedPreviewAttributes("line", group),
274
- (null === (_d = null == selectedBackgroundChartStyle ? void 0 : selectedBackgroundChartStyle.area) || void 0 === _d ? void 0 : _d.visible) && this.setSelectedPreviewAttributes("area", group),
275
- this._showText && this.renderText(), this._isHorizontal ? (this._startHandler = group.createOrUpdateChild("startHandler", Object.assign({
276
- x: position.x + start * width,
277
- y: position.y + height / 2,
278
- size: height,
279
- angle: 0,
280
- symbolType: null !== (_e = null == startHandlerStyle ? void 0 : startHandlerStyle.symbolType) && void 0 !== _e ? _e : "square",
281
- cursor: "ew-resize",
282
- strokeBoundsBuffer: 0,
283
- boundsPadding: 2,
284
- pickMode: "imprecise"
285
- }, startHandlerStyle), "symbol"), this._endHandler = group.createOrUpdateChild("endHandler", Object.assign({
286
- x: position.x + end * width,
287
- y: position.y + height / 2,
288
- size: height,
289
- angle: 0,
290
- symbolType: null !== (_f = null == endHandlerStyle ? void 0 : endHandlerStyle.symbolType) && void 0 !== _f ? _f : "square",
291
- cursor: "ew-resize",
292
- strokeBoundsBuffer: 0,
293
- boundsPadding: 2,
294
- pickMode: "imprecise"
295
- }, endHandlerStyle), "symbol"), (null == middleHandlerStyle ? void 0 : middleHandlerStyle.visible) && (this._middleHandlerRect = group.createOrUpdateChild("middleHandlerRect", Object.assign({
296
- x: position.x + start * width,
297
- y: position.y - ((null === (_g = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _g ? void 0 : _g.size) || 10),
298
- width: (end - start) * width,
299
- height: (null === (_h = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _h ? void 0 : _h.size) || 10
300
- }, null === (_j = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _j ? void 0 : _j.style), "rect"),
301
- this._middleHandlerSymbol = group.createOrUpdateChild("middleHandlerSymbol", Object.assign({
302
- x: position.x + (start + end) / 2 * width,
303
- y: position.y - ((null === (_k = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _k ? void 0 : _k.size) || 10) / 2,
304
- strokeBoundsBuffer: 0,
305
- angle: 0,
306
- symbolType: null !== (_m = null === (_l = null == middleHandlerStyle ? void 0 : middleHandlerStyle.icon) || void 0 === _l ? void 0 : _l.symbolType) && void 0 !== _m ? _m : "square"
307
- }, null == middleHandlerStyle ? void 0 : middleHandlerStyle.icon), "symbol"))) : (this._startHandler = group.createOrUpdateChild("startHandler", Object.assign({
308
- x: position.x + width / 2,
309
- y: position.y + start * height,
310
- size: width,
311
- angle: Math.PI / 180 * 90,
312
- symbolType: null !== (_o = null == startHandlerStyle ? void 0 : startHandlerStyle.symbolType) && void 0 !== _o ? _o : "square",
313
- cursor: "ns-resize",
314
- boundsPadding: 2,
315
- pickMode: "imprecise",
316
- strokeBoundsBuffer: 0
317
- }, startHandlerStyle), "symbol"), (null == middleHandlerStyle ? void 0 : middleHandlerStyle.visible) && (this._middleHandlerRect = group.createOrUpdateChild("middleHandlerRect", Object.assign({
318
- x: "left" === orient ? position.x - ((null === (_p = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _p ? void 0 : _p.size) || 10) : position.x + width,
319
- y: position.y + start * height,
320
- width: (null === (_q = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _q ? void 0 : _q.size) || 10,
321
- height: (end - start) * height
322
- }, null === (_r = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _r ? void 0 : _r.style), "rect"),
323
- this._middleHandlerSymbol = group.createOrUpdateChild("middleHandlerSymbol", Object.assign({
324
- x: "left" === orient ? position.x - ((null === (_s = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _s ? void 0 : _s.size) || 10) / 2 : position.x + width + ((null === (_t = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _t ? void 0 : _t.size) || 10) / 2,
325
- y: position.y + (start + end) / 2 * height,
326
- angle: Math.PI / 180 * 90,
327
- symbolType: null !== (_v = null === (_u = null == middleHandlerStyle ? void 0 : middleHandlerStyle.icon) || void 0 === _u ? void 0 : _u.symbolType) && void 0 !== _v ? _v : "square",
328
- strokeBoundsBuffer: 0
329
- }, null == middleHandlerStyle ? void 0 : middleHandlerStyle.icon), "symbol")), this._endHandler = group.createOrUpdateChild("endHandler", Object.assign({
330
- x: position.x + width / 2,
331
- y: position.y + end * height,
332
- size: width,
333
- angle: Math.PI / 180 * 90,
334
- symbolType: null !== (_w = null == endHandlerStyle ? void 0 : endHandlerStyle.symbolType) && void 0 !== _w ? _w : "square",
335
- cursor: "ns-resize",
336
- boundsPadding: 2,
337
- pickMode: "imprecise",
338
- strokeBoundsBuffer: 0
339
- }, endHandlerStyle), "symbol"));
273
+ }, selectedBackgroundStyle), "rect"), (null === (_e = null == selectedBackgroundChartStyle ? void 0 : selectedBackgroundChartStyle.line) || void 0 === _e ? void 0 : _e.visible) && this.setSelectedPreviewAttributes("line", group),
274
+ (null === (_f = null == selectedBackgroundChartStyle ? void 0 : selectedBackgroundChartStyle.area) || void 0 === _f ? void 0 : _f.visible) && this.setSelectedPreviewAttributes("area", group),
275
+ this._showText && this.renderText(), this._isHorizontal) {
276
+ this._startHandler = group.createOrUpdateChild("startHandler", Object.assign(Object.assign({
277
+ x: position.x + start * width,
278
+ y: position.y + height / 2,
279
+ size: height,
280
+ symbolType: null !== (_g = null == startHandlerStyle ? void 0 : startHandlerStyle.symbolType) && void 0 !== _g ? _g : "square"
281
+ }, DEFAULT_HANDLER_ATTR_MAP.horizontal), startHandlerStyle), "symbol"), this._endHandler = group.createOrUpdateChild("endHandler", Object.assign(Object.assign({
282
+ x: position.x + end * width,
283
+ y: position.y + height / 2,
284
+ size: height,
285
+ symbolType: null !== (_h = null == endHandlerStyle ? void 0 : endHandlerStyle.symbolType) && void 0 !== _h ? _h : "square"
286
+ }, DEFAULT_HANDLER_ATTR_MAP.horizontal), endHandlerStyle), "symbol");
287
+ const startHandlerWidth = Math.max(this._startHandler.AABBBounds.width(), startHandlerMinSize), startHandlerHeight = Math.max(this._startHandler.AABBBounds.height(), startHandlerMinSize), endHandlerWidth = Math.max(this._endHandler.AABBBounds.width(), endHandlerMinSize), endHandlerHeight = Math.max(this._endHandler.AABBBounds.height(), endHandlerMinSize);
288
+ this._startHandlerMask = group.createOrUpdateChild("startHandlerMask", Object.assign({
289
+ x: position.x + start * width - startHandlerWidth / 2,
290
+ y: position.y + height / 2 - startHandlerHeight / 2,
291
+ width: startHandlerWidth,
292
+ height: startHandlerHeight,
293
+ fill: "white",
294
+ fillOpacity: 0
295
+ }, DEFAULT_HANDLER_ATTR_MAP.horizontal), "rect"), this._endHandlerMask = group.createOrUpdateChild("endHandlerMask", Object.assign({
296
+ x: position.x + end * width - endHandlerWidth / 2,
297
+ y: position.y + height / 2 - endHandlerHeight / 2,
298
+ width: endHandlerWidth,
299
+ height: endHandlerHeight,
300
+ fill: "white",
301
+ fillOpacity: 0
302
+ }, DEFAULT_HANDLER_ATTR_MAP.horizontal), "rect"), (null == middleHandlerStyle ? void 0 : middleHandlerStyle.visible) && (this._middleHandlerRect = group.createOrUpdateChild("middleHandlerRect", Object.assign({
303
+ x: position.x + start * width,
304
+ y: position.y - ((null === (_j = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _j ? void 0 : _j.size) || 10),
305
+ width: (end - start) * width,
306
+ height: (null === (_k = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _k ? void 0 : _k.size) || 10
307
+ }, null === (_l = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _l ? void 0 : _l.style), "rect"),
308
+ this._middleHandlerSymbol = group.createOrUpdateChild("middleHandlerSymbol", Object.assign({
309
+ x: position.x + (start + end) / 2 * width,
310
+ y: position.y - ((null === (_m = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _m ? void 0 : _m.size) || 10) / 2,
311
+ strokeBoundsBuffer: 0,
312
+ angle: 0,
313
+ symbolType: null !== (_p = null === (_o = null == middleHandlerStyle ? void 0 : middleHandlerStyle.icon) || void 0 === _o ? void 0 : _o.symbolType) && void 0 !== _p ? _p : "square"
314
+ }, null == middleHandlerStyle ? void 0 : middleHandlerStyle.icon), "symbol"));
315
+ } else {
316
+ this._startHandler = group.createOrUpdateChild("startHandler", Object.assign(Object.assign({
317
+ x: position.x + width / 2,
318
+ y: position.y + start * height,
319
+ size: width,
320
+ symbolType: null !== (_q = null == startHandlerStyle ? void 0 : startHandlerStyle.symbolType) && void 0 !== _q ? _q : "square"
321
+ }, DEFAULT_HANDLER_ATTR_MAP.vertical), startHandlerStyle), "symbol"), this._endHandler = group.createOrUpdateChild("endHandler", Object.assign(Object.assign({
322
+ x: position.x + width / 2,
323
+ y: position.y + end * height,
324
+ size: width,
325
+ symbolType: null !== (_r = null == endHandlerStyle ? void 0 : endHandlerStyle.symbolType) && void 0 !== _r ? _r : "square"
326
+ }, DEFAULT_HANDLER_ATTR_MAP.vertical), endHandlerStyle), "symbol");
327
+ const startHandlerWidth = Math.max(this._startHandler.AABBBounds.width(), startHandlerMinSize), startHandlerHeight = Math.max(this._startHandler.AABBBounds.height(), startHandlerMinSize), endHandlerWidth = Math.max(this._endHandler.AABBBounds.width(), endHandlerMinSize), endHandlerHeight = Math.max(this._endHandler.AABBBounds.height(), endHandlerMinSize);
328
+ this._startHandlerMask = group.createOrUpdateChild("startHandlerMask", Object.assign({
329
+ x: position.x + width / 2 - startHandlerWidth / 2,
330
+ y: position.y + start * height - startHandlerHeight / 2,
331
+ width: startHandlerWidth,
332
+ height: startHandlerHeight,
333
+ symbolType: "rect",
334
+ fill: "white",
335
+ fillOpacity: 0
336
+ }, DEFAULT_HANDLER_ATTR_MAP.vertical), "symbol"), this._endHandlerMask = group.createOrUpdateChild("endHandlerMask", Object.assign({
337
+ x: position.x + width / 2 - endHandlerWidth / 2,
338
+ y: position.y + end * height - endHandlerHeight / 2,
339
+ width: endHandlerWidth,
340
+ height: endHandlerHeight,
341
+ symbolType: "rect",
342
+ fill: "white",
343
+ fillOpacity: 0
344
+ }, DEFAULT_HANDLER_ATTR_MAP.vertical), "symbol"), (null == middleHandlerStyle ? void 0 : middleHandlerStyle.visible) && (this._middleHandlerRect = group.createOrUpdateChild("middleHandlerRect", Object.assign({
345
+ x: "left" === orient ? position.x - ((null === (_s = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _s ? void 0 : _s.size) || 10) : position.x + width,
346
+ y: position.y + start * height,
347
+ width: (null === (_t = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _t ? void 0 : _t.size) || 10,
348
+ height: (end - start) * height
349
+ }, null === (_u = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _u ? void 0 : _u.style), "rect"),
350
+ this._middleHandlerSymbol = group.createOrUpdateChild("middleHandlerSymbol", Object.assign({
351
+ x: "left" === orient ? position.x - ((null === (_v = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _v ? void 0 : _v.size) || 10) / 2 : position.x + width + ((null === (_w = null == middleHandlerStyle ? void 0 : middleHandlerStyle.background) || void 0 === _w ? void 0 : _w.size) || 10) / 2,
352
+ y: position.y + (start + end) / 2 * height,
353
+ angle: Math.PI / 180 * 90,
354
+ symbolType: null !== (_y = null === (_x = null == middleHandlerStyle ? void 0 : middleHandlerStyle.icon) || void 0 === _x ? void 0 : _x.symbolType) && void 0 !== _y ? _y : "square",
355
+ strokeBoundsBuffer: 0
356
+ }, null == middleHandlerStyle ? void 0 : middleHandlerStyle.icon), "symbol"));
357
+ }
340
358
  }
341
359
  computeBasePoints() {
342
360
  const {orient: orient} = this.attribute, {position: position, width: width, height: height} = this.getLayoutAttrFromConfig();