@easyv/charts 1.4.40 → 1.5.1

package/lib/components/CartesianChart.js

@@ -15,6 +15,8 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 
 var _react = _interopRequireWildcard(require("react"));
@@ -32,6 +34,10 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
 var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
   var _ref$config = _ref.config,
       axesConfig = _ref$config.axes,
@@ -114,7 +120,8 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
     cWidth: controlWidth,
     cHeight: controlHeight,
     cBarWidth: controlBarWidth,
-    cPercent: dragPercent
+    cPercent: dragPercent,
+    cBarX: 0
   }),
       _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
       controlInfo = _useState4[0],
@@ -123,7 +130,8 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
   var cWidth = controlInfo.cWidth,
       cHeight = controlInfo.cHeight,
       cBarWidth = controlInfo.cBarWidth,
-      cPercent = controlInfo.cPercent;
+      cPercent = controlInfo.cPercent,
+      cBarX = controlInfo.cBarX;
   yLineRange -= cHeight;
   (0, _react.useEffect)(function () {
     setControlInfo({
@@ -131,7 +139,8 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
       cWidth: controlWidth,
       cHeight: controlHeight,
       cBarWidth: controlBarWidth,
-      cPercent: dragPercent
+      cPercent: dragPercent,
+      cBarX: 0
     });
   }, [JSON.stringify(control)]);
   var svg = (0, _react.useRef)();
@@ -216,34 +225,58 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
 
   var isWorking = (0, _react.useRef)(false); //控制条是否正在进行各种操作
 
-  var range = function range(num) {
+  var range = function range(num, ignoreMax) {
     var _num = num;
     var min = 0;
     var max = cWidth - cBarWidth;
     _num = Math.max(_num, min);
+
+    if (ignoreMax) {
+      return _num;
+    }
+
     _num = Math.min(_num, max);
     return _num;
   }; //设置滑块和图表主体的偏移值
 
 
   var setControlTranslate = function setControlTranslate(x, needSave) {
-    var controlEnd = axisX.controlEnd,
-        start = axisX.start;
     var moveLen = range(x);
     if (needSave) ctlBarX.current = moveLen;
-    controlEl.current.style.transform = "translate(".concat(moveLen, "px,0)"); //计算出当前位移的百分比
+    setControlInfo(function (pre) {
+      return _objectSpread(_objectSpread({}, pre), {}, {
+        cBarX: moveLen
+      });
+    });
+  };
 
-    var percent = moveLen / (cWidth - cBarWidth);
-    var translateX = -(controlEnd + start / cPercent - chartWidth) * percent;
-    curControlPercent.current = percent;
-    seriesEl.current.style.transform = "translate(".concat(translateX, "px,").concat(marginTop, "px)");
-    axisElList.current[2].style.transform = "translate(".concat(translateX, "px,", 0, "px)");
+  var setControlWidth = function setControlWidth(fn) {
+    var ignoreMax = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+    setControlInfo(function (pre) {
+      var x = pre.cBarX;
+      var moveLen = range(x, ignoreMax);
+      ctlBarX.current = moveLen;
+      return fn(pre);
+    });
   }; //设置控制条是否正在进行拖拽/缩放操作
 
 
   var setWorking = function setWorking(bool) {
     isWorking.current = bool;
-  };
+  }; //cBarX变化后，修改图表的偏移值
+
+
+  (0, _react.useLayoutEffect)(function () {
+    var controlEnd = axisX.controlEnd,
+        start = axisX.start;
+    controlEl.current.style.transform = "translate(".concat(cBarX, "px,0)"); //计算出当前位移的百分比
+
+    var percent = cBarX / (cWidth - cBarWidth);
+    var translateX = -(controlEnd + start / cPercent - chartWidth) * percent;
+    curControlPercent.current = percent;
+    seriesEl.current.style.transform = "translate(".concat(translateX, "px,").concat(marginTop, "px)");
+    axisElList.current[2].style.transform = "translate(".concat(translateX, "px,", 0, "px)");
+  }, [controlInfo]); //控制条轮播动画
 
   (0, _react.useEffect)(function () {
     if (controlEl.current && control) {
@@ -343,7 +376,7 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
         cancelAnimationFrame(controlTimer.current);
       };
     }
-  }, [JSON.stringify(animation), control, controlInfo]); //初始化控制图提示框状态的函数
+  }, [JSON.stringify(animation), control, cWidth, cHeight, cBarWidth, cPercent]); //初始化控制图提示框状态的函数
 
   var initCtlTip = function initCtlTip() {
     return {
@@ -492,7 +525,7 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
     actions: {
       setX: setControlTranslate,
       setWorking: setWorking,
-      setControlInfo: setControlInfo
+      setControlWidth: setControlWidth
     },
     props: {
       control: control,

package/lib/components/Control.js

@@ -19,6 +19,8 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _d3Scale = require("d3-scale");
 
+var _utils = require("../utils");
+
 var _excluded = ["Component", "yOrZ"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -33,7 +35,7 @@ var _default = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef
   var _props$actions = props.actions,
       setX = _props$actions.setX,
       setWorking = _props$actions.setWorking,
-      setControlInfo = _props$actions.setControlInfo,
+      setControlWidth = _props$actions.setControlWidth,
       _props$props = props.props,
       _props$props$control = _props$props.control,
       height = _props$props$control.height,
@@ -71,8 +73,39 @@ var _default = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef
     cursor: "col-resize",
     background: "rgb(2, 176, 249)",
     WebkitBackgroundClip: "content-box"
+  }; //左手柄的鼠标按下逻辑
+
+  var leftDown = function leftDown() {
+    var transform = ref.current.style.transform;
+    var initX = 0;
+    var rawTranslateX = parseFloat(transform ? transform.match(/\d+\.*\d*/)[0] : 0);
+    var rightX = rawTranslateX + cBarWidth;
+
+    var move = function move(e) {
+      var movementX = e.movementX;
+      initX = (0, _utils.mathR)(initX + movementX, [-rawTranslateX, rightX - rawTranslateX]);
+      setControlWidth(function (pre) {
+        var cWidth = pre.cWidth,
+            cBarWidth = pre.cBarWidth;
+        var nextBarWidth = (0, _utils.mathR)(cBarWidth - movementX, [1, rightX]);
+        return _objectSpread(_objectSpread({}, pre), {}, {
+          cBarWidth: nextBarWidth,
+          cPercent: nextBarWidth / cWidth,
+          cBarX: initX + rawTranslateX
+        });
+      }, true);
+    };
+
+    var up = function up() {
+      document.removeEventListener("mousemove", move);
+      document.removeEventListener("mouseup", up);
+    };
+
+    document.addEventListener("mousemove", move);
+    document.addEventListener("mouseup", up);
   }; //滑块的鼠标按下操作
 
+
   var down = function down() {
     var transform = ref.current.style.transform;
     var movementX = 0;
@@ -97,13 +130,19 @@ var _default = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef
 
 
   var rightDown = function rightDown() {
+    var transform = ref.current.style.transform;
+    var rawTranslateX = parseFloat(transform ? transform.match(/\d+\.*\d*/)[0] : 0);
+
     var move = function move(e) {
       var movementX = e.movementX;
-      setControlInfo(function (pre) {
-        var nextBarWidth = pre.cBarWidth + movementX;
+      setControlWidth(function (pre) {
+        var cWidth = pre.cWidth,
+            cBarWidth = pre.cBarWidth;
+        var maxWidth = cWidth - rawTranslateX;
+        var nextBarWidth = (0, _utils.mathR)(cBarWidth + movementX, [1, maxWidth]);
         return _objectSpread(_objectSpread({}, pre), {}, {
           cBarWidth: nextBarWidth,
-          cPercent: nextBarWidth / pre.cWidth
+          cPercent: nextBarWidth / cWidth
         });
       });
     };
@@ -146,9 +185,19 @@ var _default = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef
     ref: ref,
     style: barStyle
   }, /*#__PURE__*/_react["default"].createElement("div", {
+    style: _objectSpread(_objectSpread({}, controllerStyle), {}, {
+      transform: "translateX(-6px)"
+    }),
+    onMouseDown: leftDown
+  }), /*#__PURE__*/_react["default"].createElement("div", {
     style: dragStyle,
     onMouseDown: down,
     ref: barRef
+  }), /*#__PURE__*/_react["default"].createElement("div", {
+    style: _objectSpread(_objectSpread({}, controllerStyle), {}, {
+      transform: "translateX(6px)"
+    }),
+    onMouseDown: rightDown
   })));
 }));
 

package/lib/components/Line.js

@@ -93,6 +93,9 @@ var Area = function Area(_ref2) {
   }, [xScaler, yScaler, curve, tension]);
   return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("path", {
     d: areaGen(data),
+    style: {
+      pointerEvents: "none"
+    },
     stroke: "none",
     fill: 'url(#' + id + ')'
   }), /*#__PURE__*/_react["default"].createElement("defs", null, type && type == 'pattern' ? /*#__PURE__*/_react["default"].createElement("pattern", {
@@ -178,7 +181,8 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref6) {
     d: path,
     stroke: stroke,
     style: {
-      filter: show ? "drop-shadow(".concat(shadow.hShadow, "px ").concat(shadow.vShadow, "px ").concat(shadow.blur, "px ").concat(shadow.color, ")") : "none"
+      filter: show ? "drop-shadow(".concat(shadow.hShadow, "px ").concat(shadow.vShadow, "px ").concat(shadow.blur, "px ").concat(shadow.color, ")") : "none",
+      pointerEvents: "none"
     },
     fill: "none",
     strokeDasharray: lineType === 'dash' ? '3 3' : null,

package/lib/utils/index.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.band = band;
-exports.sortPie = exports.seriesYOrZ = exports.resetStacks = exports.reduceConfig = exports.isValidHttpUrl = exports.identity = exports.getTranslate3d = exports.getTranslate2d = exports.getTicksOfAxis = exports.getTickCoord = exports.getStacks = exports.getSeriesInfo = exports.getMousePos = exports.getMargin = exports.getIcon = exports.getGridCoord = exports.getFontStyle = exports.getDomPath = exports.getDataWithPercent = exports.getCurrentStack = exports.getColorList = exports.getChildren = exports.getBreakWord = exports.getBandwidth = exports.getBandSeriesStepAndWidth = exports.getBandBackground = exports.filterChildren = exports.dateFormat = exports.dataYOrZ = void 0;
+exports.sortPie = exports.seriesYOrZ = exports.resetStacks = exports.reduceConfig = exports.mathR = exports.isValidHttpUrl = exports.identity = exports.getTranslate3d = exports.getTranslate2d = exports.getTicksOfAxis = exports.getTickCoord = exports.getStacks = exports.getSeriesInfo = exports.getMousePos = exports.getMargin = exports.getIcon = exports.getGridCoord = exports.getFontStyle = exports.getDomPath = exports.getDataWithPercent = exports.getCurrentStack = exports.getColorList = exports.getChildren = exports.getBreakWord = exports.getBandwidth = exports.getBandSeriesStepAndWidth = exports.getBandBackground = exports.filterChildren = exports.dateFormat = exports.dataYOrZ = void 0;
 
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 
@@ -900,6 +900,17 @@ var reduceConfig = function reduceConfig() {
   }
 
   return output;
+}; //限制value的值在min和max之间
+
+
+exports.reduceConfig = reduceConfig;
+
+var mathR = function mathR(value, range) {
+  var _range = (0, _slicedToArray2["default"])(range, 2),
+      min = _range[0],
+      max = _range[1];
+
+  return Math.max(min, Math.min(value, max));
 };
 
-exports.reduceConfig = reduceConfig;
+exports.mathR = mathR;

package/package.json

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

package/src/components/CartesianChart.js

@@ -8,7 +8,8 @@ import React, {
   useRef,
   useContext,
   useCallback,
-  useEffect
+  useEffect,
+  useLayoutEffect
 } from "react";
 import { useAxes, useTooltip, useCarouselAxisX, useAiData } from "../hooks";
 import { chartContext } from "../context";
@@ -89,8 +90,8 @@ const Chart = memo(
       dragPercent = dragWidth/100;
       controlBarWidth = controlWidth*dragPercent;
     }
-    const [controlInfo, setControlInfo] = useState({ isC:isControl, cWidth:controlWidth, cHeight:controlHeight, cBarWidth:controlBarWidth, cPercent:dragPercent });
-    const { cWidth, cHeight, cBarWidth, cPercent } = controlInfo;
+    const [controlInfo, setControlInfo] = useState({ isC:isControl, cWidth:controlWidth, cHeight:controlHeight, cBarWidth:controlBarWidth, cPercent:dragPercent, cBarX:0 });
+    const { cWidth, cHeight, cBarWidth, cPercent, cBarX } = controlInfo;
     yLineRange -=  cHeight;
     useEffect(()=>{
       setControlInfo({
@@ -98,7 +99,8 @@ const Chart = memo(
         cWidth:controlWidth,
         cHeight:controlHeight, 
         cBarWidth:controlBarWidth, 
-        cPercent:dragPercent
+        cPercent:dragPercent,
+        cBarX:0
       });
     },[JSON.stringify(control)]);
 
@@ -193,31 +195,52 @@ const Chart = memo(
     const ctlBarX = useRef(0);      //控制条的滑块偏移值
     const isWorking = useRef(false);  //控制条是否正在进行各种操作
 
-    const range = (num) => {
+    const range = (num, ignoreMax) => {
       let _num = num;
       const min = 0;
       const max = cWidth - cBarWidth;
       _num = Math.max(_num, min);
+      if(ignoreMax){
+        return _num;
+      }
       _num = Math.min(_num, max);
       return _num;
     };
     //设置滑块和图表主体的偏移值
     const setControlTranslate = (x, needSave) => {
-      const { controlEnd, start } = axisX;
       const moveLen = range(x);
       if(needSave) ctlBarX.current = moveLen;
-      controlEl.current.style.transform = `translate(${moveLen}px,0)`;
-      //计算出当前位移的百分比
-      const percent = moveLen / (cWidth - cBarWidth);
-      const translateX = -(controlEnd + start/cPercent - chartWidth) * percent;
-      curControlPercent.current = percent;
-      seriesEl.current.style.transform = `translate(${translateX}px,${marginTop}px)`;
-      axisElList.current[2].style.transform = `translate(${translateX}px,${0}px)`;
+      setControlInfo(pre=>{
+        return {
+          ...pre,
+          cBarX:moveLen
+        }
+      });
     };
+    const setControlWidth = (fn,ignoreMax=false)=>{
+      setControlInfo(pre=>{
+        const x = pre.cBarX;
+        const moveLen = range(x, ignoreMax);
+        ctlBarX.current = moveLen;
+        return fn(pre);
+      });
+    }
     //设置控制条是否正在进行拖拽/缩放操作
     const setWorking=(bool)=>{
       isWorking.current = bool;
     }
+    //cBarX变化后，修改图表的偏移值
+    useLayoutEffect(()=>{
+      const { controlEnd, start } = axisX;
+      controlEl.current.style.transform = `translate(${cBarX}px,0)`;
+      //计算出当前位移的百分比
+      const percent = cBarX / (cWidth - cBarWidth);
+      const translateX = -(controlEnd + start/cPercent - chartWidth) * percent;
+      curControlPercent.current = percent;
+      seriesEl.current.style.transform = `translate(${translateX}px,${marginTop}px)`;
+      axisElList.current[2].style.transform = `translate(${translateX}px,${0}px)`;
+    },[controlInfo]);
+    //控制条轮播动画
     useEffect(() => {
       if (controlEl.current && control) {
         let isEnter = false;   //控制条轮播动画是否处于暂停状态
@@ -294,7 +317,7 @@ const Chart = memo(
           cancelAnimationFrame(controlTimer.current);
         };
       }
-    }, [JSON.stringify(animation), control, controlInfo]);
+    }, [JSON.stringify(animation), control, cWidth, cHeight, cBarWidth, cPercent]);
     //初始化控制图提示框状态的函数
     const initCtlTip = ()=>{
       return {
@@ -487,7 +510,7 @@ const Chart = memo(
             actions={{
               setX:setControlTranslate,
               setWorking,
-              setControlInfo
+              setControlWidth
             }}
             props={{
               control,

package/src/components/Control.jsx

@@ -1,12 +1,13 @@
 import React, { forwardRef, memo, useRef } from "react";
 import { scaleLinear } from "d3-scale";
+import { mathR } from "../utils";
 
 export default memo(forwardRef((props, ref) => {
   const { 
-    actions:{ setX, setWorking, setControlInfo }, 
+    actions:{ setX, setWorking, setControlWidth }, 
     props: { 
       control:{ height, color, gap, drag:{ color:dragColor }, margin:{ left } }, 
-      controlInfo:{  cWidth, cBarWidth },
+      controlInfo:{ cWidth, cBarWidth },
       axes, series, top, bandLength 
     }
   } = props;
@@ -35,6 +36,34 @@ export default memo(forwardRef((props, ref) => {
     background:"rgb(2, 176, 249)",
     WebkitBackgroundClip:"content-box",
   }
+ 
+  //左手柄的鼠标按下逻辑
+  const leftDown=()=>{
+    const transform = ref.current.style.transform;
+    let initX = 0;
+    let rawTranslateX = parseFloat(transform?transform.match(/\d+\.*\d*/)[0]:0);
+    const rightX = rawTranslateX+cBarWidth;
+    const move=(e)=>{
+      const { movementX } = e;
+      initX = mathR(initX+movementX,[-rawTranslateX, rightX-rawTranslateX]);
+      setControlWidth((pre)=>{
+        const { cWidth, cBarWidth } = pre;
+        const nextBarWidth = mathR(cBarWidth-movementX,[1,rightX]);
+        return {
+          ...pre,
+          cBarWidth:nextBarWidth,
+          cPercent:nextBarWidth/cWidth,
+          cBarX:initX+rawTranslateX
+        }
+      }, true);
+    }
+    const up=()=>{
+      document.removeEventListener("mousemove",move);
+      document.removeEventListener("mouseup",up);
+    }
+    document.addEventListener("mousemove",move);
+    document.addEventListener("mouseup",up);
+  }
   //滑块的鼠标按下操作
   const down=()=>{
     const transform = ref.current.style.transform;
@@ -56,17 +85,20 @@ export default memo(forwardRef((props, ref) => {
   }
   // //右手柄的鼠标按下逻辑
   const rightDown=()=>{
-
+    const transform = ref.current.style.transform;
+    let rawTranslateX = parseFloat(transform?transform.match(/\d+\.*\d*/)[0]:0);
     const move=(e)=>{
       const { movementX } = e;
-      setControlInfo(pre=>{
-        const nextBarWidth = pre.cBarWidth+movementX;
+      setControlWidth((pre)=>{
+        const { cWidth, cBarWidth } = pre;
+        const maxWidth = cWidth-rawTranslateX;
+        const nextBarWidth = mathR(cBarWidth+movementX,[1,maxWidth]);
         return {
           ...pre,
           cBarWidth:nextBarWidth,
-          cPercent:nextBarWidth/pre.cWidth
+          cPercent:nextBarWidth/cWidth
         }
-      })
+      });
     }
     const up=()=>{
       document.removeEventListener("mousemove",move);
@@ -108,9 +140,9 @@ export default memo(forwardRef((props, ref) => {
       </svg>
       {/* 控制条 */}
       <div ref={ref} style={barStyle}>
-        {/* <div style={{...controllerStyle,transform:"translateX(-6px)"}}></div> */}
+        <div style={{...controllerStyle,transform:"translateX(-6px)"}} onMouseDown={leftDown}></div>
         <div style={dragStyle} onMouseDown={down} ref={barRef}></div>
-        {/* <div style={{...controllerStyle,transform:`translateX(6px)`}} onMouseDown={rightDown}></div> */}
+        <div style={{...controllerStyle,transform:`translateX(6px)`}} onMouseDown={rightDown}></div>
       </div>
     </div>
   );

package/src/components/Line.js

@@ -48,7 +48,7 @@ const Area = ({
 
   return (
     <>
-      <path d={areaGen(data)} stroke='none' fill={'url(#' + id + ')'} />
+      <path d={areaGen(data)} style={{pointerEvents:"none"}} stroke='none' fill={'url(#' + id + ')'} />
       <defs>
         {type && type == 'pattern' ? (
           <pattern id={id} patternUnits="userSpaceOnUse" width={patternW} height={patternH}>
@@ -129,7 +129,8 @@ export default memo(
           d={path}
           stroke={stroke}
           style={{
-            filter:show?`drop-shadow(${shadow.hShadow}px ${shadow.vShadow}px ${shadow.blur}px ${shadow.color})`:"none"
+            filter:show?`drop-shadow(${shadow.hShadow}px ${shadow.vShadow}px ${shadow.blur}px ${shadow.color})`:"none",
+            pointerEvents:"none"
           }}
           fill='none'
           strokeDasharray={lineType === 'dash' ? '3 3' : null}

package/src/utils/index.js

@@ -723,6 +723,12 @@ const reduceConfig = (config = []) => {
   return output;
 };
 
+//限制value的值在min和max之间
+const mathR=(value, range)=>{
+  const [min,max] = range;
+  return Math.max(min,Math.min(value,max));
+}
+
 export {
   dateFormat,
   getBreakWord,
@@ -754,4 +760,5 @@ export {
   getDataWithPercent,
   reduceConfig,
   getSeriesInfo,
+  mathR
 };