@easyv/charts 1.0.66 → 1.0.67

package/lib/components/Line.js

@@ -69,6 +69,7 @@ var Area = function Area(_ref2) {
       return yScaler(y);
     }).y0(height).defined(defined);
     curve && areaGen.curve(_d3v.curveCatmullRom.alpha(tension));
+    curve && areaGen.curve(_d3v.curveMonotoneX);
     return areaGen;
   }, [xScaler, yScaler, curve, tension]);
   return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("path", {
@@ -134,6 +135,7 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
       return yScaler(y);
     })).defined(defined);
     curve && lineGen.curve(_d3v.curveCatmullRom.alpha(tension));
+    curve && lineGen.curve(_d3v.curveMonotoneX);
     return lineGen;
   }, [direction, xScaler, yScaler, tension, curve]);
   var path = lineGen(_data);

package/package.json

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

package/src/components/Line.js

@@ -2,7 +2,7 @@
  * 折线图
  */
 import React, { memo, useMemo } from 'react';
-import { line as d3Line, area as d3Area, curveCatmullRom } from 'd3v7';
+import { line as d3Line, area as d3Area, curveCatmullRom, curveMonotoneX } from 'd3v7';
 import { getColorList } from '../utils';
 import { Lighter, LinearGradient } from '.';
 
@@ -10,9 +10,9 @@ const defined = (d) => d.data.y != null;
 const getLineData = (data, connectNulls) =>
   connectNulls
     ? data.map(({ data, ...item }) => ({
-        ...item,
-        data: { ...data, y: +data.y },
-      }))
+      ...item,
+      data: { ...data, y: +data.y },
+    }))
     : data;
 
 const Area = ({
@@ -31,6 +31,7 @@ const Area = ({
       .y0(height)
       .defined(defined);
     curve && areaGen.curve(curveCatmullRom.alpha(tension));
+    curve && areaGen.curve(curveMonotoneX);
     return areaGen;
   }, [xScaler, yScaler, curve, tension]);
 
@@ -89,13 +90,14 @@ export default memo(
       let lineGen = (
         isVertical
           ? d3Line()
-              .y(({ data: { x } }) => xScaler(x))
-              .x(({ data: { y } }) => yScaler(y))
+            .y(({ data: { x } }) => xScaler(x))
+            .x(({ data: { y } }) => yScaler(y))
           : d3Line()
-              .x(({ data: { x } }) => xScaler(x))
-              .y(({ data: { y } }) => yScaler(y))
+            .x(({ data: { x } }) => xScaler(x))
+            .y(({ data: { y } }) => yScaler(y))
       ).defined(defined);
       curve && lineGen.curve(curveCatmullRom.alpha(tension));
+      curve && lineGen.curve(curveMonotoneX);
       return lineGen;
     }, [direction, xScaler, yScaler, tension, curve]);