@easyv/charts 1.8.10 → 1.8.12

package/lib/components/Band.js

@@ -13,8 +13,9 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _react = _interopRequireWildcard(require("react"));
 var _d3v = require("d3v7");
 var _utils = require("../utils");
-var _excluded = ["pattern", "seriesIntervalWidth", "paddingInner", "highlight"],
-  _excluded2 = ["bgAttr"];
+var _excluded = ["show", "extent"],
+  _excluded2 = ["pattern", "seriesIntervalWidth", "paddingInner", "highlight"],
+  _excluded3 = ["bgAttr"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -103,8 +104,8 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(function (_ref
     _ref3$config$highligh = _ref3$config.highlight,
     showHighlight = _ref3$config$highligh.show,
     extent = _ref3$config$highligh.extent,
-    highlightFill = _ref3$config$highligh.fill,
-    other = (0, _objectWithoutProperties2["default"])(_ref3$config, _excluded),
+    highlightStyle = (0, _objectWithoutProperties2["default"])(_ref3$config$highligh, _excluded),
+    other = (0, _objectWithoutProperties2["default"])(_ref3$config, _excluded2),
     curXLabel = _ref3.curXLabel,
     selectStyle = _ref3.selectStyle,
     _ref3$bandLength = _ref3.bandLength,
@@ -136,6 +137,10 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(function (_ref
       });
     }
   }
+  var highlightConfig = other;
+  if (highlightStyle) {
+    highlightConfig = _objectSpread(_objectSpread({}, other), highlightStyle);
+  }
   var step = isControlChart ? controlStep : normalStep;
   var xScaler = isControlChart ? controlDragScaler : normalScaler;
   var _getSeriesInfo = (0, _utils.getSeriesInfo)({
@@ -176,7 +181,7 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(function (_ref
       y1 = yScaler(isVertical ? end : start);
       y2 = yScaler(isVertical ? start : end);
     }
-    var _ref5 = x == curXLabel ? selectConfig : other,
+    var _ref5 = x == curXLabel ? selectConfig : flag ? highlightConfig : other,
       style = _ref5.style,
       fillType = _ref5.fillType,
       _ref5$fillMode = _ref5.fillMode,
@@ -227,7 +232,7 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(function (_ref
         seriesWidth: seriesWidth
       }),
       bgAttr = _getAttr.bgAttr,
-      attr = (0, _objectWithoutProperties2["default"])(_getAttr, _excluded2);
+      attr = (0, _objectWithoutProperties2["default"])(_getAttr, _excluded3);
     return /*#__PURE__*/_react["default"].createElement(_react.Fragment, {
       key: i
     }, /*#__PURE__*/_react["default"].createElement("foreignObject", (0, _extends2["default"])({
@@ -328,7 +333,7 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(function (_ref
         opacity: fillType == "pattern" ? opacity : 1,
         background: fillType == "pattern" ? "".concat(isVertical ? y < 0 ? "100%" : "0%" : "50%", " ").concat(isVertical ? "50%" : y < 0 ? "0%" : "100%", " / ").concat(fillMode == "tile" ? size.width + "px " + size.height + "px" : "100% 100%", " repeat ") + "url(" +
         //@ts-ignore
-        window.appConfig.ASSETS_URL + url + ")" : (0, _utils.getBandBackground)(pattern, extent === flag ? highlightFill : fill, y //是否小于0
+        window.appConfig.ASSETS_URL + url + ")" : (0, _utils.getBandBackground)(pattern, fill, y //是否小于0
         ),
         borderRadius: style == "square" ? "0 0 0 0" : getBorderRadius({
           isVertical: isVertical,

package/lib/components/CartesianChart.js

@@ -65,7 +65,6 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
     brush = _ref$config.brush,
     _ref$config$control = _ref$config.control,
     control = _ref$config$control === void 0 ? null : _ref$config$control,
-    isTransverse = _ref.isTransverse,
     active = _ref.active,
     style = _ref.style,
     originData = _ref.originData,
@@ -593,8 +592,7 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
       indicatorWidth: indicatorWidth,
       triggerClick: onInteraction,
       setCtlTip: setCtlTip,
-      isXRepeat: isXRepeat,
-      isTransverse: isTransverse
+      isXRepeat: isXRepeat
     }));
   }), series.map(function (_ref3, index) {
     var Component = _ref3.Component,

package/lib/components/Label.js

@@ -6,18 +6,43 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("react");
+var _d3v = require("d3v7");
 var _utils = require("../utils");
 var _context = require("../context");
-var _excluded = ["seriesIntervalWidth", "paddingInner", "showType"];
-/**
+var _excluded = ["show", "extent"],
+  _excluded2 = ["seriesIntervalWidth", "paddingInner", "showType", "highlight"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /**
  * 轴类图表标签
  */
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var getHighlightData = function getHighlightData(data, extent) {
+  switch (extent) {
+    case "min":
+      var minData = (0, _d3v.min)(data, function (d) {
+        return d.data.y;
+      });
+      return data.map(function (item) {
+        return _objectSpread(_objectSpread({}, item), {}, {
+          flag: minData == item.data.y ? "min" : ""
+        });
+      });
+    case "max":
+      var maxData = (0, _d3v.max)(data, function (d) {
+        return d.data.y;
+      });
+      return data.map(function (item) {
+        return _objectSpread(_objectSpread({}, item), {}, {
+          flag: maxData == item.data.y ? "max" : ""
+        });
+      });
+    default:
+      return data;
+  }
+};
 var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(function (_ref) {
   var _ref$config = _ref.config,
     _ref$config$seriesInt = _ref$config.seriesIntervalWidth,
@@ -26,7 +51,11 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(function (_ref
     paddingOuter = _ref$config$paddingIn === void 0 ? 0 : _ref$config$paddingIn,
     _ref$config$showType = _ref$config.showType,
     seriesType = _ref$config$showType === void 0 ? 'bar' : _ref$config$showType,
-    other = (0, _objectWithoutProperties2["default"])(_ref$config, _excluded),
+    _ref$config$highlight = _ref$config.highlight,
+    showHighlight = _ref$config$highlight.show,
+    extent = _ref$config$highlight.extent,
+    highlightStyle = (0, _objectWithoutProperties2["default"])(_ref$config$highlight, _excluded),
+    other = (0, _objectWithoutProperties2["default"])(_ref$config, _excluded2),
     config = _ref.config,
     curXLabel = _ref.curXLabel,
     selectStyle = _ref.selectStyle,
@@ -61,6 +90,12 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(function (_ref
       }
     }
   }
+  var highlightConfig = other;
+  if (highlightStyle) {
+    highlightConfig = _objectSpread(_objectSpread({}, other), {}, {
+      label: highlightStyle.numlabel
+    });
+  }
   var lineType = config.hasOwnProperty("line"); //  堆叠处理
 
   if (!data.length) return null;
@@ -76,11 +111,13 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(function (_ref
     seriesStep = _getSeriesInfo.seriesStep,
     seriesWidth = _getSeriesInfo.seriesWidth,
     seriesStart = _getSeriesInfo.seriesStart;
+  var _data = showHighlight ? getHighlightData(data, extent) : data;
   var isVertical = direction === "vertical";
   return /*#__PURE__*/React.createElement("g", {
     className: "__easyv-label"
-  }, data.map(function (_ref2, i) {
-    var index = _ref2.index,
+  }, _data.map(function (_ref2, i) {
+    var flag = _ref2.flag,
+      index = _ref2.index,
       _ref2$bound = (0, _slicedToArray2["default"])(_ref2.bound, 2),
       start = _ref2$bound[0],
       end = _ref2$bound[1],
@@ -91,7 +128,7 @@ var _default = exports["default"] = /*#__PURE__*/(0, _react.memo)(function (_ref
       showY = _ref2$data.showY,
       s = _ref2$data.s;
     var y1, y2;
-    var _ref3 = x == curXLabel ? selectConfig : other,
+    var _ref3 = x == curXLabel ? selectConfig : flag ? highlightConfig : other,
       icon = _ref3.icon,
       label = _ref3.label;
     var showIcon = icon && icon.show;

package/package.json

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

package/src/components/Band.tsx

@@ -92,7 +92,7 @@ export default memo(
       pattern = {},
       seriesIntervalWidth: paddingInner = 0,
       paddingInner: paddingOuter = 0,
-      highlight: { show: showHighlight, extent, fill: highlightFill },
+      highlight: { show: showHighlight, extent, ...highlightStyle },
       ...other
     },
     curXLabel,
@@ -111,6 +111,10 @@ export default memo(
         selectConfig = { ...barStyle, headDecorate };
       }
     }
+    let highlightConfig = other;
+    if(highlightStyle){
+      highlightConfig = { ...other, ...highlightStyle };
+    }
     const step = isControlChart?controlStep:normalStep;
     const xScaler = isControlChart?controlDragScaler:normalScaler;
     const { seriesWidth, seriesStep, seriesStart } = getSeriesInfo({
@@ -159,7 +163,7 @@ export default memo(
               border,
               opacity,
               headDecorate
-            } = x==curXLabel?selectConfig:other;
+            } = x==curXLabel?selectConfig:flag?highlightConfig:other;
             const { borderColor:{
               type="pure", pure="transparent", linear
             }, borderWidth=0 } = border || {};
@@ -293,7 +297,7 @@ export default memo(
                             ")"
                           : getBandBackground(
                               pattern,
-                              extent === flag ? highlightFill : fill,
+                              fill,
                               y//是否小于0
                             ),
                       borderRadius:

package/src/components/CartesianChart.js

@@ -59,7 +59,6 @@ const Chart = memo(
       brush,
       control = null,
     },
-    isTransverse,
     active,
     style,
     originData,
@@ -568,7 +567,6 @@ const Chart = memo(
                       triggerClick={onInteraction}
                       setCtlTip={setCtlTip}
                       isXRepeat={isXRepeat}
-                      isTransverse={isTransverse}
                     />
                   )
                 );

package/src/components/Label.js

@@ -2,15 +2,36 @@
  * 轴类图表标签
  */
 import { memo, useContext } from "react";
+import { min, max } from "d3v7";
 import { getTranslate2d, getSeriesInfo, getFontStyle, formatFont } from "../utils";
 import { chartContext } from "../context";
 
+const getHighlightData = (data, extent) => {
+  switch (extent) {
+    case "min":
+      const minData = min(data, (d) => d.data.y);
+      return data.map((item) => ({
+        ...item,
+        flag: minData == item.data.y ? "min" : "",
+      }));
+    case "max":
+      const maxData = max(data, (d) => d.data.y);
+      return data.map((item) => ({
+        ...item,
+        flag: maxData == item.data.y ? "max" : "",
+      }));
+    default:
+      return data;
+  }
+};
+
 export default memo(
   ({
     config: {
       seriesIntervalWidth: paddingInner = 0,
       paddingInner: paddingOuter = 0,
       showType:seriesType = 'bar',
+      highlight: { show: showHighlight, extent, ...highlightStyle },
       ...other
     },
     config,
@@ -33,6 +54,10 @@ export default memo(
         }
       }
     }
+    let highlightConfig = other;
+    if(highlightStyle){
+      highlightConfig = { ...other, label:highlightStyle.numlabel };
+    }
     const lineType = config.hasOwnProperty("line"); //  堆叠处理
     
     if (!data.length) return null;
@@ -44,17 +69,18 @@ export default memo(
       paddingInner,
       paddingOuter,
     });
+    const _data = showHighlight ? getHighlightData(data, extent) : data;
     const isVertical = direction === "vertical";
     
     return (
       <g className="__easyv-label">
-        {data.map(
+        {_data.map(
           (
-            { index, bound: [start, end], data, data: { x, y, showY, s } },
+            { flag, index, bound: [start, end], data, data: { x, y, showY, s } },
             i
           ) => {
             let y1, y2;
-            const { icon, label } = x==curXLabel?selectConfig:other;
+            const { icon, label } = x==curXLabel?selectConfig:flag?highlightConfig:other;
             const showIcon = icon && icon.show;
             const showLabel = label && label.show;
             const { position:_position="outerStart", reverse=true } = label || {};