@easyv/charts 1.6.11 → 1.6.12

package/lib/formatter/legend.js

@@ -25,12 +25,18 @@ var pieLegendFormatter = exports.pieLegendFormatter = function pieLegendFormatte
     textOverflow = _ref2$name.textOverflow,
     speed = _ref2$name.speed,
     maxWidth = _ref2$name.maxWidth,
+    _ref2$name$translate = _ref2$name.translate,
+    nameX = _ref2$name$translate.x,
+    nameY = _ref2$name$translate.y,
     _ref2$value = _ref2.value,
     showValue = _ref2$value.show,
     valueFont = _ref2$value.font,
     valueSameColor = _ref2$value.sameColor,
     valueGap = _ref2$value.gap,
     valueAlign = _ref2$value.align,
+    _ref2$value$translate = _ref2$value.translate,
+    valueX = _ref2$value$translate.x,
+    valueY = _ref2$value$translate.y,
     _ref2$value$suffix = _ref2$value.suffix,
     showSuffix = _ref2$value$suffix.show,
     text = _ref2$value$suffix.text,
@@ -43,14 +49,18 @@ var pieLegendFormatter = exports.pieLegendFormatter = function pieLegendFormatte
     percentFont = _ref2$percent.font,
     percentSameColor = _ref2$percent.sameColor,
     percentGap = _ref2$percent.gap,
-    percentAlign = _ref2$percent.align;
+    percentAlign = _ref2$percent.align,
+    _ref2$percent$transla = _ref2$percent.translate,
+    percentX = _ref2$percent$transla.x,
+    percentY = _ref2$percent$transla.y;
   var seriesColorType = seriesColor.type,
     pure = seriesColor.pure,
     stops = seriesColor.linear.stops;
   var _color = seriesColorType == 'pure' ? pure : stops[0].color;
   return /*#__PURE__*/React.createElement(React.Fragment, null, icon && /*#__PURE__*/React.createElement("span", {
     style: _objectSpread(_objectSpread({}, icon), {}, {
-      marginRight: icon.marginRight
+      marginRight: icon.marginRight,
+      transform: "translate(".concat(nameX, "px, ").concat(nameY, "px)")
     })
   }), /*#__PURE__*/React.createElement("div", {
     className: showName && showValue && showPercent ? _indexModule["default"].showAllStyle : _indexModule["default"].notShowAllStyle,
@@ -61,16 +71,18 @@ var pieLegendFormatter = exports.pieLegendFormatter = function pieLegendFormatte
     value: displayName,
     type: textOverflow,
     speed: speed,
-    style: _objectSpread({
+    style: _objectSpread(_objectSpread({
       width: maxWidth,
       marginLeft: 5
-    }, (0, _utils.getFontStyle)(nameFont))
+    }, (0, _utils.getFontStyle)(nameFont)), {}, {
+      transform: "translate(".concat(nameX, "px, ").concat(nameY, "px)")
+    })
   }), showValue && /*#__PURE__*/React.createElement("span", {
     style: _objectSpread(_objectSpread({
       whiteSpace: "nowrap"
     }, (0, _utils.getFontStyle)(valueFont)), {}, {
       marginLeft: valueGap,
-      // transform:`translateX(${valueGap}px)`,
+      transform: "translate(".concat(valueX, "px,").concat(valueY, "px)"),
       display: 'flex',
       flex: 1,
       color: valueSameColor ? _color : valueFont.color,
@@ -88,7 +100,7 @@ var pieLegendFormatter = exports.pieLegendFormatter = function pieLegendFormatte
       whiteSpace: "nowrap"
     }, (0, _utils.getFontStyle)(percentFont)), {}, {
       marginLeft: percentGap,
-      // transform:`translateX(${percentGap}px)`,
+      transform: "translate(".concat(percentX, "px,").concat(percentY, "px)"),
       display: "flex",
       flex: 1,
       alignItems: 'center',

package/package.json

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

package/src/formatter/legend.js

@@ -5,13 +5,17 @@ import { TextOverflow } from '../components';
 export const pieLegendFormatter = (
   { displayName, data, percent, series: { color: seriesColor, icon="" } },
   {
-    name: { show: showName, font: nameFont, textOverflow, speed, maxWidth },
+    name: { show: showName, font: nameFont, textOverflow, speed, maxWidth, translate: { x:nameX, y:nameY } },
     value: {
       show: showValue,
       font: valueFont,
       sameColor: valueSameColor,
       gap: valueGap,
       align: valueAlign,
+      translate: {
+        x:valueX,
+        y:valueY
+      },
       suffix: {
         show: showSuffix,
         text,
@@ -24,7 +28,11 @@ export const pieLegendFormatter = (
       font: percentFont,
       sameColor: percentSameColor,
       gap: percentGap,
-      align: percentAlign
+      align: percentAlign,
+      translate: {
+        x:percentX,
+        y:percentY
+      }
     },
   }
 ) => {
@@ -37,7 +45,7 @@ export const pieLegendFormatter = (
   const _color = seriesColorType == 'pure' ? pure : stops[0].color;
   return (
     <>
-      {icon &&<span style={{ ...icon, marginRight: icon.marginRight }} />}
+      {icon &&<span style={{ ...icon, marginRight: icon.marginRight, transform:`translate(${nameX}px, ${nameY}px)` }} />}
       <div
         className={
           showName && showValue && showPercent
@@ -50,7 +58,7 @@ export const pieLegendFormatter = (
       >
         {showName && (
           <TextOverflow value={displayName} type={textOverflow} speed={speed} style={{
-            width:maxWidth, marginLeft: 5, ...getFontStyle(nameFont)
+            width:maxWidth, marginLeft: 5, ...getFontStyle(nameFont), transform:`translate(${nameX}px, ${nameY}px)`
           }}></TextOverflow>
         )}
         {showValue && (
@@ -59,7 +67,7 @@ export const pieLegendFormatter = (
               whiteSpace:"nowrap",
               ...getFontStyle(valueFont),
               marginLeft: valueGap,
-              // transform:`translateX(${valueGap}px)`,
+              transform:`translate(${valueX}px,${valueY}px)`,
               display: 'flex',
               flex:1,
               color: valueSameColor ? _color : valueFont.color,
@@ -87,7 +95,7 @@ export const pieLegendFormatter = (
               whiteSpace:"nowrap",
               ...getFontStyle(percentFont),
               marginLeft: percentGap,
-              // transform:`translateX(${percentGap}px)`,
+              transform:`translate(${percentX}px,${percentY}px)`,
               display:"flex",
               flex:1,
               alignItems: 'center',