@easyv/charts 1.4.11 → 1.4.13

package/lib/components/Band.js

@@ -97,6 +97,7 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
       url = _ref3$config.url,
       size = _ref3$config.size,
       fill = _ref3$config.fill,
+      border = _ref3$config.border,
       opacity = _ref3$config.opacity,
       _ref3$config$highligh = _ref3$config.highlight,
       showHighlight = _ref3$config$highligh.show,
@@ -126,6 +127,7 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
   var _data = showHighlight ? getHighlightData(data, extent) : data;
 
   var isVertical = direction === 'vertical';
+  var borderStr = "".concat(border.borderColor, " solid ").concat(border.borderWidth, "px");
   return /*#__PURE__*/_react["default"].createElement("g", {
     className: "__easyv-band"
   }, _data.map(function (_ref4, i) {
@@ -180,7 +182,7 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
         transform: "translate(calc(-50% + ".concat(headTranslate.x, "px), calc(-50% + ").concat(headTranslate.y, "px))")
       }
     }), /*#__PURE__*/_react["default"].createElement("div", {
-      style: {
+      style: _objectSpread({
         width: '100%',
         height: '100%',
 
@@ -193,7 +195,15 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
           positive: y > 0,
           seriesWidth: seriesWidth
         })
-      }
+      }, isVertical ? {
+        borderTop: borderStr,
+        borderRight: borderStr,
+        borderBottom: borderStr
+      } : {
+        borderTop: borderStr,
+        borderRight: borderStr,
+        borderLeft: borderStr
+      })
     }));
   }));
 });

package/lib/components/CartesianChart.js

@@ -175,7 +175,7 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
     style: isVertical ? {
       width: xLineRange + marginRight + marginLeft,
       height: yLineRange,
-      transform: "translateX(".concat(-marginLeft, "px)")
+      transform: "translateX(".concat(-marginRight, "px)")
     } : {
       width: xLineRange,
       height: yLineRange + marginTop + marginBottom,

package/package.json

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

package/src/components/Band.tsx

@@ -76,6 +76,7 @@ export default memo(
       url,
       size,
       fill,
+      border,
       opacity,
       highlight: { show: showHighlight, extent, fill: highlightFill },
       headDecorate
@@ -97,6 +98,7 @@ export default memo(
     const _data = showHighlight ? getHighlightData(data, extent) : data;
 
     const isVertical = direction === 'vertical';
+    const borderStr = `${border.borderColor} solid ${border.borderWidth}px`;
     return (
       <g className='__easyv-band'>
         {_data.map(
@@ -181,6 +183,15 @@ export default memo(
                             positive: y > 0,
                             seriesWidth,
                           }),
+                    ...(isVertical?{
+                      borderTop:borderStr,
+                      borderRight:borderStr,
+                      borderBottom:borderStr
+                    }:{
+                      borderTop:borderStr,
+                      borderRight:borderStr,
+                      borderLeft:borderStr
+                    })
                   }}
                 />
               </foreignObject>

package/src/components/CartesianChart.js

@@ -160,7 +160,7 @@ const Chart = memo(
           <foreignObject style={isVertical?{
                width:xLineRange+marginRight+marginLeft,
                height:yLineRange,
-               transform:`translateX(${-marginLeft}px)`,
+               transform:`translateX(${-marginRight}px)`,
             }:{
             width:xLineRange,
             height:yLineRange+marginTop+marginBottom,