@easyv/charts 1.7.29 → 1.7.31

package/lib/components/CartesianChart.js

@@ -26,6 +26,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
   var width = _ref.width,
     height = _ref.height,
+    seriesData = _ref.seriesData,
     _ref$config = _ref.config,
     axesConfig = _ref$config.axes,
     background = _ref$config.background,
@@ -639,7 +640,7 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
     }
   }), /*#__PURE__*/_react["default"].createElement(_.Legend, (0, _extends2["default"])({}, legend, {
     filterData: filterData,
-    series: series
+    series: seriesData
   })), showTooltip && !control && /*#__PURE__*/_react["default"].createElement(_.Tooltip, (0, _extends2["default"])({
     isVertical: isVertical
   }, tooltip, {

package/lib/components/Mapping.js

@@ -65,8 +65,18 @@ var _default = exports["default"] = function _default(Component) {
           var fieldName = _ref2.fieldName;
           return !fieldName;
         });
-        var tmp = new Map();
+        var lastSeries = series[seriesLength - 1];
+        var tmp = new Map(series.filter(function (d) {
+          return d.fieldName;
+        }).map(function (d) {
+          return [d.fieldName, {}];
+        })); //确定的系列样式
+        var i = 0;
+        var emptyArray = series.filter(function (d) {
+          return !d.fieldName;
+        }); //没有fieldsName的系列样式
         if (!!noName) {
+          //都没名
           data.forEach(function (_ref3, index) {
             var key = _ref3.key;
             var current = series[index % seriesLength];
@@ -77,14 +87,15 @@ var _default = exports["default"] = function _default(Component) {
           });
           return tmp;
         }
-        var lastSeries = series[seriesLength - 1];
         data.forEach(function (_ref4) {
           var key = _ref4.key;
+          //先把有系列的渲染了，无系列的排后面
           var current = series.find(function (_ref5) {
             var fieldName = _ref5.fieldName;
             return fieldName == key;
           });
-          var result = current || lastSeries;
+          var result = current || emptyArray[i] || lastSeries;
+          if (!current) i = (i + 1) % emptyArray.length;
           var name = (current ? current.fieldName || current.displayName : key) || '';
           tmp.set(name, _objectSpread(_objectSpread({}, result), {}, {
             name: name,

package/lib/components/PieChart.js

@@ -760,7 +760,12 @@ 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(_PieTooltip.PieTooltip, {
+  }), tooltip && mousePos && mousePos.x != 0 && mousePos.y != 0 && tooltip.manual && /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      position: 'absolute',
+      zIndex: 9999
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_PieTooltip.PieTooltip, {
     series: series,
     data: hoverData,
     config: tooltip,
@@ -769,7 +774,7 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
       y: maxRadius + marginTop
     },
     mousePos: mousePos
-  }), /*#__PURE__*/_react["default"].createElement(_.Legend, (0, _extends2["default"])({}, legend, {
+  })), /*#__PURE__*/_react["default"].createElement(_.Legend, (0, _extends2["default"])({}, legend, {
     height: chartHeight,
     series: _arcs.map(function (arc) {
       return _objectSpread(_objectSpread({}, arc), {}, {

package/lib/components/StackData.js

@@ -30,7 +30,8 @@ var _default = exports["default"] = function _default(Component) {
     });
     return /*#__PURE__*/React.createElement(Component, (0, _extends2["default"])({}, props, {
       config: _objectSpread(_objectSpread({}, config), _config),
-      data: data
+      data: data,
+      seriesData: _config.seriesdata
     }));
   });
 };

package/lib/hooks/useStackData.js

@@ -74,7 +74,41 @@ var setStackData = function setStackData(data, series, stacks) {
   dataMap.clear();
   return series;
 };
+var mergeDataAndSeries = function mergeDataAndSeries(data, _series) {
+  // 创建一个映射，键为系列名称，值为数据点数组
+  var dataMap = new Map();
 
+  // 遍历 data 数组，按系列名称分组数据点
+  data.forEach(function (item) {
+    var seriesName = item.s;
+    if (!dataMap.has(seriesName)) {
+      dataMap.set(seriesName, []);
+    }
+    // 构建符合目标格式的数据点对象
+    var dataPoint = {
+      data: {
+        s: item.s,
+        x: item.x,
+        y: item.y,
+        showY: item.showY
+      },
+      index: 0,
+      bound: [0, item.y]
+    };
+    dataMap.get(seriesName).push(dataPoint);
+  });
+
+  // 遍历 _series 数组，为每个系列添加对应的数据
+  return _series.map(function (series) {
+    var seriesName = series.name || series.fieldName;
+    // 查找对应系列的数据
+    var seriesData = dataMap.get(seriesName) || [];
+    // 返回合并后完整的系列对象，包含原始配置和新添加的数据
+    return _objectSpread(_objectSpread({}, series), {}, {
+      data: seriesData
+    });
+  });
+};
 /**
  * 计算堆叠数据
  * @param {Array} data 数据
@@ -96,12 +130,13 @@ var _default = exports["default"] = function _default(_ref2) {
     return (0, _utils.dataYOrZ)(data, _series.series);
   }, [data, _series]);
   var tmp = (0, _react.useMemo)(function () {
+    var seriesdata = mergeDataAndSeries(data, Array.from(series.values()));
     var dataY = _data.y,
       dataZ = _data.z;
     var stacks = _series.stacks,
       _series$series = _series.series,
-      seriesY = _series$series.y,
-      seriesZ = _series$series.z;
+      seriesZ = _series$series.z,
+      seriesY = _series$series.y;
     resetStackData(seriesY);
     resetStackData(seriesZ);
     setStackData(dataY, seriesY, stacks);
@@ -110,7 +145,9 @@ var _default = exports["default"] = function _default(_ref2) {
       bandLength: stacks.filter(function (item) {
         return item.type == 'band';
       }).length,
-      series: [].concat((0, _toConsumableArray2["default"])(seriesY.values()), (0, _toConsumableArray2["default"])(seriesZ.values()))
+      // series: mergeDataAndSeries(data,Array.from(series.values())),
+      series: [].concat((0, _toConsumableArray2["default"])(seriesY.values()), (0, _toConsumableArray2["default"])(seriesZ.values())),
+      seriesdata: seriesdata
     };
   }, [_data, _series]);
   return tmp;

package/package.json

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

package/src/components/CartesianChart.js

@@ -34,6 +34,7 @@ import {
 const Chart = memo(
   ({
     width, height,
+    seriesData,
     config: {
       axes: axesConfig,
       background,
@@ -659,7 +660,7 @@ const Chart = memo(
             }}
           ></Control>
         )}
-        <Legend {...legend} filterData={filterData} series={series} />
+        <Legend {...legend} filterData={filterData} series={seriesData} />
         {/* 非控制图下的提示框 */}
         {showTooltip && !control && (
           <Tooltip

package/src/components/Chart.js

@@ -89,7 +89,7 @@ const Chart = memo(
       }),
       [id, chartWidth, chartHeight, triggerOnRelative, svg, onEmit]
     );
-
+    
     useEffect(()=>{
       let isAnimation = window.screenConfig?window.screenConfig.isAnimation:true; //大屏的全局设置是否允许开启动画，false为不允许
       if(!isAnimation) setActive(false);
@@ -107,14 +107,14 @@ const Chart = memo(
     },[]);
     
     let data = checkData(originData);
-
+    
     return (
       <chartContext.Provider value={context}>
         {type == 'pie' ? (
           <PieChart id={id} config={config} data={data} active={active} {...props} />
         ) : (
           <CartesianChart id={id} config={config} data={data} active={active} {...props} />
-        )}
+         )}
       </chartContext.Provider>
       
     );

package/src/components/Mapping.js

@@ -31,8 +31,11 @@ export default (Component) =>
       if (!!data.length) {
         const seriesLength = series.length;
         const noName = series.every(({ fieldName }) => !fieldName);
-        const tmp = new Map();
-        if (!!noName) {
+        const lastSeries = series[seriesLength - 1];
+        const tmp = new Map(series.filter(d=>d.fieldName).map(d=>[d.fieldName,{}]));    //确定的系列样式
+        let i = 0;
+        const emptyArray = series.filter(d=>!d.fieldName);    //没有fieldsName的系列样式
+        if (!!noName) {//都没名
           data.forEach(({ key }, index) => {
             const current = series[index % seriesLength];
             const name = key || '';
@@ -43,10 +46,10 @@ export default (Component) =>
           });
           return tmp;
         }
-        const lastSeries = series[seriesLength - 1];
-        data.forEach(({ key }) => {
+        data.forEach(({ key }) => {//先把有系列的渲染了，无系列的排后面
           const current = series.find(({ fieldName }) => fieldName == key);
-          const result = current || lastSeries;
+          const result = current || emptyArray[i]|| lastSeries;
+          if(!current) i=(i+1)%emptyArray.length;
           const name = (current ? current.fieldName || current.displayName : key) || '';
           tmp.set(name, {
             ...result,

package/src/components/PieChart.js

@@ -855,21 +855,23 @@ const Component = memo(
           />
         )}
         {tooltip &&
-          mousePos &&
-          mousePos.x != 0 &&
-          mousePos.y != 0 &&
-          tooltip.manual && (
-            <PieTooltip
-              series={series}
-              data={hoverData}
-              config={tooltip}
-              pieCenter={{
-                x: halfChartWidth,
-                y: maxRadius + marginTop,
-              }}
-              mousePos={mousePos}
-            />
-          )}
+         mousePos &&
+         mousePos.x != 0 &&
+         mousePos.y != 0 &&
+         tooltip.manual && (
+   <div style={{ position: 'absolute', zIndex: 9999 }}>
+     <PieTooltip
+       series={series}
+       data={hoverData}
+       config={tooltip}
+       pieCenter={{
+         x: halfChartWidth,
+         y: maxRadius + marginTop,
+       }}
+       mousePos={mousePos}
+     />
+   </div>
+ )}
         <Legend
           {...legend}
           height={chartHeight}

package/src/components/StackData.js

@@ -7,10 +7,10 @@ export default (Component) => {
   return memo(({ config: { series, ...config }, data, ...props }) => {
     const _config = useStackData({
       series,
-      data,
+      data
     });
     return (
-      <Component {...props} config={{ ...config, ..._config }} data={data} />
+      <Component {...props} config={{ ...config, ..._config }} data={data} seriesData={_config.seriesdata} />
     );
   });
 };

package/src/hooks/useStackData.js

@@ -67,7 +67,42 @@ const setStackData = (data, series, stacks) => {
   dataMap.clear();
   return series;
 };
-
+const mergeDataAndSeries=(data, _series) =>{
+  // 创建一个映射，键为系列名称，值为数据点数组
+  const dataMap = new Map();
+  
+  // 遍历 data 数组，按系列名称分组数据点
+  data.forEach(item => {
+      const seriesName = item.s;
+      if (!dataMap.has(seriesName)) {
+          dataMap.set(seriesName, []);
+      }
+      // 构建符合目标格式的数据点对象
+      const dataPoint = {
+          data: {
+              s: item.s,
+              x: item.x,
+              y: item.y,
+              showY: item.showY
+          },
+          index: 0,
+          bound: [0, item.y]
+      };
+      dataMap.get(seriesName).push(dataPoint);
+  });
+  
+  // 遍历 _series 数组，为每个系列添加对应的数据
+  return _series.map(series => {
+      const seriesName = series.name || series.fieldName;
+      // 查找对应系列的数据
+      const seriesData = dataMap.get(seriesName) || [];
+      // 返回合并后完整的系列对象，包含原始配置和新添加的数据
+      return {
+          ...series,
+          data: seriesData
+      };
+  });
+}
 /**
  * 计算堆叠数据
  * @param {Array} data 数据
@@ -81,13 +116,14 @@ export default ({ data, series }) => {
     const _series = getSeriesMap(series);
     return { stacks, series: seriesYOrZ(_series) };
   }, [series]);
-
+  
   const _data = useMemo(() => dataYOrZ(data, _series.series), [data, _series]);
   const tmp = useMemo(() => {
+    const seriesdata=mergeDataAndSeries(data,Array.from(series.values()))
     const { y: dataY, z: dataZ } = _data;
     const {
       stacks,
-      series: { y: seriesY, z: seriesZ },
+      series: { z: seriesZ,y: seriesY  },
     } = _series;
     resetStackData(seriesY);
     resetStackData(seriesZ);
@@ -95,7 +131,9 @@ export default ({ data, series }) => {
     setStackData(dataZ, seriesZ, stacks);
     return {
       bandLength: stacks.filter((item) => item.type == 'band').length,
+      // series: mergeDataAndSeries(data,Array.from(series.values())),
       series: [...seriesY.values(), ...seriesZ.values()],
+      seriesdata:seriesdata
     };
   }, [_data, _series]);
   return tmp;