@easyv/charts 1.10.11 → 1.10.13

package/lib/components/Axis.js

@@ -281,6 +281,7 @@ var Label = function Label(_ref5) {
       position: "relative",
       // 替换 absolute
       cursor: "pointer",
+      display: !adaptive ? "inline-block" : "block",
       transform: "translate(".concat(x + (isIOS ? iosX : 0), "px, ").concat(y + (isIOS ? iosY : 0), "px)") // 用 transform 定位
     })
   }, !adaptive ? /*#__PURE__*/_react["default"].createElement(_TextOverflow["default"], {

package/lib/components/ChartContainer.js

@@ -43,7 +43,7 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(/*#__PURE__*/(
     onMouseMove: onMouseMove,
     ref: ref,
     style: _objectSpread({
-      overflow: "hidden",
+      overflow: "visible",
       position: "absolute",
       width: width,
       height: height

package/lib/components/PieChart.js

@@ -605,10 +605,21 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
     },
     arcs: _arcs,
     judge: judgeData
-  }))), tooltip && mousePos && mousePos.x != 0 && mousePos.y != 0 && tooltip.manual && /*#__PURE__*/_react["default"].createElement("div", {
+  }))), /*#__PURE__*/_react["default"].createElement(_.Legend, (0, _extends2["default"])({}, legend, {
+    height: chartHeight,
+    columnsSeries: columnsSeries,
+    data: data,
+    series: _arcs.map(function (arc) {
+      return _objectSpread(_objectSpread({}, arc), {}, {
+        percent: arc.percent.toFixed(legendPrecision)
+      });
+    }),
+    pieClick: onClick,
+    formatter: formatter,
+    judge: judgeData
+  })), tooltip && mousePos && mousePos.x != 0 && mousePos.y != 0 && tooltip.manual && /*#__PURE__*/_react["default"].createElement("div", {
     style: {
       position: "absolute",
-      zIndex: 9999,
       pointerEvents: "none"
     }
   }, /*#__PURE__*/_react["default"].createElement(_PieTooltip.PieTooltip, {
@@ -621,18 +632,6 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
       y: maxRadius + marginTop
     },
     mousePos: mousePos
-  })), /*#__PURE__*/_react["default"].createElement(_.Legend, (0, _extends2["default"])({}, legend, {
-    height: chartHeight,
-    columnsSeries: columnsSeries,
-    data: data,
-    series: _arcs.map(function (arc) {
-      return _objectSpread(_objectSpread({}, arc), {}, {
-        percent: arc.percent.toFixed(legendPrecision)
-      });
-    }),
-    pieClick: onClick,
-    formatter: formatter,
-    judge: judgeData
   }))) : /*#__PURE__*/_react["default"].createElement("div", {
     ref: domRef
   }, /*#__PURE__*/_react["default"].createElement(_.ChartContainer, {
@@ -776,10 +775,21 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
     config: decorate,
     arcs: _arcs,
     radius: radius
-  }), tooltip && mousePos && mousePos.x != 0 && mousePos.y != 0 && tooltip.manual && /*#__PURE__*/_react["default"].createElement("div", {
+  }), /*#__PURE__*/_react["default"].createElement(_.Legend, (0, _extends2["default"])({}, legend, {
+    height: chartHeight,
+    data: data,
+    columnsSeries: columnsSeries,
+    series: _arcs.map(function (arc) {
+      return _objectSpread(_objectSpread({}, arc), {}, {
+        percent: arc.percent.toFixed(legendPrecision)
+      });
+    }),
+    pieClick: onClick,
+    formatter: formatter,
+    judge: judgeData
+  })), tooltip && mousePos && mousePos.x != 0 && mousePos.y != 0 && tooltip.manual && /*#__PURE__*/_react["default"].createElement("div", {
     style: {
       position: "absolute",
-      zIndex: 9999,
       pointerEvents: "none"
     }
   }, /*#__PURE__*/_react["default"].createElement(_PieTooltip.PieTooltip, {
@@ -792,18 +802,6 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
       y: maxRadius + marginTop
     },
     mousePos: mousePos
-  })), /*#__PURE__*/_react["default"].createElement(_.Legend, (0, _extends2["default"])({}, legend, {
-    height: chartHeight,
-    data: data,
-    columnsSeries: columnsSeries,
-    series: _arcs.map(function (arc) {
-      return _objectSpread(_objectSpread({}, arc), {}, {
-        percent: arc.percent.toFixed(legendPrecision)
-      });
-    }),
-    pieClick: onClick,
-    formatter: formatter,
-    judge: judgeData
   })));
 });
 var Current = function Current(_ref9) {

package/lib/components/Tooltip.js

@@ -99,8 +99,7 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(function (_ref
     }, (0, _utils.getFontStyle)(font)), {}, {
       width: "fit-content",
       maxWidth: "none",
-      overflow: "visible",
-      zIndex: 9999
+      overflow: "visible"
     })
   }, formatter ? formatter({
     series: series,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@easyv/charts",
-  "version": "1.10.11",
+  "version": "1.10.13",
   "description": "",
   "main": "lib/index.js",
   "scripts": {

package/src/components/Axis.tsx

@@ -32,7 +32,7 @@ const getCanvasContext = (): CanvasRenderingContext2D => {
 export const calculateTextWidth = (
   text: string,
   fontConfig: any,
-  isVertical: any
+  isVertical: any,
 ): number => {
   if (!text) return 0;
   const ctx = getCanvasContext();
@@ -82,14 +82,14 @@ const defaultOrientation = "bottom";
 const defaultTickSize = 6;
 const defaultFormatter: (
   d: string,
-  { suffix }: { suffix: string }
+  { suffix }: { suffix: string },
 ) => string = (d, { suffix }) => d + suffix;
 
 const getAxesPath: (
   orientation: Orientation,
   { width, height }: Context,
   cHeight: number,
-  cPercent: number
+  cPercent: number,
 ) => string = (orientation, { width, height }, cHeight, cPercent) => {
   switch (orientation) {
     case "top":
@@ -112,7 +112,7 @@ const getAxesPath: (
  */
 const getLayout: (
   orientation: Orientation,
-  rotate: number
+  rotate: number,
 ) => {
   transform: string;
   directionX: number;
@@ -253,7 +253,7 @@ function maxLabelFT(
   config: any,
   formatter: any,
   font: any,
-  isVertical: any
+  isVertical: any,
 ) {
   let max = 0;
   data.length
@@ -265,7 +265,7 @@ function maxLabelFT(
               format: { type: config.format, showType: config.showType },
             }),
             font,
-            isVertical
+            isVertical,
           ) > max
         )
           max = calculateTextWidth(
@@ -274,14 +274,14 @@ function maxLabelFT(
               format: { type: config.format, showType: config.showType },
             }),
             font,
-            isVertical
+            isVertical,
           );
       })
     : "";
   return max;
 }
 const Label: (
-  props: LabelType
+  props: LabelType,
 ) => ReactComponentElement<ComponentType> | null = ({
   className,
   orientation = defaultOrientation,
@@ -311,7 +311,7 @@ const Label: (
   });
   const { transform, directionX, directionY } = getLayout(
     orientation,
-    adaptive ? 0 : rotate
+    adaptive ? 0 : rotate,
   );
   const isVertical = orientation == "left" || orientation == "right";
 
@@ -339,6 +339,7 @@ const Label: (
           ...getFontStyle(font),
           position: "relative", // 替换 absolute
           cursor: "pointer",
+          display: !adaptive ? "inline-block" : "block",
           transform: `translate(${x + (isIOS ? iosX : 0)}px, ${
             y + (isIOS ? iosY : 0)
           }px)`, // 用 transform 定位
@@ -358,8 +359,8 @@ const Label: (
                 textAlign == "left"
                   ? "flex-start"
                   : textAlign == "right"
-                  ? "flex-end"
-                  : "center",
+                    ? "flex-end"
+                    : "center",
             }}
           ></TextOverflow>
         ) : (
@@ -409,7 +410,7 @@ export default memo(
         rawTicks,
         paddingOuter,
       }: any,
-      ref
+      ref,
     ) => {
       const { width, height, isIOS } = useContext(chartContext);
       const { cHeight, isC, cPercent } = controlInfo;
@@ -426,13 +427,13 @@ export default memo(
             label,
             formatter,
             label.font,
-            isVertical
+            isVertical,
           );
         }
       }
       const LabelNum = !isVertical
         ? Math.floor(
-            ((width / (isC ? cPercent : 1)) * (1 - paddingOuter)) / LabelWidth
+            ((width / (isC ? cPercent : 1)) * (1 - paddingOuter)) / LabelWidth,
           )
         : Math.floor(height / LabelWidth);
 
@@ -445,7 +446,7 @@ export default memo(
                 ? Math.ceil(allTicks.length / 2)
                 : LabelNum
               : allTicks.length,
-            label.showLast
+            label.showLast,
           );
       if (!(on && ticks.length > 0)) return null;
 
@@ -453,7 +454,7 @@ export default memo(
       function getEvenlySpacedElements(
         arr: any[],
         expectCount: number,
-        acc: boolean = false
+        acc: boolean = false,
       ): any[] {
         if (!arr.length || expectCount <= 0) return [];
         if (expectCount >= arr.length) return [...arr];
@@ -732,6 +733,6 @@ export default memo(
           </svg>
         </g>
       );
-    }
-  )
+    },
+  ),
 );

package/src/components/ChartContainer.tsx

@@ -54,7 +54,7 @@ export default memo(
           onMouseMove={onMouseMove}
           ref={ref}
           style={{
-            overflow: "hidden",
+            overflow: "visible",
             position: "absolute",
             width,
             height,

package/src/components/PieChart.js

@@ -622,6 +622,20 @@ const Component = memo(
             )}
           </g>
         </ChartContainer>
+
+        <Legend
+          {...legend}
+          height={chartHeight}
+          columnsSeries={columnsSeries}
+          data={data}
+          series={_arcs.map((arc) => ({
+            ...arc,
+            percent: arc.percent.toFixed(legendPrecision),
+          }))}
+          pieClick={onClick}
+          formatter={formatter}
+          judge={judgeData}
+        />
         {tooltip &&
           mousePos &&
           mousePos.x != 0 &&
@@ -630,7 +644,6 @@ const Component = memo(
             <div
               style={{
                 position: "absolute",
-                zIndex: 9999,
                 pointerEvents: "none",
               }}
             >
@@ -647,19 +660,6 @@ const Component = memo(
               />
             </div>
           )}
-        <Legend
-          {...legend}
-          height={chartHeight}
-          columnsSeries={columnsSeries}
-          data={data}
-          series={_arcs.map((arc) => ({
-            ...arc,
-            percent: arc.percent.toFixed(legendPrecision),
-          }))}
-          pieClick={onClick}
-          formatter={formatter}
-          judge={judgeData}
-        />
       </div>
     ) : (
       <div ref={domRef}>
@@ -893,6 +893,20 @@ const Component = memo(
             radius={radius}
           />
         )}
+
+        <Legend
+          {...legend}
+          height={chartHeight}
+          data={data}
+          columnsSeries={columnsSeries}
+          series={_arcs.map((arc) => ({
+            ...arc,
+            percent: arc.percent.toFixed(legendPrecision),
+          }))}
+          pieClick={onClick}
+          formatter={formatter}
+          judge={judgeData}
+        />
         {tooltip &&
           mousePos &&
           mousePos.x != 0 &&
@@ -901,7 +915,6 @@ const Component = memo(
             <div
               style={{
                 position: "absolute",
-                zIndex: 9999,
                 pointerEvents: "none",
               }}
             >
@@ -918,19 +931,6 @@ const Component = memo(
               />
             </div>
           )}
-        <Legend
-          {...legend}
-          height={chartHeight}
-          data={data}
-          columnsSeries={columnsSeries}
-          series={_arcs.map((arc) => ({
-            ...arc,
-            percent: arc.percent.toFixed(legendPrecision),
-          }))}
-          pieClick={onClick}
-          formatter={formatter}
-          judge={judgeData}
-        />
       </div>
     );
   },

package/src/components/Tooltip.js

@@ -114,7 +114,6 @@ export default memo(
           width: "fit-content",
           maxWidth: "none",
           overflow: "visible",
-          zIndex: 9999,
         }}
       >
         {formatter ? (