fix(scatter): fix edge scatter may be unexpectedly clipped due to tiny offset

src/chart/scatter/ScatterView.ts

@@ -99,9 +99,12 @@ class ScatterView extends ChartView {
     }
 
     _getClipShape(seriesModel: ScatterSeriesModel) {
+        if (!seriesModel.get('clip', true)) {
+            return;
+        }
         const coordSys = seriesModel.coordinateSystem;
-        const clipArea = coordSys && coordSys.getArea && coordSys.getArea();
-        return seriesModel.get('clip', true) ? clipArea : null;
+        // PENDING make `0.1` configurable, for example, `clipTolerance`?
+        return coordSys && coordSys.getArea && coordSys.getArea(.1);
     }
 
     _updateSymbolDraw(data: SeriesData, seriesModel: ScatterSeriesModel) {
@@ -131,4 +134,4 @@ class ScatterView extends ChartView {
     dispose() {}
 }
 
-export default ScatterView;
+export default ScatterView;

src/coord/CoordinateSystem.ts

@@ -149,7 +149,7 @@ export interface CoordinateSystem {
 
     getRoamTransform?: () => MatrixArray;
 
-    getArea?: () => CoordinateSystemClipArea
+    getArea?: (tolerance?: number) => CoordinateSystemClipArea
 
     // Only `coord/View.js` implements `getBoundingRect`.
     // But if other coord sys implement it, should follow this signature.

src/coord/cartesian/Cartesian2D.ts

@@ -178,13 +178,15 @@ class Cartesian2D extends Cartesian<Axis2D> implements CoordinateSystem {
      * Get rect area of cartesian.
      * Area will have a contain function to determine if a point is in the coordinate system.
      */
-    getArea(): Cartesian2DArea {
+    getArea(tolerance?: number): Cartesian2DArea {
+        tolerance = tolerance || 0;
+
         const xExtent = this.getAxis('x').getGlobalExtent();
         const yExtent = this.getAxis('y').getGlobalExtent();
-        const x = Math.min(xExtent[0], xExtent[1]);
-        const y = Math.min(yExtent[0], yExtent[1]);
-        const width = Math.max(xExtent[0], xExtent[1]) - x;
-        const height = Math.max(yExtent[0], yExtent[1]) - y;
+        const x = Math.min(xExtent[0], xExtent[1]) - tolerance;
+        const y = Math.min(yExtent[0], yExtent[1]) - tolerance;
+        const width = Math.max(xExtent[0], xExtent[1]) - x + tolerance;
+        const height = Math.max(yExtent[0], yExtent[1]) - y + tolerance;
 
         return new BoundingRect(x, y, width, height);
     }