test: add test cases

__tests__/plots/static/diamond-heatmap-density.ts

@@ -0,0 +1,64 @@
+import DataSet from '@antv/data-set';
+import { G2Spec } from '../../../src';
+
+export function DiamondHeatmapDensity(): G2Spec {
+  return {
+    type: 'view',
+    data: {
+      type: 'fetch',
+      value: 'data/diamond.csv',
+    },
+    scale: {
+      x: { nice: true, domainMin: -0.5 },
+      y: { nice: true, domainMin: -2000 },
+      color: { nice: true },
+    },
+    children: [
+      {
+        type: 'heatmap',
+        data: {
+          transform: [
+            {
+              type: 'custom',
+              callback: (data) => {
+                const dv = new DataSet.View().source(data);
+                // @ts-ignore
+                dv.transform({
+                  type: 'kernel-smooth.density',
+                  fields: ['carat', 'price'],
+                  as: ['carat', 'price', 'density'],
+                });
+                return dv.rows;
+              },
+            },
+          ],
+        },
+        encode: {
+          x: 'carat',
+          y: 'price',
+          color: 'density',
+        },
+        style: {
+          opacity: 0.3,
+          gradient: {
+            '0': 'white',
+            '0.2': 'blue',
+            '0.4': 'cyan',
+            '0.6': 'lime',
+            '0.8': 'yellow',
+            '0.9': 'red',
+          },
+        },
+      },
+      {
+        type: 'point',
+        encode: {
+          x: 'carat',
+          y: 'price',
+        },
+      },
+    ],
+  };
+}
+
+DiamondHeatmapDensity.maxError = 100;

__tests__/plots/static/index.ts

@@ -228,3 +228,4 @@ export { vaccinesCellScaleRelationAutoPaddingTickFilter } from './vaccines-cell-
 export { marketIntervalMarimekkoAutoPaddingFlex } from './market-interval-marimekko-auto-padding-flex';
 export { aaplIntervalDateEncodeX } from './aapl-interval-date-encode-x';
 export { HeatmapHeatmapBasic } from './heatmap-heatmap-basic';
+export { DiamondHeatmapDensity } from './diamond-heatmap-density';

package.json

@@ -68,6 +68,7 @@
     "pdfast": "^0.2.0"
   },
   "devDependencies": {
+    "@antv/data-set": "^0.11.8",
     "@antv/g-plugin-rough-canvas-renderer": "^1.7.9",
     "@antv/g-plugin-rough-svg-renderer": "^1.7.9",
     "@antv/g-svg": "^1.8.6",

src/shape/heatmap/renderer/index.ts

@@ -93,12 +93,11 @@ function drawAlpha(
     const rectX = x - radius;
     const rectY = y - radius;
 
-    // TODO: cache for performance.
     const tpl = getPointTemplate(radius, 1 - blur, createCanvas);
     // Value from minimum / value range, => [0, 1].
     const templateAlpha = (value - min) / (max - min);
-    // Small values are not visible because globalAlpha < .01 cannot be read from imageData.
-    shadowCtx.globalAlpha = Math.max(templateAlpha, 0.01);
+    // Small values are not visible because globalAlpha < .001 cannot be read from imageData.
+    shadowCtx.globalAlpha = Math.max(templateAlpha, 0.001);
     shadowCtx.drawImage(tpl, rectX, rectY);
   }
   return shadowCtx;