onesight-charts 1.4.0 → 1.4.2

package/es/components/pie/legend/index.js

@@ -1,3 +1,9 @@
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 import React from 'react';
 import { computeFloatNull, dealSort, numberFormatNull, transformedSeriesData } from "../../../utils/chartUtils";
 import Pagination from "../../pagination";
@@ -17,6 +23,25 @@ function Legend(props) {
     paginationCb = props.paginationCb,
     width = props.width,
     platformIconMap = props.platformIconMap;
+
+  // 辅助函数：判断两个 item 是否为同一个项
+  var isSameItem = function isSameItem(item1, item2) {
+    // 如果都有 alias，使用 alias 精确匹配
+    if (item1.alias && item2.alias) {
+      return item1.alias === item2.alias;
+    }
+    // 如果只有一方有 alias，说明不是同一个项
+    if (item1.alias && !item2.alias || !item1.alias && item2.alias) {
+      return false;
+    }
+    // 都没有 alias 时，使用 name + value + color 组合来匹配，提高匹配准确性
+    return item1.name === item2.name && item1.value === item2.value && item1.color === item2.color;
+  };
+
+  // 辅助函数：生成唯一 id（与渲染时保持一致）
+  var getUniqueId = function getUniqueId(item, index) {
+    return item.alias || "".concat(item.name, "_").concat(index);
+  };
   var handleHover = function handleHover(item) {
     if (item) {
       chart.current.dispatchAction({
@@ -30,26 +55,35 @@ function Legend(props) {
     }
   };
   var handleLegendClick = function handleLegendClick(item) {
-    var containsOPPOxUCLoppo = seriesData.some(function (val) {
-      return val.name === item.name;
+    // 创建新的数组副本，避免直接修改 props
+    var newSeriesData = JSON.parse(JSON.stringify(seriesData));
+
+    // 使用 isSameItem 来精确匹配项目
+    var index = newSeriesData.findIndex(function (val) {
+      return isSameItem(val, item);
     });
-    var element = document.getElementById('legend-content' + item.name);
-    if (containsOPPOxUCLoppo) {
-      // 找到具有特定 name 的对象的索引
-      var index = seriesData.findIndex(function (val) {
-        return val.name === item.name;
-      });
-      // 如果找到了，就从原数组中移除它
-      if (index !== -1) {
-        seriesData.splice(index, 1);
+
+    // 在 legendData 中找到对应的索引，用于生成唯一的 element id
+    var legendItemIndex = legendData.findIndex(function (val) {
+      return isSameItem(val, item);
+    });
+    var uniqueId = getUniqueId(item, legendItemIndex !== -1 ? legendItemIndex : 0);
+    var element = document.getElementById('legend-content' + uniqueId);
+    if (index !== -1) {
+      // 如果找到了，就从数组中移除它
+      newSeriesData.splice(index, 1);
+      if (element) {
         element.classList.add('legend-item-cancel');
       }
     } else {
-      seriesData.push(item);
-      element.classList.remove('legend-item-cancel');
+      // 如果没找到，就添加它
+      newSeriesData.push(item);
+      if (element) {
+        element.classList.remove('legend-item-cancel');
+      }
     }
-    dealSort(seriesData, order);
-    var dealData = JSON.parse(JSON.stringify(seriesData));
+    dealSort(newSeriesData, order);
+    var dealData = JSON.parse(JSON.stringify(newSeriesData));
     dealData.forEach(function (item) {
       if (item.value === 0) {
         item.value = -1;
@@ -60,6 +94,11 @@ function Legend(props) {
         data: transformedSeriesData(dealData)
       }]
     });
+
+    // 注意：这里直接修改了传入的 seriesData，虽然不推荐，但保持原有行为
+    // 如果父组件使用受控组件模式，应该通过 props 传递更新函数
+    seriesData.length = 0;
+    seriesData.push.apply(seriesData, _toConsumableArray(newSeriesData));
   };
   var pageData = JSON.parse(JSON.stringify(seriesData));
   return /*#__PURE__*/React.createElement("ul", {
@@ -67,13 +106,15 @@ function Legend(props) {
   }, /*#__PURE__*/React.createElement("div", {
     className: "li-container"
   }, legendData.map(function (item, i) {
+    // 使用 alias 或 name+索引来生成唯一的 id（与 handleLegendClick 中的逻辑保持一致）
+    var uniqueId = getUniqueId(item, i);
     return /*#__PURE__*/React.createElement("li", {
-      id: 'legend-content' + item.name,
+      id: 'legend-content' + uniqueId,
       className: "legend-item",
       style: {
         marginBottom: legendData.length > 9 ? '4px' : '12px'
       },
-      key: i
+      key: uniqueId
     }, /*#__PURE__*/React.createElement("div", {
       className: "parent-wrap"
     }, /*#__PURE__*/React.createElement("div", {

package/es/components/stacked-bar/index.js

@@ -46,7 +46,9 @@ function StackedBar(props) {
     _props$yAxisLabelWidt = props.yAxisLabelWidth,
     yAxisLabelWidth = _props$yAxisLabelWidt === void 0 ? true : _props$yAxisLabelWidt,
     _props$showAllLegends = props.showAllLegends,
-    showAllLegends = _props$showAllLegends === void 0 ? false : _props$showAllLegends;
+    showAllLegends = _props$showAllLegends === void 0 ? false : _props$showAllLegends,
+    _props$xAxisMaxMultip = props.xAxisMaxMultiplier,
+    xAxisMaxMultiplier = _props$xAxisMaxMultip === void 0 ? 1.1 : _props$xAxisMaxMultip;
   var chartRef = useRef();
   var legendMoreBtnRef = useRef(null);
   var dropdownRef = useRef(null);
@@ -332,8 +334,8 @@ function StackedBar(props) {
           finalMax = maxTotal + overflowPx * unitPerPx;
         }
 
-        // 确保最终值不小于 maxTotal * 1.3，并额外增加 10% 以确保标签完全显示
-        finalMax = Math.max(finalMax, maxTotal * 1.3) * 1.2;
+        // 确保最终值不小于 maxTotal * 1.3，并应用额外的倍率以确保标签完全显示
+        finalMax = Math.max(finalMax, maxTotal * 1.3) * xAxisMaxMultiplier;
       }
     }
 

package/lib/components/pie/legend/index.js

@@ -53,6 +53,18 @@ function Legend(props) {
     width,
     platformIconMap
   } = props;
+  const isSameItem = (item1, item2) => {
+    if (item1.alias && item2.alias) {
+      return item1.alias === item2.alias;
+    }
+    if (item1.alias && !item2.alias || !item1.alias && item2.alias) {
+      return false;
+    }
+    return item1.name === item2.name && item1.value === item2.value && item1.color === item2.color;
+  };
+  const getUniqueId = (item, index) => {
+    return item.alias || `${item.name}_${index}`;
+  };
   const handleHover = (item) => {
     if (item) {
       chart.current.dispatchAction({
@@ -66,22 +78,29 @@ function Legend(props) {
     }
   };
   const handleLegendClick = (item) => {
-    const containsOPPOxUCLoppo = seriesData.some(
-      (val) => val.name === item.name
+    const newSeriesData = JSON.parse(JSON.stringify(seriesData));
+    const index = newSeriesData.findIndex((val) => isSameItem(val, item));
+    const legendItemIndex = legendData.findIndex(
+      (val) => isSameItem(val, item)
+    );
+    const uniqueId = getUniqueId(
+      item,
+      legendItemIndex !== -1 ? legendItemIndex : 0
     );
-    const element = document.getElementById("legend-content" + item.name);
-    if (containsOPPOxUCLoppo) {
-      const index = seriesData.findIndex((val) => val.name === item.name);
-      if (index !== -1) {
-        seriesData.splice(index, 1);
+    const element = document.getElementById("legend-content" + uniqueId);
+    if (index !== -1) {
+      newSeriesData.splice(index, 1);
+      if (element) {
         element.classList.add("legend-item-cancel");
       }
     } else {
-      seriesData.push(item);
-      element.classList.remove("legend-item-cancel");
+      newSeriesData.push(item);
+      if (element) {
+        element.classList.remove("legend-item-cancel");
+      }
     }
-    (0, import_chartUtils.dealSort)(seriesData, order);
-    const dealData = JSON.parse(JSON.stringify(seriesData));
+    (0, import_chartUtils.dealSort)(newSeriesData, order);
+    const dealData = JSON.parse(JSON.stringify(newSeriesData));
     dealData.forEach((item2) => {
       if (item2.value === 0) {
         item2.value = -1;
@@ -94,18 +113,21 @@ function Legend(props) {
         }
       ]
     });
+    seriesData.length = 0;
+    seriesData.push(...newSeriesData);
   };
   const pageData = JSON.parse(JSON.stringify(seriesData));
   return /* @__PURE__ */ import_react.default.createElement("ul", { className: "onesight-pie-legend" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "li-container" }, legendData.map((item, i) => {
+    const uniqueId = getUniqueId(item, i);
     return /* @__PURE__ */ import_react.default.createElement(
       "li",
       {
-        id: "legend-content" + item.name,
+        id: "legend-content" + uniqueId,
         className: "legend-item",
         style: {
           marginBottom: legendData.length > 9 ? "4px" : "12px"
         },
-        key: i
+        key: uniqueId
       },
       /* @__PURE__ */ import_react.default.createElement("div", { className: "parent-wrap" }, /* @__PURE__ */ import_react.default.createElement(
         "div",

package/lib/components/stacked-bar/index.js

@@ -56,8 +56,10 @@ function StackedBar(props) {
     legendNum = 4,
     legendDropdownRight = -98,
     yAxisLabelWidth = true,
-    showAllLegends = false
+    showAllLegends = false,
     // 是否显示所有图例
+    xAxisMaxMultiplier = 1.1
+    // X 轴最大值的额外倍率，用于确保标签完全显示
   } = props;
   const chartRef = (0, import_react.useRef)();
   const legendMoreBtnRef = (0, import_react.useRef)(null);
@@ -298,7 +300,7 @@ function StackedBar(props) {
           const unitPerPx = maxTotal / barAreaWidth;
           finalMax = maxTotal + overflowPx * unitPerPx;
         }
-        finalMax = Math.max(finalMax, maxTotal * 1.3) * 1.2;
+        finalMax = Math.max(finalMax, maxTotal * 1.3) * xAxisMaxMultiplier;
       }
     }
     const lastNonZeroSeriesIdxPerRow = yAxisData.map((_, rowIdx) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "onesight-charts",
-  "version": "1.4.0",
+  "version": "1.4.2",
   "private": false,
   "description": "OneSight前端图表公共组件库",
   "license": "MIT",