@easyv/charts 1.9.21 → 1.9.23

package/lib/components/Axis.js

@@ -227,7 +227,7 @@ var Label = function Label(_ref5) {
     events = _ref5$events === void 0 ? defaultEvent : _ref5$events,
     _ref5$config = _ref5.config,
     show = _ref5$config.show,
-    labelNum = _ref5$config.labelNum,
+    adaptive = _ref5$config.adaptive,
     style = _ref5$config.style,
     _ref5$config$translat = _ref5$config.translate,
     translateX = _ref5$config$translat.x,
@@ -264,7 +264,7 @@ var Label = function Label(_ref5) {
     // y={y}
     ,
     style: {
-      overflow: "hidden"
+      overflow: "visible"
     }
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: className,
@@ -280,7 +280,7 @@ var Label = function Label(_ref5) {
       cursor: "pointer",
       transform: "translate(".concat(x + (isIOS ? iosX : 0), "px, ").concat(y + (isIOS ? iosY : 0), "px)") // 用 transform 定位
     })
-  }, labelNum == "Fixed" ? /*#__PURE__*/_react["default"].createElement(_TextOverflow["default"], {
+  }, !adaptive ? /*#__PURE__*/_react["default"].createElement(_TextOverflow["default"], {
     ShowType: "normal",
     type: textOverflow,
     speed: speed,
@@ -334,24 +334,18 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(/*#__PURE__*/(
     clipAxisRange = _ref6.clipAxisRange,
     controlInfo = _ref6.controlInfo,
     rawTicks = _ref6.rawTicks,
-    paddingOuter = _ref6.paddingOuter,
-    controlEnd = _ref6.controlEnd,
-    start = _ref6.start;
+    paddingOuter = _ref6.paddingOuter;
   var _useContext = (0, _react.useContext)(_context.chartContext),
     width = _useContext.width,
     height = _useContext.height,
     isIOS = _useContext.isIOS;
   var cHeight = controlInfo.cHeight,
     isC = controlInfo.isC,
-    cPercent = controlInfo.cPercent,
-    cBarX = controlInfo.cBarX,
-    cWidth = controlInfo.cWidth,
-    cBarWidth = controlInfo.cBarWidth;
-  var clipPathIdRef = (0, _react.useRef)("axis-clip-".concat(orientation, "-").concat(axisType, "-").concat(Math.random().toString(36).substr(2, 9)));
+    cPercent = controlInfo.cPercent;
   var x = orientation == "right" ? width : 0;
   var y = orientation == "bottom" ? height - cHeight : 0;
   var LabelWidth = 1;
-  if (label.labelNum == "Fixed") {
+  if (!label.adaptive && label.appearance) {
     LabelWidth = label.appearance.width;
   } else {
     if (allTicks.length && typeof allTicks[0] == "string") {
@@ -359,7 +353,7 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(/*#__PURE__*/(
     }
   }
   var LabelNum = Math.floor(width / (isC ? cPercent : 1) * (1 - paddingOuter) / LabelWidth);
-  var ticks = label.labelNum == "Fixed" ? tickss : getEvenlySpacedElements(allTicks, LabelNum < allTicks.length ? LabelNum > allTicks.length / 2 ? Math.ceil(allTicks.length / 2) : LabelNum : allTicks.length, label.showLast);
+  var ticks = !label.adaptive ? tickss : getEvenlySpacedElements(allTicks, LabelNum < allTicks.length ? LabelNum > allTicks.length / 2 ? Math.ceil(allTicks.length / 2) : LabelNum : allTicks.length, label.showLast);
   if (!(on && ticks.length > 0)) return null;
 
   //数据抽取逻辑
@@ -450,13 +444,6 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(/*#__PURE__*/(
     }
   }
   function drawLabel() {
-    // 在 drawLabel 内部重新计算 translateX，确保使用最新的 controlInfo
-    var labelTranslateX = 0;
-    if (isC && isIOS && axisType === "x" && controlEnd !== undefined && start !== undefined) {
-      var percent = cBarX / (cWidth - cBarWidth);
-      var validPercent = isNaN(percent) ? 1 : percent;
-      labelTranslateX = -(controlEnd + start / cPercent - width) * validPercent;
-    }
     var draw = function draw(ticks, scaler) {
       return ticks.map(function (tick, index) {
         var coordinate = scaler(tick);
@@ -477,7 +464,7 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(/*#__PURE__*/(
           coordinate: coordinate,
           iosTrans: {
             isIOS: isIOS,
-            x: marginLeft + x + (isIOS && isC && axisType === "x" ? labelTranslateX : 0),
+            x: marginLeft + x,
             y: marginTop + y
           },
           config: label,
@@ -550,20 +537,10 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(/*#__PURE__*/(
   }), tickLine && drawAxisTickLine()))), /*#__PURE__*/_react["default"].createElement("svg", {
     width: width,
     style: {
-      overflow: "hidden"
+      overflow: axisType === "x" && isC ? "hidden" : "visible"
     }
-  }, axisType === "x" && isC || isIOS && axisType === "x" ? /*#__PURE__*/_react["default"].createElement("defs", null, /*#__PURE__*/_react["default"].createElement("clipPath", {
-    id: clipPathIdRef.current,
-    clipPathUnits: "userSpaceOnUse"
-  }, /*#__PURE__*/_react["default"].createElement("rect", {
-    x: "0",
-    y: "0",
-    width: xLineRange,
-    height: height + 200,
-    fill: "transparent"
-  }))) : null, /*#__PURE__*/_react["default"].createElement("g", {
-    transform: "translate(" + x + ", " + y + ")",
-    clipPath: axisType === "x" && isC || isIOS && axisType === "x" ? "url(#".concat(clipPathIdRef.current, ")") : undefined
+  }, /*#__PURE__*/_react["default"].createElement("g", {
+    transform: "translate(" + x + ", " + y + ")"
   }, /*#__PURE__*/_react["default"].createElement("g", {
     ref: ref
   }, label && gridLine && drawLabel(), isC && /*#__PURE__*/_react["default"].createElement(AxisLine, {

package/lib/components/CartesianChart.js

@@ -579,7 +579,8 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
       },
       dataUnit: dataUnit
     }, config, {
-      key: index
+      key: index,
+      clipX: clipX
     }));
   }), showTooltip && !control && zIndex == "bottom" && /*#__PURE__*/_react["default"].createElement(_.Indicator, (0, _extends2["default"])({}, indicator, {
     manual: true,
@@ -596,7 +597,6 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
     ref: seriesEl,
     style: {
       overflow: "visible",
-      // 保留原有样式，clipPath会接管裁剪
       position: "absolute",
       transform: isVertical ? "translate(".concat(marginRight, "px,").concat(isIOS ? marginTop : 0, "px)") : "translate(".concat(isIOS ? marginLeft : 0, "px,").concat(marginTop, "px)")
     }

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: "visible",
+      overflow: "hidden",
       position: "absolute",
       width: width,
       height: height

package/package.json

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

package/src/components/Axis.tsx

@@ -9,7 +9,6 @@ import React, {
   CSSProperties,
   MouseEventHandler,
   forwardRef,
-  useRef,
 } from "react";
 import { getTickCoord, getGridCoord, getFontStyle } from "../utils";
 import { chartContext } from "../context";
@@ -227,7 +226,7 @@ type LabelType = {
   events?: Function;
   config: {
     show: boolean;
-    labelNum: string;
+    adaptive:boolean;
     translate: Translate;
     font: Font;
     textAlign: TextAlign;
@@ -278,7 +277,7 @@ const Label: (
   events = defaultEvent,
   config: {
     show,
-    labelNum,
+    adaptive,
     style,
     translate: { x: translateX, y: translateY },
     font,
@@ -308,7 +307,7 @@ const Label: (
       height="100%"
       // x={x}
       // y={y}
-      style={{ overflow: "hidden" }}
+      style={{ overflow: "visible" }}
     >
       <div
         className={className}
@@ -324,7 +323,7 @@ const Label: (
           }px)`, // 用 transform 定位
         }}
       >
-        {labelNum == "Fixed" ? (
+        {!adaptive ? (
           <TextOverflow
             ShowType="normal"
             type={textOverflow}
@@ -389,24 +388,15 @@ export default memo(
         controlInfo,
         rawTicks,
         paddingOuter,
-        // 从展开的 config 中获取控制图相关属性
-        controlEnd,
-        start,
       }: any,
       ref
     ) => {
       const { width, height, isIOS } = useContext(chartContext);
-      const { cHeight, isC, cPercent, cBarX, cWidth, cBarWidth } = controlInfo;
-      const clipPathIdRef = useRef(
-        `axis-clip-${orientation}-${axisType}-${Math.random()
-          .toString(36)
-          .substr(2, 9)}`
-      );
+      const { cHeight, isC, cPercent } = controlInfo;
       const x = orientation == "right" ? width : 0;
       const y = orientation == "bottom" ? height - cHeight : 0;
-
       let LabelWidth = 1;
-      if (label.labelNum == "Fixed") {
+      if (!label.adaptive&&label.appearance) {
         LabelWidth = label.appearance.width;
       } else {
         if (allTicks.length && typeof allTicks[0] == "string") {
@@ -417,7 +407,7 @@ export default memo(
         ((width / (isC ? cPercent : 1)) * (1 - paddingOuter)) / LabelWidth
       );
       const ticks: any =
-        label.labelNum == "Fixed"
+        !label.adaptive
           ? tickss
           : getEvenlySpacedElements(
               allTicks,
@@ -553,21 +543,6 @@ export default memo(
         }
       }
       function drawLabel() {
-        // 在 drawLabel 内部重新计算 translateX，确保使用最新的 controlInfo
-        let labelTranslateX = 0;
-        if (
-          isC &&
-          isIOS &&
-          axisType === "x" &&
-          controlEnd !== undefined &&
-          start !== undefined
-        ) {
-          const percent = cBarX / (cWidth - cBarWidth);
-          const validPercent = isNaN(percent) ? 1 : percent;
-          labelTranslateX =
-            -(controlEnd + start / cPercent - width) * validPercent;
-        }
-
         const draw = (ticks: any, scaler: any) => {
           return ticks.map((tick: string, index: number) => {
             const coordinate = scaler(tick);
@@ -596,16 +571,7 @@ export default memo(
                       className="__easyv-label"
                       orientation={orientation}
                       coordinate={coordinate}
-                      iosTrans={{
-                        isIOS,
-                        x:
-                          marginLeft +
-                          x +
-                          (isIOS && isC && axisType === "x"
-                            ? labelTranslateX
-                            : 0),
-                        y: marginTop + y,
-                      }}
+                      iosTrans={{ isIOS, x: marginLeft + x, y: marginTop + y }}
                       config={label}
                       label={tick}
                       tickSize={_tickSize}
@@ -714,34 +680,10 @@ export default memo(
           <svg
             width={width}
             style={{
-              overflow: "hidden",
+              overflow: axisType === "x" && isC ? "hidden" : "visible",
             }}
           >
-            {/* 定义裁剪路径：用于iOS端超出隐藏 */}
-            {(axisType === "x" && isC) || (isIOS && axisType === "x") ? (
-              <defs>
-                <clipPath
-                  id={clipPathIdRef.current}
-                  clipPathUnits="userSpaceOnUse"
-                >
-                  <rect
-                    x="0"
-                    y="0"
-                    width={xLineRange}
-                    height={height + 200}
-                    fill="transparent"
-                  />
-                </clipPath>
-              </defs>
-            ) : null}
-            <g
-              transform={"translate(" + x + ", " + y + ")"}
-              clipPath={
-                (axisType === "x" && isC) || (isIOS && axisType === "x")
-                  ? `url(#${clipPathIdRef.current})`
-                  : undefined
-              }
-            >
+            <g transform={"translate(" + x + ", " + y + ")"}>
               {/* 用于控制图 */}
               <g ref={ref as any}>
                 {label && gridLine && drawLabel()}

package/src/components/CartesianChart.js

@@ -568,6 +568,7 @@ const Chart = memo(
                 dataUnit={dataUnit}
                 {...config}
                 key={index}
+                clipX={clipX}
               />
             );
           })}
@@ -594,7 +595,7 @@ const Chart = memo(
               height="100%"
               ref={seriesEl}
               style={{
-                overflow: "visible", // 保留原有样式，clipPath会接管裁剪
+                overflow: "visible",
                 position: "absolute",
                 transform: isVertical
                   ? `translate(${marginRight}px,${isIOS ? marginTop : 0}px)`

package/src/components/ChartContainer.tsx

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