fix(line): use curveMonotone (#5751)

antvis · Nov 7, 2023 · 2bedfba · 2bedfba
1 parent db505fe
commit 2bedfba
Show file tree

Hide file tree

Showing 24 changed files with 62 additions and 4 deletions.
diff --git a/...integration/snapshots/animation/doughnut-purchases-line-path-in/interval0-0.png b/...integration/snapshots/animation/doughnut-purchases-line-path-in/interval0-0.png
diff --git a/...integration/snapshots/animation/doughnut-purchases-line-path-in/interval0-1.png b/...integration/snapshots/animation/doughnut-purchases-line-path-in/interval0-1.png
diff --git a/...integration/snapshots/animation/doughnut-purchases-line-path-in/interval0-2.png b/...integration/snapshots/animation/doughnut-purchases-line-path-in/interval0-2.png
diff --git a/__tests__/integration/snapshots/interaction/weather-line-legend-mark/step0.png b/__tests__/integration/snapshots/interaction/weather-line-legend-mark/step0.png
diff --git a/__tests__/integration/snapshots/interaction/weather-line-legend-mark/step1.png b/__tests__/integration/snapshots/interaction/weather-line-legend-mark/step1.png
diff --git a/__tests__/integration/snapshots/static/browserImageTrending.png b/__tests__/integration/snapshots/static/browserImageTrending.png
diff --git a/__tests__/integration/snapshots/static/forecastRangeAreaLine.png b/__tests__/integration/snapshots/static/forecastRangeAreaLine.png
diff --git a/__tests__/integration/snapshots/static/gammaRandomLineSortXQuantitative.png b/__tests__/integration/snapshots/static/gammaRandomLineSortXQuantitative.png
diff --git a/__tests__/integration/snapshots/static/mockLineCloseX.png b/__tests__/integration/snapshots/static/mockLineCloseX.png
diff --git a/__tests__/integration/snapshots/static/mockLineZeroX.png b/__tests__/integration/snapshots/static/mockLineZeroX.png
diff --git a/__tests__/integration/snapshots/static/mockLineZeroY.png b/__tests__/integration/snapshots/static/mockLineZeroY.png
diff --git a/__tests__/integration/snapshots/static/stocksLineSeriesGradient.png b/__tests__/integration/snapshots/static/stocksLineSeriesGradient.png
diff --git a/__tests__/integration/snapshots/static/weatherLineAreaDualAxis.png b/__tests__/integration/snapshots/static/weatherLineAreaDualAxis.png
diff --git a/__tests__/integration/snapshots/static/weatherLineMultiAxes.png b/__tests__/integration/snapshots/static/weatherLineMultiAxes.png
diff --git a/__tests__/integration/snapshots/static/weatherLineMultiAxesAutoPadding.png b/__tests__/integration/snapshots/static/weatherLineMultiAxesAutoPadding.png
diff --git a/__tests__/integration/snapshots/static/weatherLineMultiAxesLegend.png b/__tests__/integration/snapshots/static/weatherLineMultiAxesLegend.png
diff --git a/__tests__/integration/snapshots/static/weatherLineMultiScrollbar.png b/__tests__/integration/snapshots/static/weatherLineMultiScrollbar.png
diff --git a/__tests__/integration/snapshots/static/weatherLineMultiSlider.png b/__tests__/integration/snapshots/static/weatherLineMultiSlider.png
diff --git a/__tests__/integration/snapshots/static/weatherLineViewLabelTransform.png b/__tests__/integration/snapshots/static/weatherLineViewLabelTransform.png
diff --git a/__tests__/plots/static/index.ts b/__tests__/plots/static/index.ts
@@ -297,3 +297,6 @@ export { intervalPointBulletDatas } from './interval-point-bullet-datas';
 export { mockIntervalLine } from './mock-interval-line';
 export { alphabetIntervalSizedPadding } from './alphabet-interval-sized-padding';
 export { alphabetIntervalRotatePadding } from './alphabet-interval-rotate-padding';
+export { mockLineZeroX } from './mock-line-zero-x';
+export { mockLineZeroY } from './mock-line-zero-y';
+export { mockLineCloseX } from './mock-line-close-x';
diff --git a/__tests__/plots/static/mock-line-close-x.ts b/__tests__/plots/static/mock-line-close-x.ts
@@ -0,0 +1,14 @@
+import { G2Spec } from '../../../src';
+
+export function mockLineCloseX(): G2Spec {
+  return {
+    type: 'line',
+    data: [
+      { x: 0, y: 0 },
+      { x: 0.02, y: 0.8 },
+      { x: 1, y: 1 },
+    ],
+    encode: { x: 'x', y: 'y' },
+    style: { shape: 'smooth' },
+  };
+}
diff --git a/__tests__/plots/static/mock-line-zero-x.ts b/__tests__/plots/static/mock-line-zero-x.ts
@@ -0,0 +1,16 @@
+import { G2Spec } from '../../../src';
+
+export function mockLineZeroX(): G2Spec {
+  return {
+    type: 'line',
+    data: [
+      { date: '2-1', close: 1 },
+      { date: '2-2', close: 10 },
+      { date: '2-3', close: 0 },
+      { date: '2-4', close: 0 },
+      { date: '2-5', close: 12 },
+    ],
+    encode: { x: 'date', y: 'close' },
+    style: { shape: 'smooth' },
+  };
+}
diff --git a/__tests__/plots/static/mock-line-zero-y.ts b/__tests__/plots/static/mock-line-zero-y.ts
@@ -0,0 +1,17 @@
+import { G2Spec } from '../../../src';
+
+export function mockLineZeroY(): G2Spec {
+  return {
+    type: 'line',
+    coordinate: { transform: [{ type: 'transpose' }] },
+    data: [
+      { date: '2-1', close: 1 },
+      { date: '2-2', close: 10 },
+      { date: '2-3', close: 0 },
+      { date: '2-4', close: 0 },
+      { date: '2-5', close: 12 },
+    ],
+    encode: { x: 'date', y: 'close' },
+    style: { shape: 'smooth' },
+  };
+}
diff --git a/src/shape/line/smooth.ts b/src/shape/line/smooth.ts
@@ -1,5 +1,9 @@
-import { curveCatmullRom, curveCatmullRomClosed } from 'd3-shape';
-import { isPolar } from '../../utils/coordinate';
+import {
+  curveMonotoneX,
+  curveMonotoneY,
+  curveCatmullRomClosed,
+} from 'd3-shape';
+import { isPolar, isTranspose } from '../../utils/coordinate';
 import { ShapeComponent as SC } from '../../runtime';
 import { Curve } from './curve';
 
@@ -11,8 +15,12 @@ export const Smooth: SC<SmoothOptions> = (options, context) => {
   const { alpha = 0.5, ...rest } = options;
   const { coordinate } = context;
   return (...params) => {
-    const curve = isPolar(coordinate) ? curveCatmullRomClosed : curveCatmullRom;
-    return Curve({ curve: curve.alpha(alpha), ...rest }, context)(...params);
+    const curve = isPolar(coordinate)
+      ? curveCatmullRomClosed
+      : isTranspose(coordinate)
+      ? curveMonotoneY
+      : curveMonotoneX;
+    return Curve({ curve: curve, ...rest }, context)(...params);
   };
 };