@easyv/charts 1.5.1 → 1.5.3

package/lib/components/Carousel.js

@@ -22,7 +22,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _d3v = require("d3v7");
 
 var _excluded = ["animation"],
-    _excluded2 = ["config", "data"];
+    _excluded2 = ["config", "data", "active"];
 
 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); }
 
@@ -60,6 +60,7 @@ var _default = function _default(Component) {
         config = (0, _objectWithoutProperties2["default"])(_ref$config, _excluded),
         _ref$data = _ref.data,
         data = _ref$data === void 0 ? [] : _ref$data,
+        active = _ref.active,
         rest = (0, _objectWithoutProperties2["default"])(_ref, _excluded2);
     var dataLength = data.length;
 
@@ -103,11 +104,11 @@ var _default = function _default(Component) {
       }
     }, [animationOn, interval, dataLength]);
     (0, _react.useEffect)(function () {
-      carousel && carousel();
+      active && carousel && carousel();
       return function () {
         timer.current && timer.current.stop();
       };
-    }, [carousel]);
+    }, [carousel, active]);
     var onEvent = (0, _react.useCallback)(function (_ref3) {
       var currentIndex = _ref3.currentIndex,
           type = _ref3.type;

package/lib/components/CartesianChart.js

@@ -269,13 +269,16 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
   (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)");
+    if (controlEl.current) {
+      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 () {

package/lib/components/Chart.js

@@ -159,7 +159,8 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref2) {
   }, type == 'pie' ? /*#__PURE__*/_react["default"].createElement(_.PieChart, (0, _extends2["default"])({
     id: id,
     config: config,
-    data: data
+    data: data,
+    active: active
   }, props)) : /*#__PURE__*/_react["default"].createElement(_.CartesianChart, (0, _extends2["default"])({
     id: id,
     config: config,

package/package.json

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

package/src/components/Carousel.tsx

@@ -36,6 +36,7 @@ export default (Component: ComponentType<any>) =>
     ({
       config: { animation, ...config },
       data = [],
+      active,
       ...rest
     }: {
       data: DataType[];
@@ -77,11 +78,11 @@ export default (Component: ComponentType<any>) =>
       }, [animationOn, interval, dataLength]);
 
       useEffect(() => {
-        carousel && carousel();
+        active && carousel && carousel();
         return () => {
           timer.current && timer.current.stop();
         };
-      }, [carousel]);
+      }, [carousel, active]);
       interface Event{
         currentIndex:number,
         type:string

package/src/components/CartesianChart.js

@@ -232,14 +232,16 @@ const Chart = memo(
     //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]);
+      if(controlEl.current){
+        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) {

package/src/components/Chart.js

@@ -90,6 +90,8 @@ const Chart = memo(
       [id, chartWidth, chartHeight, triggerOnRelative, svg, onEmit]
     );
 
+    
+
     useEffect(()=>{
       const activeHandler=(e)=>{
         const { dynamicData = true } = e;
@@ -121,7 +123,7 @@ const Chart = memo(
     return (
       <chartContext.Provider value={context}>
         {type == 'pie' ? (
-          <PieChart id={id} config={config} data={data} {...props} />
+          <PieChart id={id} config={config} data={data} active={active} {...props} />
         ) : (
           <CartesianChart id={id} config={config} data={data} active={active} {...props} />
         )}