@easyv/charts 1.4.16 → 1.4.18

package/lib/components/Label.js

@@ -1,73 +1,87 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 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 _react = require("react");
+
 var _utils = require("../utils");
+
 var _context = require("../context");
+
 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; } /**
-                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             * 轴类图表标签
-                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             */
+
+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 _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
   var _ref$config = _ref.config,
-    _ref$config$seriesInt = _ref$config.seriesIntervalWidth,
-    paddingInner = _ref$config$seriesInt === void 0 ? 0 : _ref$config$seriesInt,
-    _ref$config$paddingIn = _ref$config.paddingInner,
-    paddingOuter = _ref$config$paddingIn === void 0 ? 0 : _ref$config$paddingIn,
-    label = _ref$config.label,
-    icon = _ref$config.icon,
-    config = _ref.config,
-    _ref$bandLength = _ref.bandLength,
-    bandLength = _ref$bandLength === void 0 ? 0 : _ref$bandLength,
-    data = _ref.data,
-    _ref$xAxis = _ref.xAxis,
-    xScaler = _ref$xAxis.scaler,
-    step = _ref$xAxis.step,
-    direction = _ref$xAxis.direction,
-    _ref$yAxis = _ref.yAxis,
-    yScaler = _ref$yAxis.scaler,
-    isClipAxis = _ref$yAxis.isClipAxis,
-    clipValue = _ref$yAxis.clipValue,
-    triggerClick = _ref.triggerClick;
+      _ref$config$seriesInt = _ref$config.seriesIntervalWidth,
+      paddingInner = _ref$config$seriesInt === void 0 ? 0 : _ref$config$seriesInt,
+      _ref$config$paddingIn = _ref$config.paddingInner,
+      paddingOuter = _ref$config$paddingIn === void 0 ? 0 : _ref$config$paddingIn,
+      label = _ref$config.label,
+      icon = _ref$config.icon,
+      config = _ref.config,
+      _ref$bandLength = _ref.bandLength,
+      bandLength = _ref$bandLength === void 0 ? 0 : _ref$bandLength,
+      data = _ref.data,
+      _ref$xAxis = _ref.xAxis,
+      xScaler = _ref$xAxis.scaler,
+      step = _ref$xAxis.step,
+      direction = _ref$xAxis.direction,
+      _ref$yAxis = _ref.yAxis,
+      yScaler = _ref$yAxis.scaler,
+      isClipAxis = _ref$yAxis.isClipAxis,
+      clipValue = _ref$yAxis.clipValue,
+      triggerClick = _ref.triggerClick;
   var lineType = config.hasOwnProperty("line"); //  堆叠处理
+
   var showIcon = icon && icon.show;
   var showLabel = label && label.show;
   if (!(data.length && (showIcon || showLabel))) return null;
+
   var _useContext = (0, _react.useContext)(_context.chartContext),
-    width = _useContext.width,
-    height = _useContext.height;
+      width = _useContext.width,
+      height = _useContext.height;
+
   var _getSeriesInfo = (0, _utils.getSeriesInfo)({
-      step: step,
-      bandLength: bandLength,
-      paddingInner: paddingInner,
-      paddingOuter: paddingOuter
-    }),
-    seriesStep = _getSeriesInfo.seriesStep,
-    seriesWidth = _getSeriesInfo.seriesWidth,
-    seriesStart = _getSeriesInfo.seriesStart;
+    step: step,
+    bandLength: bandLength,
+    paddingInner: paddingInner,
+    paddingOuter: paddingOuter
+  }),
+      seriesStep = _getSeriesInfo.seriesStep,
+      seriesWidth = _getSeriesInfo.seriesWidth,
+      seriesStart = _getSeriesInfo.seriesStart;
+
   var isVertical = direction === "vertical";
   var _position = label.position;
   return /*#__PURE__*/React.createElement("g", {
     className: "__easyv-label"
   }, data.map(function (_ref2, i) {
     var index = _ref2.index,
-      _ref2$bound = (0, _slicedToArray2["default"])(_ref2.bound, 2),
-      start = _ref2$bound[0],
-      end = _ref2$bound[1],
-      data = _ref2.data,
-      _ref2$data = _ref2.data,
-      x = _ref2$data.x,
-      y = _ref2$data.y,
-      showY = _ref2$data.showY,
-      s = _ref2$data.s;
+        _ref2$bound = (0, _slicedToArray2["default"])(_ref2.bound, 2),
+        start = _ref2$bound[0],
+        end = _ref2$bound[1],
+        data = _ref2.data,
+        _ref2$data = _ref2.data,
+        x = _ref2$data.x,
+        y = _ref2$data.y,
+        showY = _ref2$data.showY,
+        s = _ref2$data.s;
+
     var y1, y2;
+
     if (isClipAxis) {
       if (end > +clipValue) {
         y1 = yScaler[1](start);
@@ -77,12 +91,12 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
         y2 = yScaler[1](end);
       }
     } else {
-      y1 = yScaler(isVertical ? end : start);
-      //  处理z型折线图和堆叠柱图的逻辑冲突
+      y1 = yScaler(isVertical ? end : start); //  处理z型折线图和堆叠柱图的逻辑冲突
+
       y2 = lineType ? start ? yScaler(isVertical ? start : end - start) : yScaler(isVertical ? start : end) : yScaler(isVertical ? start : end);
-    }
+    } // const y2 =  yScaler(isVertical ? start : end);
+
 
-    // const y2 =  yScaler(isVertical ? start : end);
     var positionX = xScaler(x) - step / 2 + seriesStart + index * seriesStep;
     if (isNaN(positionX)) return null;
     var position = positionX + (config.line ? step : seriesWidth) / 2;
@@ -123,22 +137,30 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
     }, attr)));
   }));
 });
+
 exports["default"] = _default;
+
 var Label = function Label(_ref3) {
   var x = _ref3.x,
-    y = _ref3.y,
-    value = _ref3.value,
-    _ref3$config = _ref3.config,
-    font = _ref3$config.font,
-    _ref3$config$translat = _ref3$config.translate,
-    _ref3$config$translat2 = _ref3$config$translat.x,
-    translateX = _ref3$config$translat2 === void 0 ? 0 : _ref3$config$translat2,
-    _ref3$config$translat3 = _ref3$config$translat.y,
-    translateY = _ref3$config$translat3 === void 0 ? 0 : _ref3$config$translat3,
-    _ref3$textAnchor = _ref3.textAnchor,
-    textAnchor = _ref3$textAnchor === void 0 ? "middle" : _ref3$textAnchor,
-    _ref3$dominantBaselin = _ref3.dominantBaseline,
-    dominantBaseline = _ref3$dominantBaselin === void 0 ? "middle" : _ref3$dominantBaselin;
+      y = _ref3.y,
+      value = _ref3.value,
+      _ref3$config = _ref3.config,
+      font = _ref3$config.font,
+      _ref3$config$translat = _ref3$config.translate,
+      _ref3$config$translat2 = _ref3$config$translat.x,
+      translateX = _ref3$config$translat2 === void 0 ? 0 : _ref3$config$translat2,
+      _ref3$config$translat3 = _ref3$config$translat.y,
+      translateY = _ref3$config$translat3 === void 0 ? 0 : _ref3$config$translat3,
+      _ref3$config$suffix = _ref3$config.suffix,
+      content = _ref3$config$suffix.content,
+      suffixFont = _ref3$config$suffix.font,
+      _ref3$config$suffix$t = _ref3$config$suffix.translate,
+      suffixX = _ref3$config$suffix$t.x,
+      suffixY = _ref3$config$suffix$t.y,
+      _ref3$textAnchor = _ref3.textAnchor,
+      textAnchor = _ref3$textAnchor === void 0 ? "middle" : _ref3$textAnchor,
+      _ref3$dominantBaselin = _ref3.dominantBaseline,
+      dominantBaseline = _ref3$dominantBaselin === void 0 ? "middle" : _ref3$dominantBaselin;
   return /*#__PURE__*/React.createElement("text", (0, _extends2["default"])({
     x: x,
     y: y,
@@ -148,21 +170,26 @@ var Label = function Label(_ref3) {
     }),
     textAnchor: textAnchor,
     dominantBaseline: dominantBaseline
-  }, font), value);
+  }, font), /*#__PURE__*/React.createElement("tspan", null, value), /*#__PURE__*/React.createElement("tspan", {
+    dx: suffixX,
+    dy: suffixY,
+    style: _objectSpread({}, (0, _utils.getFontStyle)(suffixFont, "svg"))
+  }, content));
 };
+
 var Icon = function Icon(_ref4) {
   var cx = _ref4.cx,
-    cy = _ref4.cy,
-    _ref4$config = _ref4.config,
-    mode = _ref4$config.mode,
-    inner = _ref4$config.inner,
-    outer = _ref4$config.outer,
-    color = _ref4$config.color,
-    radius = _ref4$config.radius,
-    image = _ref4$config.image,
-    _ref4$config$size = _ref4$config.size,
-    width = _ref4$config$size.width,
-    height = _ref4$config$size.height;
+      cy = _ref4.cy,
+      _ref4$config = _ref4.config,
+      mode = _ref4$config.mode,
+      inner = _ref4$config.inner,
+      outer = _ref4$config.outer,
+      color = _ref4$config.color,
+      radius = _ref4$config.radius,
+      image = _ref4$config.image,
+      _ref4$config$size = _ref4$config.size,
+      width = _ref4$config$size.width,
+      height = _ref4$config$size.height;
   return mode == "single" ? /*#__PURE__*/React.createElement(Circle, {
     cx: cx,
     cy: cy,
@@ -182,11 +209,12 @@ var Icon = function Icon(_ref4) {
     xlinkHref: window.appConfig.ASSETS_URL + image
   }));
 };
+
 var Circle = function Circle(_ref5) {
   var cx = _ref5.cx,
-    cy = _ref5.cy,
-    color = _ref5.color,
-    radius = _ref5.radius;
+      cy = _ref5.cy,
+      color = _ref5.color,
+      radius = _ref5.radius;
   return /*#__PURE__*/React.createElement("circle", {
     cx: cx,
     cy: cy,
@@ -195,34 +223,40 @@ var Circle = function Circle(_ref5) {
     stroke: "none"
   });
 };
+
 var getVerticalLabel = function getVerticalLabel(_ref6) {
   var _ref6$position = _ref6.position,
-    position = _ref6$position === void 0 ? "outerStart" : _ref6$position,
-    width = _ref6.width,
-    y = _ref6.y,
-    y1 = _ref6.y1,
-    y2 = _ref6.y2;
+      position = _ref6$position === void 0 ? "outerStart" : _ref6$position,
+      width = _ref6.width,
+      y = _ref6.y,
+      y1 = _ref6.y1,
+      y2 = _ref6.y2;
+
   switch (position) {
     case "start":
       return {
         x: y > 0 ? y2 : y1,
         textAnchor: "start"
       };
+
     case "middle":
       return {
         x: (y1 + y2) / 2,
         textAnchor: "middle"
       };
+
     case "end":
       return {
         x: y > 0 ? y1 : y2,
         textAnchor: "end"
       };
+
     case "outerStart":
       return {
         x: y1,
         textAnchor: y > 0 ? "start" : "end"
       };
+
     case "chartStart":
       return {
         x: y > 0 ? width : 0,
@@ -230,34 +264,40 @@ var getVerticalLabel = function getVerticalLabel(_ref6) {
       };
   }
 };
+
 var getHorizontalLabel = function getHorizontalLabel(_ref7) {
   var _ref7$position = _ref7.position,
-    position = _ref7$position === void 0 ? "outerStart" : _ref7$position,
-    height = _ref7.height,
-    y = _ref7.y,
-    y1 = _ref7.y1,
-    y2 = _ref7.y2;
+      position = _ref7$position === void 0 ? "outerStart" : _ref7$position,
+      height = _ref7.height,
+      y = _ref7.y,
+      y1 = _ref7.y1,
+      y2 = _ref7.y2;
+
   switch (position) {
     case "start":
       return {
         y: y > 0 ? y1 : y2,
         dominantBaseline: "text-after-edge"
       };
+
     case "middle":
       return {
         y: (y1 + y2) / 2,
         dominantBaseline: "middle"
       };
+
     case "end":
       return {
         y: y > 0 ? y2 : y1,
         dominantBaseline: "text-before-edge"
       };
+
     case "outerStart":
       return {
         y: y2,
         dominantBaseline: y >= 0 ? "text-after-edge" : "text-before-edge"
       };
+
     case "chartStart":
       return {
         y: y > 0 ? 0 : height,

package/lib/components/Legend.js

@@ -1,79 +1,96 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 var _typeof = require("@babel/runtime/helpers/typeof");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
+
 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 _react = _interopRequireWildcard(require("react"));
+
 var _utils = require("../utils");
+
 var _TextOverflow = _interopRequireDefault(require("./TextOverflow"));
+
 var _excluded = ["italic", "bold"];
-/**
- * 图例
- */
+
 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); }
+
 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 defaultFont = {
   fontStyle: 'normal',
   fontWeight: 'normal'
 };
+
 var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
   var series = _ref.series,
-    config = _ref.config,
-    _ref$config = _ref.config,
-    show = _ref$config.show,
-    _ref$config$order = _ref$config.order,
-    order = _ref$config$order === void 0 ? '' : _ref$config$order,
-    interactive = _ref$config.interactive,
-    maxWidth = _ref$config.maxWidth,
-    textOverflow = _ref$config.textOverflow,
-    speed = _ref$config.speed,
-    _ref$config$layout = _ref$config.layout,
-    _ref$config$layout$al = _ref$config$layout.alignment,
-    alignment = _ref$config$layout$al === void 0 ? 'right center' : _ref$config$layout$al,
-    gridTemplateColumns = _ref$config$layout.gridTemplateColumns,
-    _ref$config$layout$gr = _ref$config$layout.gridGap,
-    gridColumnGap = _ref$config$layout$gr.gridColumnGap,
-    gridRowGap = _ref$config$layout$gr.gridRowGap,
-    _ref$config$layout$tr = _ref$config$layout.translate,
-    x = _ref$config$layout$tr.x,
-    y = _ref$config$layout$tr.y,
-    _ref$config$font = _ref$config.font,
-    _ref$config$font2 = _ref$config$font === void 0 ? defaultFont : _ref$config$font,
-    italic = _ref$config$font2.italic,
-    bold = _ref$config$font2.bold,
-    font = (0, _objectWithoutProperties2["default"])(_ref$config$font2, _excluded),
-    _ref$config$unselect = _ref$config.unselect,
-    _ref$config$unselect2 = _ref$config$unselect === void 0 ? {} : _ref$config$unselect,
-    _ref$config$unselect3 = _ref$config$unselect2.opacity,
-    opacity = _ref$config$unselect3 === void 0 ? 1 : _ref$config$unselect3,
-    filterData = _ref.filterData,
-    formatter = _ref.formatter,
-    judge = _ref.judge;
+      config = _ref.config,
+      _ref$config = _ref.config,
+      show = _ref$config.show,
+      _ref$config$order = _ref$config.order,
+      order = _ref$config$order === void 0 ? '' : _ref$config$order,
+      interactive = _ref$config.interactive,
+      maxWidth = _ref$config.maxWidth,
+      textOverflow = _ref$config.textOverflow,
+      speed = _ref$config.speed,
+      _ref$config$layout = _ref$config.layout,
+      _ref$config$layout$al = _ref$config$layout.alignment,
+      alignment = _ref$config$layout$al === void 0 ? 'right center' : _ref$config$layout$al,
+      gridTemplateColumns = _ref$config$layout.gridTemplateColumns,
+      _ref$config$layout$gr = _ref$config$layout.gridGap,
+      gridColumnGap = _ref$config$layout$gr.gridColumnGap,
+      gridRowGap = _ref$config$layout$gr.gridRowGap,
+      _ref$config$layout$tr = _ref$config$layout.translate,
+      x = _ref$config$layout$tr.x,
+      y = _ref$config$layout$tr.y,
+      _ref$config$font = _ref$config.font;
+  _ref$config$font = _ref$config$font === void 0 ? defaultFont : _ref$config$font;
+  var italic = _ref$config$font.italic,
+      bold = _ref$config$font.bold,
+      font = (0, _objectWithoutProperties2["default"])(_ref$config$font, _excluded),
+      _ref$config$unselect = _ref$config.unselect;
+  _ref$config$unselect = _ref$config$unselect === void 0 ? {} : _ref$config$unselect;
+  var _ref$config$unselect$ = _ref$config$unselect.opacity,
+      opacity = _ref$config$unselect$ === void 0 ? 1 : _ref$config$unselect$,
+      filterData = _ref.filterData,
+      formatter = _ref.formatter,
+      judge = _ref.judge;
   if (!show) return null;
+
   var _series = (0, _utils.sortPie)(series, order);
+
   var _alignment$split = alignment.split(' '),
-    _alignment$split2 = (0, _slicedToArray2["default"])(_alignment$split, 2),
-    _alignment = _alignment$split2[0],
-    position = _alignment$split2[1];
+      _alignment$split2 = (0, _slicedToArray2["default"])(_alignment$split, 2),
+      _alignment = _alignment$split2[0],
+      position = _alignment$split2[1];
+
   var length = _series.length;
   var onClick = (0, _react.useCallback)(function (e) {
     var dataset = e.currentTarget.dataset;
     var name = dataset.name;
     filterData && interactive && filterData(name);
   }, [interactive, filterData]);
+
   if (judge == 0) {
     _series.forEach(function (d) {
       d.percent = 0;
     });
   }
+
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: "__easyv-legend-wrapper",
     style: _objectSpread({
@@ -90,12 +107,15 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
     }
   }, _series.map(function (series, index) {
     var _series$config, _series$config$line;
+
     var type = series.type,
-      name = series.name,
-      displayName = series.displayName,
-      icon = series.icon,
-      selected = series.selected;
+        name = series.name,
+        displayName = series.displayName,
+        icon = series.icon,
+        selected = series.selected;
+
     var _icon = (0, _utils.getIcon)(type, icon, series === null || series === void 0 ? void 0 : (_series$config = series.config) === null || _series$config === void 0 ? void 0 : (_series$config$line = _series$config.line) === null || _series$config$line === void 0 ? void 0 : _series$config$line.type);
+
     return /*#__PURE__*/_react["default"].createElement("li", {
       key: index,
       onClick: onClick,
@@ -120,7 +140,9 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
     })));
   })));
 });
+
 exports["default"] = _default;
+
 var getPosition = function getPosition(position, alignment) {
   switch (position) {
     case 'top':
@@ -130,6 +152,7 @@ var getPosition = function getPosition(position, alignment) {
         top: 5,
         justifyContent: alignment === 'center' ? 'center' : alignment === 'left' ? 'flex-start' : 'flex-end'
       };
+
     case 'right':
       return {
         top: 0,
@@ -137,6 +160,7 @@ var getPosition = function getPosition(position, alignment) {
         right: 10,
         alignItems: alignment === 'center' ? 'center' : alignment === 'left' ? 'flex-start' : 'flex-end'
       };
+
     case 'left':
       return {
         top: 0,
@@ -144,6 +168,7 @@ var getPosition = function getPosition(position, alignment) {
         left: 10,
         alignItems: alignment === 'center' ? 'center' : alignment === 'left' ? 'flex-start' : 'flex-end'
       };
+
     default:
       return {
         left: 0,