@easyv/charts 1.4.24 → 1.4.26

package/lib/components/Marquee.js

@@ -45,7 +45,7 @@ var _default = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef
     //初始化观察器，利用观察器来监视组件可视区域变化
     observe.current = new IntersectionObserver(function (entries) {
       var entrie = entries[0];
-      if (entrie.boundingClientRect.width < entrie.rootBounds.width) {
+      if (entrie.boundingClientRect.width <= entrie.rootBounds.width) {
         //表示文字全部可视
         cancelAnimationFrame(timer.current || 0);
         target.current.style.transform = "translate(0px,0px)"; //重置偏移

package/lib/components/PieChart.js

@@ -21,6 +21,7 @@ var _LinearGradient = _interopRequireDefault(require("./LinearGradient"));
 var _formatter = require("../formatter");
 var _piechartModule = _interopRequireDefault(require("../css/piechart.module.css"));
 var _hooks = require("../hooks");
+var _PieTooltip = require("./PieTooltip");
 var _excluded = ["startAngle", "endAngle", "antiClockwise"],
   _excluded2 = ["padAngle", "innerRadius", "outerRadius", "cornerRadius", "startAngle", "endAngle"],
   _excluded3 = ["formatter"],
@@ -38,7 +39,7 @@ var defaultChart = {
   innerRadius: 0,
   cornerRadius: 0,
   rose: false,
-  roseType: 'radius',
+  roseType: "radius",
   baseRadius: 0,
   padAngle: 0
 };
@@ -49,14 +50,14 @@ var defaultAngle = {
 };
 var nameDy = function nameDy(showValue, showPercent, mode, dir) {
   if (showValue || showPercent) {
-    if (mode == 'vertical') {
-      return dir == 1 ? '1.1em' : '-2.6em';
+    if (mode == "vertical") {
+      return dir == 1 ? "1.1em" : "-2.6em";
     } else {
       return 0;
     }
   } else {
-    if (mode == 'vertical') {
-      return dir * 1.1 + 'em';
+    if (mode == "vertical") {
+      return dir * 1.1 + "em";
     } else {
       return 0;
     }
@@ -64,14 +65,14 @@ var nameDy = function nameDy(showValue, showPercent, mode, dir) {
 };
 var valueDy = function valueDy(value1, mode, dir) {
   if (value1) {
-    if (mode == 'vertical') {
-      return '1.5em';
+    if (mode == "vertical") {
+      return "1.5em";
     } else {
       return 0;
     }
   } else {
-    if (mode == 'vertical') {
-      return dir == 1 ? '1.1em' : '-1.1em';
+    if (mode == "vertical") {
+      return dir == 1 ? "1.1em" : "-1.1em";
     } else {
       return 0;
     }
@@ -82,14 +83,14 @@ var percentDy_ = function percentDy_(showName, showValue, mode, dir) {
     return 0;
   }
   if (showName) {
-    if (mode == 'vertical') {
-      return '1.5em';
+    if (mode == "vertical") {
+      return "1.5em";
     } else {
       return 0;
     }
   } else {
-    if (mode == 'vertical') {
-      return dir * 1.1 + 'em';
+    if (mode == "vertical") {
+      return dir * 1.1 + "em";
     } else {
       return 0;
     }
@@ -97,13 +98,13 @@ var percentDy_ = function percentDy_(showName, showValue, mode, dir) {
 };
 var percentX = function percentX(showName, showValue, mode, x) {
   if (showValue) {
-    return '';
+    return "";
   }
   if (showName) {
-    if (mode == 'vertical') {
+    if (mode == "vertical") {
       return x;
     } else {
-      return '';
+      return "";
     }
   } else {
     return x;
@@ -111,13 +112,13 @@ var percentX = function percentX(showName, showValue, mode, x) {
 };
 var percentDx = function percentDx(showName, showValue, mode) {
   if (showValue) {
-    return '0.5em';
+    return "0.5em";
   }
   if (showName) {
-    if (mode == 'vertical') {
+    if (mode == "vertical") {
       return 0;
     } else {
-      return '0.5em';
+      return "0.5em";
     }
   } else {
     return 0;
@@ -128,8 +129,8 @@ var percentDy = function percentDy(showName, showValue, mode) {
     return 0;
   }
   if (showName) {
-    if (mode == 'vertical') {
-      return '1.5em';
+    if (mode == "vertical") {
+      return "1.5em";
     } else {
       return 0;
     }
@@ -139,12 +140,12 @@ var percentDy = function percentDy(showName, showValue, mode) {
 };
 var valueDx = function valueDx(showName, mode) {
   if (!showName) {
-    return '';
+    return "";
   }
-  if (mode == 'vertical') {
-    return '';
+  if (mode == "vertical") {
+    return "";
   } else {
-    return '0.5em';
+    return "0.5em";
   }
 };
 var getCoord = function getCoord(deg, radius) {
@@ -189,7 +190,7 @@ var getArc = function getArc(radius, _ref3, series_, index) {
     return s.fieldName == rest.data.s;
   }) || series_[index % series_.length];
   return _objectSpread(_objectSpread({}, rest), {}, {
-    type: 'pie',
+    type: "pie",
     fieldName: series.fieldName,
     displayName: series.displayName || rest.data.s,
     series: series,
@@ -282,6 +283,9 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
     gap = _ref5$config$animatio6 === void 0 ? 0 : _ref5$config$animatio6,
     _ref5$config$animatio7 = _ref5$config$animatio.rotate,
     rotate = _ref5$config$animatio7 === void 0 ? 0 : _ref5$config$animatio7,
+    _ref5$config$tooltip = _ref5$config.tooltip,
+    tooltip = _ref5$config$tooltip === void 0 ? {} : _ref5$config$tooltip,
+    config = _ref5.config,
     _ref5$state = _ref5.state,
     currentIndex = _ref5$state.currentIndex,
     trigger = _ref5$state.trigger,
@@ -341,15 +345,15 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
       roseType = _chart.roseType;
     var _padAngle = padAngle * Math.PI / 180;
     switch (order) {
-      case '':
+      case "":
         arcsFunc.sort(null);
         break;
-      case 'desc':
+      case "desc":
         arcsFunc.sort(function (a, b) {
           return b.y - a.y;
         });
         break;
-      case 'asc':
+      case "asc":
         arcsFunc.sort(function (a, b) {
           return a.y - b.y;
         });
@@ -383,9 +387,9 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
           endAngle = _ref6.endAngle,
           arc = (0, _objectWithoutProperties2["default"])(_ref6, _excluded4);
         return _objectSpread(_objectSpread({}, arc), {}, {
-          id: id + '_linear_' + index,
-          startAngle: roseType == 'area' ? _angle * index : startAngle,
-          endAngle: roseType == 'area' ? _angle * (index + 1) : endAngle,
+          id: id + "_linear_" + index,
+          startAngle: roseType == "area" ? _angle * index : startAngle,
+          endAngle: roseType == "area" ? _angle * (index + 1) : endAngle,
           cornerRadius: cornerRadius,
           padAngle: _padAngle,
           innerRadius: innerRadius,
@@ -395,7 +399,7 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
     }
     return _legendDataWithPercent.map(function (arc, index) {
       return _objectSpread(_objectSpread({}, arc), {}, {
-        id: id + '_linear_' + index,
+        id: id + "_linear_" + index,
         cornerRadius: cornerRadius,
         padAngle: _padAngle,
         innerRadius: innerRadius,
@@ -415,22 +419,26 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
   var onClick = (0, _react.useCallback)(function (e) {
     return onEvent({
       currentIndex: +e.currentTarget.dataset.index,
-      type: 'onClick'
+      type: "onClick"
     });
   }, [onEvent]);
   var onMouseEnter = (0, _react.useCallback)(function (e) {
     var _data = arcs[+currentIndex].data;
     triggerOnRelative(_data);
-    onEmit('onMouseEnter', _data);
+    onEmit("onMouseEnter", _data);
     onEvent({
       currentIndex: +e.currentTarget.dataset.index,
-      type: 'onMouseEnter'
+      type: "onMouseEnter"
     });
   }, [onEvent, triggerOnRelative, onEmit]);
   var onMouseLeave = (0, _react.useCallback)(function (e) {
-    return onEvent({
+    setMousePos({
+      x: 0,
+      y: 0
+    });
+    onEvent({
       currentIndex: +e.currentTarget.dataset.index,
-      type: 'onMouseLeave'
+      type: "onMouseLeave"
     });
   }, [onEvent]);
   (0, _react.useLayoutEffect)(function () {
@@ -448,11 +456,11 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
         onComplete: function onComplete() {
           var _data = arcs[+currentIndex].data;
           triggerOnRelative(_data);
-          onEmit('carousel', _data);
+          onEmit("carousel", _data);
         }
       });
     } else {
-      if (currentIndex !== null && trigger === 'onClick') {
+      if (currentIndex !== null && trigger === "onClick") {
         var _data = arcs[+currentIndex].data;
         triggerOnRelative(_data);
         onEmit(trigger, _data);
@@ -488,16 +496,29 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
     maxRadius = Math.max(maxRadius, d.outerRadius);
   });
   var centerRadius = 0.5 * maxRadius + 0.5 * _arcs[0].innerRadius;
+  var _useState3 = (0, _react.useState)({
+      x: 0,
+      y: 0
+    }),
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    mousePos = _useState4[0],
+    setMousePos = _useState4[1];
+  var _useState5 = (0, _react.useState)(null),
+    _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
+    hoverData = _useState6[0],
+    setHoverData = _useState6[1];
+  var pieWarpEl = (0, _react.useRef)(null);
   return outerDecorate ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_.ChartContainer //用于生成甜甜圈图，判断依据是外环装饰这个配置项(outerDecorate)
   , {
     width: width,
     height: height,
     marginLeft: marginLeft,
-    marginTop: marginTop
+    marginTop: marginTop,
+    ref: pieWarpEl
   }, /*#__PURE__*/_react["default"].createElement("g", {
     style: {
-      transition: 'transform ease-in-out 0.3s',
-      transform: 'translate(' + halfChartWidth + 'px, ' + halfChartHeight + 'px) rotate(' + rotate_ + 'deg)'
+      transition: "transform ease-in-out 0.3s",
+      transform: "translate(" + halfChartWidth + "px, " + halfChartHeight + "px) rotate(" + rotate_ + "deg)"
     }
   },
   //用于生成外环装饰的刻度
@@ -523,7 +544,7 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
     return /*#__PURE__*/_react["default"].createElement(_react.Fragment, {
       key: index
     }, /*#__PURE__*/_react["default"].createElement("path", {
-      className: _piechartModule["default"]['inner-arc'],
+      className: _piechartModule["default"]["inner-arc"],
       style: {
         strokeDasharray: "".concat(dashLength, ",").concat(2 * dashLength),
         strokeDashoffset: dashLength,
@@ -533,8 +554,20 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
       onClick: onClick,
       onMouseEnter: onMouseEnter,
       onMouseLeave: onMouseLeave,
-      d: path.split('L')[0],
-      stroke: 'url(#' + id + ')',
+      onMouseMove: function onMouseMove(e) {
+        var _data = arcs[+e.currentTarget.dataset.index];
+        var warpBoxPos = {
+          x: pieWarpEl.current.getBoundingClientRect().x,
+          y: pieWarpEl.current.getBoundingClientRect().y
+        };
+        setMousePos({
+          x: e.clientX - warpBoxPos.x,
+          y: e.clientY - warpBoxPos.y
+        });
+        setHoverData(_data);
+      },
+      d: path.split("L")[0],
+      stroke: "url(#" + id + ")",
       strokeWidth: arcWidth,
       fill: "none"
     }), /*#__PURE__*/_react["default"].createElement("defs", null, /*#__PURE__*/_react["default"].createElement(_LinearGradient["default"], {
@@ -549,7 +582,16 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
     }),
     arcs: _arcs,
     judge: judgeData
-  }))), /*#__PURE__*/_react["default"].createElement(_.Legend, (0, _extends2["default"])({}, legend, {
+  }))), tooltip && mousePos && mousePos.x != 0 && mousePos.y != 0 && tooltip.manual && /*#__PURE__*/_react["default"].createElement(_PieTooltip.PieTooltip, {
+    series: series,
+    data: hoverData,
+    config: tooltip,
+    pieCenter: {
+      x: halfChartWidth,
+      y: maxRadius + marginTop
+    },
+    mousePos: mousePos
+  }), /*#__PURE__*/_react["default"].createElement(_.Legend, (0, _extends2["default"])({}, legend, {
     series: _arcs,
     formatter: formatter,
     judge: judgeData
@@ -563,11 +605,12 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
     },
     onMouseLeave: function onMouseLeave() {
       hoverEvent(false);
-    }
+    },
+    ref: pieWarpEl
   }, /*#__PURE__*/_react["default"].createElement("g", {
     style: {
-      transition: 'transform ease-in-out 0.3s',
-      transform: 'translate(' + halfChartWidth + 'px, ' + halfChartHeight + 'px) rotate(' + rotate_ + 'deg)'
+      transition: "transform ease-in-out 0.3s",
+      transform: "translate(" + halfChartWidth + "px, " + halfChartHeight + "px) rotate(" + rotate_ + "deg)"
     }
   }, _arcs.map(function (_ref8, index) {
     var id = _ref8.id,
@@ -585,13 +628,13 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
     var path = arc.innerRadius(innerRadius + deltaHeighten).outerRadius(outerRadius + deltaHeighten)(value);
     var pie = (0, _utils.getColorList)(series.color);
     var currentPie = animateColor ? (0, _utils.getColorList)(animateColor) : (0, _utils.getColorList)(series.color);
-    var textPath = '',
+    var textPath = "",
       categoryTextStyle = {};
     if (categoryText && categoryText.show) {
       //如果有类目文本，则需要计算文字路径
       //let offsetWidth=decorate2.radiusWidth/2 + radiusWidthAdd/2;   //当前文字需生成在装饰物内，故而半径需要减小
       var textArc = arc.innerRadius(outerRadius + (current ? gap : categoryText.gap)).outerRadius(outerRadius + (current ? gap : categoryText.gap))(value);
-      var lastA = textArc.lastIndexOf('A');
+      var lastA = textArc.lastIndexOf("A");
       textPath = textArc.slice(0, lastA > 0 ? lastA : textArc.length); //文字路径
       categoryTextStyle = current ? animateCTS : categoryText.textStyle; //这里把textstyle拿出来
     }
@@ -603,10 +646,22 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
       onClick: onClick,
       onMouseEnter: onMouseEnter,
       onMouseLeave: onMouseLeave,
+      onMouseMove: function onMouseMove(e) {
+        var _data = arcs[+e.currentTarget.dataset.index];
+        var warpBoxPos = {
+          x: pieWarpEl.current.getBoundingClientRect().x,
+          y: pieWarpEl.current.getBoundingClientRect().y
+        };
+        setMousePos({
+          x: e.clientX - warpBoxPos.x,
+          y: e.clientY - warpBoxPos.y
+        });
+        setHoverData(_data);
+      },
       d: path,
-      stroke: show ? color : 'none',
-      strokeWidth: show ? strokeWidth : '0',
-      fill: 'url(#' + id + ')',
+      stroke: show ? color : "none",
+      strokeWidth: show ? strokeWidth : "0",
+      fill: "url(#" + id + ")",
       fillOpacity: fillOpacity
     }),
     //装饰物2，产生于每个弧的外部
@@ -616,9 +671,9 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
       onMouseEnter: onMouseEnter,
       onMouseLeave: onMouseLeave,
       d: arc.innerRadius(outerRadius).outerRadius(outerRadius + decorate2.radiusWidth + (current ? radiusWidthAdd : 0))(value),
-      stroke: show ? color : 'none',
-      strokeWidth: show ? strokeWidth : '0',
-      fill: 'url(#' + id + ')',
+      stroke: show ? color : "none",
+      strokeWidth: show ? strokeWidth : "0",
+      fill: "url(#" + id + ")",
       fillOpacity: decorate2.opacity / 100
     }),
     //类目文本
@@ -626,21 +681,21 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
       onClick: onClick,
       onMouseEnter: onMouseEnter,
       onMouseLeave: onMouseLeave,
-      id: id + '_text_' + index,
+      id: id + "_text_" + index,
       d: textPath,
       fill: "none",
       stroke: "none"
     }), /*#__PURE__*/_react["default"].createElement("text", {
       textAnchor: "middle",
       style: _objectSpread(_objectSpread({}, categoryTextStyle), {}, {
-        fontWeight: categoryTextStyle.bold ? 'bold' : 'normal',
-        fontStyle: categoryTextStyle.italic ? 'italic' : 'normal',
-        pointerEvents: 'none'
+        fontWeight: categoryTextStyle.bold ? "bold" : "normal",
+        fontStyle: categoryTextStyle.italic ? "italic" : "normal",
+        pointerEvents: "none"
       }),
       fill: categoryTextStyle.color
     }, /*#__PURE__*/_react["default"].createElement("textPath", {
       startOffset: "50%",
-      href: '#' + id + '_text_' + index
+      href: "#" + id + "_text_" + index
     }, _arcs[index].displayName || _arcs[index].fieldName))), /*#__PURE__*/_react["default"].createElement("defs", null, /*#__PURE__*/_react["default"].createElement(_LinearGradient["default"], {
       id: id,
       colors: current ? currentPie : pie,
@@ -654,7 +709,7 @@ var Component = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
   }), current && /*#__PURE__*/_react["default"].createElement("g", {
     fillOpacity: y,
     style: {
-      transform: 'rotate(' + -rotate_ + 'deg)'
+      transform: "rotate(" + -rotate_ + "deg)"
     }
   }, /*#__PURE__*/_react["default"].createElement(Current, {
     config: current,
@@ -671,6 +726,15 @@ 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, {
+    series: series,
+    data: hoverData,
+    config: tooltip,
+    pieCenter: {
+      x: halfChartWidth,
+      y: maxRadius + marginTop
+    },
+    mousePos: mousePos
   }), /*#__PURE__*/_react["default"].createElement(_.Legend, (0, _extends2["default"])({}, legend, {
     series: _arcs,
     formatter: formatter,
@@ -717,7 +781,7 @@ var Current = function Current(_ref9) {
     currentIndex = _ref9.currentIndex;
   var _data = (0, _react.useMemo)(function () {
     var legendDataWithPercent = (0, _utils.getDataWithPercent)(data, precision);
-    return (0, _utils.sortPie)(legendDataWithPercent, '');
+    return (0, _utils.sortPie)(legendDataWithPercent, "");
   }, [data, precision]);
 
   //数据容错,当data都为零那么需要进行以下容错
@@ -739,19 +803,19 @@ var Current = function Current(_ref9) {
       width: width,
       height: height,
       transform: "translate(-".concat(width / 2, "px,-").concat(height / 2, "px)"),
-      pointerEvents: 'none'
+      pointerEvents: "none"
     },
     boxStyle = {
       //弹性盒子样式，用于当前值的上下居中对齐等
       width: width,
       height: height,
-      display: 'flex',
-      flexDirection: 'column',
-      justifyContent: 'center',
-      alignItems: 'center'
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "center",
+      alignItems: "center"
     };
   var seriesColor = currentData.series.color;
-  seriesColor = seriesColor.type == 'pure' ? seriesColor.pure : seriesColor.linear.stops[0].color;
+  seriesColor = seriesColor.type == "pure" ? seriesColor.pure : seriesColor.linear.stops[0].color;
   return show && /*#__PURE__*/_react["default"].createElement("foreignObject", {
     style: foreignStyle
   }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -765,33 +829,33 @@ var Current = function Current(_ref9) {
       display: textOverflow == "marquee" ? "flex" : "bolck",
       justifyContent: "center"
     }, (0, _utils.getFontStyle)(nameFont)), {}, {
-      margin: gap / 2 + 'px 0',
+      margin: gap / 2 + "px 0",
       color: nameColor ? seriesColor : nameFont.color
     })
   }),
   //真实值
   showValue && /*#__PURE__*/_react["default"].createElement("span", {
     style: _objectSpread(_objectSpread({}, (0, _utils.getFontStyle)(valueFont)), {}, {
-      transform: 'translate(' + translateValueX + 'px,' + translateValueY + 'px)',
-      margin: gap / 2 + 'px 0',
+      transform: "translate(" + translateValueX + "px," + translateValueY + "px)",
+      margin: gap / 2 + "px 0",
       color: valueColor ? seriesColor : valueFont.color
     })
   }, value, showSuffix && text && /*#__PURE__*/_react["default"].createElement("span", {
     style: {
       display: "inline-block",
-      transform: 'translate(' + translateSuffixX + 'px,' + translateSuffixY + 'px)',
+      transform: "translate(" + translateSuffixX + "px," + translateSuffixY + "px)",
       fontSize: fontSize
     }
   }, text)),
   //百分比值
   showPercent && /*#__PURE__*/_react["default"].createElement("span", {
     style: _objectSpread(_objectSpread({
-      transform: 'translate(' + translatePercentX + 'px,' + translatePercentY + 'px)'
+      transform: "translate(" + translatePercentX + "px," + translatePercentY + "px)"
     }, (0, _utils.getFontStyle)(percentFont)), {}, {
-      margin: gap / 2 + 'px 0',
+      margin: gap / 2 + "px 0",
       color: percentColor ? seriesColor : percentFont.color
     })
-  }, percent + '%')));
+  }, percent + "%")));
 };
 var Label = function Label(_ref10) {
   var _ref10$config = _ref10.config,
@@ -872,12 +936,12 @@ var Label = function Label(_ref10) {
     return show && (_showName || showPercent || showValue) && /*#__PURE__*/_react["default"].createElement("g", {
       key: index
     }, /*#__PURE__*/_react["default"].createElement("path", {
-      className: animation ? _piechartModule["default"]['label-line'] : '',
+      className: animation ? _piechartModule["default"]["label-line"] : "",
       style: {
         animationDelay: "".concat(animation ? (actualIndex + 1) * 2000 - 800 : 0, "ms")
       },
-      d: 'M' + x1 + ', ' + y1 + 'L' + x2 + ', ' + y2 + 'L' + x3 + ', ' + y2,
-      stroke: lineColor ? lineColor : type == 'pure' ? pure : stops[0].color,
+      d: "M" + x1 + ", " + y1 + "L" + x2 + ", " + y2 + "L" + x3 + ", " + y2,
+      stroke: lineColor ? lineColor : type == "pure" ? pure : stops[0].color,
       fill: "none"
     }), /*#__PURE__*/_react["default"].createElement("foreignObject", {
       width: "1",
@@ -888,7 +952,7 @@ var Label = function Label(_ref10) {
         overflow: "visible"
       }
     }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: animation ? _piechartModule["default"]['label-text'] : "",
+      className: animation ? _piechartModule["default"]["label-text"] : "",
       style: {
         transform: "translate(0,-50%)",
         whiteSpace: "nowrap",
@@ -915,7 +979,7 @@ var Label = function Label(_ref10) {
       }
     }, text)), showPercent && /*#__PURE__*/_react["default"].createElement("span", {
       style: (0, _utils.getFontStyle)(percentFont)
-    }, (_showValue ? '（' : '') + percent + '%' + (_showValue ? '）' : '')))));
+    }, (_showValue ? "（" : "") + percent + "%" + (_showValue ? "）" : "")))));
   }));
 };
 var RingLabel = function RingLabel(_ref12) {
@@ -997,12 +1061,12 @@ var RingLabel = function RingLabel(_ref12) {
     return show && (_showName || showPercent || _showValue) && /*#__PURE__*/_react["default"].createElement("g", {
       key: index
     }, /*#__PURE__*/_react["default"].createElement("path", {
-      className: _piechartModule["default"]['label-line'],
+      className: _piechartModule["default"]["label-line"],
       style: {
         animationDelay: "".concat((actualIndex + 1) * 2000 - 800, "ms")
       },
-      d: 'M' + x1 + ', ' + y1 + 'L' + x2 + ', ' + y2 + 'L' + x3 + ', ' + y2,
-      stroke: lineColor ? lineColor : type == 'pure' ? pure : stops[0].color,
+      d: "M" + x1 + ", " + y1 + "L" + x2 + ", " + y2 + "L" + x3 + ", " + y2,
+      stroke: lineColor ? lineColor : type == "pure" ? pure : stops[0].color,
       fill: "none"
     }), /*#__PURE__*/_react["default"].createElement("foreignObject", {
       width: "1",
@@ -1013,7 +1077,7 @@ var RingLabel = function RingLabel(_ref12) {
         overflow: "visible"
       }
     }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: _piechartModule["default"]['label-text'],
+      className: _piechartModule["default"]["label-text"],
       style: {
         transform: "translate(0,-50%)",
         whiteSpace: "nowrap",
@@ -1041,7 +1105,7 @@ var RingLabel = function RingLabel(_ref12) {
       }
     }, text)), showPercent && /*#__PURE__*/_react["default"].createElement("span", {
       style: (0, _utils.getFontStyle)(percentFont)
-    }, (_showValue ? '（' : '') + percent + '%' + (_showValue ? '）' : '')))));
+    }, (_showValue ? "（" : "") + percent + "%" + (_showValue ? "）" : "")))));
   }));
 };
 var _default = (0, _.Mapping)((0, _.Carousel)(Component));

package/lib/components/index.js

@@ -137,6 +137,12 @@ Object.defineProperty(exports, "PieChart", {
     return _PieChart["default"];
   }
 });
+Object.defineProperty(exports, "PieTooltip", {
+  enumerable: true,
+  get: function get() {
+    return _PieTooltip.PieTooltip;
+  }
+});
 Object.defineProperty(exports, "StackData", {
   enumerable: true,
   get: function get() {
@@ -187,5 +193,6 @@ var _PieChart = _interopRequireDefault(require("./PieChart"));
 var _TextOverflow = _interopRequireDefault(require("./TextOverflow"));
 var _BaseLine = _interopRequireDefault(require("./BaseLine"));
 var _Control = _interopRequireDefault(require("./Control"));
+var _PieTooltip = require("./PieTooltip");
 var Area = _Line["default"];
 exports.Area = Area;