Release (#1633)

* feat: support size attenuation in annotation plugin (#1631) * feat: support size attenuation in annotation plugin * chore: commit changeset * chore(release): bump version (#1632) Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> --------- Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
antvis · Feb 23, 2024 · a43c19a · a43c19a
1 parent 76b373f
commit a43c19a
Show file tree

Hide file tree

Showing 122 changed files with 1,124 additions and 169 deletions.
diff --git a/__tests__/demos/plugin/annotation.ts b/__tests__/demos/plugin/annotation.ts
diff --git a/__tests__/index.html b/__tests__/index.html
@@ -4,6 +4,51 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>G: Preview</title>
+    <style>
+      .lil-gui.root {
+        position: absolute;
+        top: 0;
+        right: 0;
+        z-index: 1;
+        background: black;
+      }
+
+      .lil-gui.main li {
+        margin-left: 0 !important;
+        padding-left: 0 !important;
+        list-style-type: none !important;
+      }
+
+      .lil-gui li.title {
+        padding-left: 16px !important;
+      }
+
+      .lil-gui .c select {
+        color: black;
+      }
+
+      @keyframes animated-size {
+        0% {
+          width: 10px;
+          height: 500px;
+        }
+        50% {
+          width: 800px;
+          height: 500px;
+        }
+        100% {
+          width: 10px;
+          height: 500px;
+        }
+      }
+
+      .animatedCanvasSize {
+        animation-duration: 3s;
+        animation-iteration-count: infinite;
+        animation-name: animated-size;
+        animation-timing-function: ease;
+      }
+    </style>
   </head>
   <body>
     <div id="app"></div>

diff --git a/__tests__/main.ts b/__tests__/main.ts
@@ -1,4 +1,5 @@
-import { Canvas } from '../packages/g';
+import * as lil from 'lil-gui';
+import { Canvas, CanvasEvent } from '../packages/g';
 import { Renderer as CanvasRenderer } from '../packages/g-canvas';
 import { Renderer as CanvaskitRenderer } from '../packages/g-canvaskit';
 import { Renderer as SVGRenderer } from '../packages/g-svg';
@@ -52,7 +53,11 @@ selectChart.style.margin = '1em';
 renderOptions();
 selectChart.onchange = () => {
   const { value } = selectChart;
-  history.pushState({ value }, '', `?name=${value}`);
+  history.pushState(
+    { value },
+    '',
+    `?name=${value}&renderer=${selectRenderer.value}`,
+  );
   plot();
 };
 document.onkeydown = (event) => {
@@ -86,6 +91,12 @@ const selectRenderer = document.createElement('select');
 selectRenderer.style.margin = '1em';
 selectRenderer.append(...Object.keys(renderers).map(createOption));
 selectRenderer.onchange = () => {
+  const { value } = selectRenderer;
+  history.pushState(
+    { value },
+    '',
+    `?name=${selectChart.value}&renderer=${value}`,
+  );
   plot();
 };
 
@@ -111,7 +122,12 @@ addEventListener('popstate', (event) => {
 
 // @ts-ignore
 const initialValue = new URL(location).searchParams.get('name') as string;
+// @ts-ignore
+const initialRenderer = new URL(location).searchParams.get(
+  'renderer',
+) as string;
 if (tests[initialValue]) selectChart.value = initialValue;
+if (renderers[initialRenderer]) selectRenderer.value = initialRenderer;
 app.append(selectChart);
 app.append(searchInput);
 app.append(selectRenderer);
@@ -167,8 +183,14 @@ function createSpecRender(object) {
         ],
         // Used for WebGPU renderer
         shaderCompilerPath: '/glsl_wgsl_compiler_bg.wasm',
+        // enableDirtyRectangleRendering: false,
+        // enableDirtyRectangleRenderingDebug: true,
       });
 
+      if (generate.initRenderer) {
+        generate.initRenderer(renderer, selectRenderer.value);
+      }
+
       renderer.registerPlugin(
         new DragAndDropPlugin({ dragstartDistanceThreshold: 1 }),
       );
@@ -184,7 +206,36 @@ function createSpecRender(object) {
       // @ts-ignore
       window.__g_instances__ = [canvas];
 
-      await generate({ canvas, renderer, container: $div });
+      // GUI
+      const gui = new lil.GUI({ autoPlace: false });
+      $div.appendChild(gui.domElement);
+
+      await generate({ canvas, renderer, container: $div, gui });
+
+      if (
+        selectRenderer.value === 'canvas' &&
+        renderer.getConfig().enableDirtyRectangleRendering &&
+        renderer.getConfig().enableDirtyRectangleRenderingDebug
+      ) {
+        // display dirty rectangle
+        const $dirtyRectangle = document.createElement('div');
+        $dirtyRectangle.style.cssText = `
+        position: absolute;
+        pointer-events: none;
+        background: rgba(255, 0, 0, 0.5);
+        `;
+        $div.appendChild($dirtyRectangle);
+        canvas.addEventListener(CanvasEvent.DIRTY_RECTANGLE, (e) => {
+          const { dirtyRect } = e.detail;
+          const { x, y, width, height } = dirtyRect;
+          const dpr = window.devicePixelRatio;
+          // convert from canvas coords to viewport
+          $dirtyRectangle.style.left = `${x / dpr}px`;
+          $dirtyRectangle.style.top = `${y / dpr}px`;
+          $dirtyRectangle.style.width = `${width / dpr}px`;
+          $dirtyRectangle.style.height = `${height / dpr}px`;
+        });
+      }
 
       container.append($div);
     };

diff --git a/packages/g-camera-api/CHANGELOG.md b/packages/g-camera-api/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @antv/g-camera-api
 
+## 1.2.23
+
+### Patch Changes
+
+-   Updated dependencies [11d23f39]
+    -   @antv/g-lite@1.2.22
+
 ## 1.2.22
 
 ### Patch Changes

diff --git a/packages/g-camera-api/package.json b/packages/g-camera-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-camera-api",
-  "version": "1.2.22",
+  "version": "1.2.23",
   "description": "A simple implementation of Camera API.",
   "keywords": [
     "antv",

diff --git a/packages/g-canvas/CHANGELOG.md b/packages/g-canvas/CHANGELOG.md
@@ -1,5 +1,18 @@
 # @antv/g-canvas
 
+## 1.11.27
+
+### Patch Changes
+
+-   Updated dependencies [11d23f39]
+    -   @antv/g-lite@1.2.22
+    -   @antv/g-plugin-canvas-path-generator@1.3.22
+    -   @antv/g-plugin-canvas-picker@1.10.24
+    -   @antv/g-plugin-canvas-renderer@1.9.24
+    -   @antv/g-plugin-dom-interaction@1.9.22
+    -   @antv/g-plugin-html-renderer@1.9.25
+    -   @antv/g-plugin-image-loader@1.3.22
+
 ## 1.11.26
 
 ### Patch Changes

diff --git a/packages/g-canvas/package.json b/packages/g-canvas/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-canvas",
-  "version": "1.11.26",
+  "version": "1.11.27",
   "description": "A renderer implemented by Canvas 2D API",
   "keywords": [
     "antv",

diff --git a/packages/g-canvaskit/CHANGELOG.md b/packages/g-canvaskit/CHANGELOG.md
@@ -1,5 +1,18 @@
 # @antv/g-canvaskit
 
+## 0.10.27
+
+### Patch Changes
+
+-   Updated dependencies [11d23f39]
+    -   @antv/g-lite@1.2.22
+    -   @antv/g-plugin-canvas-path-generator@1.3.22
+    -   @antv/g-plugin-canvas-picker@1.10.24
+    -   @antv/g-plugin-canvaskit-renderer@1.3.23
+    -   @antv/g-plugin-dom-interaction@1.9.22
+    -   @antv/g-plugin-html-renderer@1.9.25
+    -   @antv/g-plugin-image-loader@1.3.22
+
 ## 0.10.26
 
 ### Patch Changes

diff --git a/packages/g-canvaskit/package.json b/packages/g-canvaskit/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-canvaskit",
-  "version": "0.10.26",
+  "version": "0.10.27",
   "description": "A renderer implemented by CanvasKit",
   "keywords": [
     "antv",

diff --git a/packages/g-components/CHANGELOG.md b/packages/g-components/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @antv/g-components
 
+## 1.9.22
+
+### Patch Changes
+
+-   Updated dependencies [11d23f39]
+    -   @antv/g-lite@1.2.22
+
 ## 1.9.21
 
 ### Patch Changes

diff --git a/packages/g-components/package.json b/packages/g-components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-components",
-  "version": "1.9.21",
+  "version": "1.9.22",
   "description": "Components for g",
   "keywords": [
     "antv",

diff --git a/packages/g-dom-mutation-observer-api/CHANGELOG.md b/packages/g-dom-mutation-observer-api/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @antv/g-dom-mutation-observer-api
 
+## 1.2.22
+
+### Patch Changes
+
+-   Updated dependencies [11d23f39]
+    -   @antv/g-lite@1.2.22
+
 ## 1.2.21
 
 ### Patch Changes

diff --git a/packages/g-dom-mutation-observer-api/package.json b/packages/g-dom-mutation-observer-api/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-dom-mutation-observer-api",
-  "version": "1.2.21",
+  "version": "1.2.22",
   "description": "A simple implementation of DOM MutationObserver API.",
   "keywords": [
     "antv",

diff --git a/packages/g-gesture/CHANGELOG.md b/packages/g-gesture/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @antv/g-gesture
 
+## 2.2.25
+
+### Patch Changes
+
+-   Updated dependencies [11d23f39]
+    -   @antv/g-lite@1.2.22
+
 ## 2.2.24
 
 ### Patch Changes

diff --git a/packages/g-gesture/package.json b/packages/g-gesture/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-gesture",
-  "version": "2.2.24",
+  "version": "2.2.25",
   "description": "G Gesture",
   "keywords": [
     "antv",

diff --git a/packages/g-image-exporter/CHANGELOG.md b/packages/g-image-exporter/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @antv/g-image-exporter
 
+## 0.7.22
+
+### Patch Changes
+
+-   Updated dependencies [11d23f39]
+    -   @antv/g-lite@1.2.22
+
 ## 0.7.21
 
 ### Patch Changes

diff --git a/packages/g-image-exporter/package.json b/packages/g-image-exporter/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-image-exporter",
-  "version": "0.7.21",
+  "version": "0.7.22",
   "description": "A image exporter for G using DOM API",
   "keywords": [
     "antv",

diff --git a/packages/g-lite/CHANGELOG.md b/packages/g-lite/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @antv/g-lite
 
+## 1.2.22
+
+### Patch Changes
+
+-   11d23f39: Support size attenuation.
+
 ## 1.2.21
 
 ### Patch Changes

diff --git a/packages/g-lite/package.json b/packages/g-lite/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g-lite",
-  "version": "1.2.21",
+  "version": "1.2.22",
   "description": "A core module for rendering engine implements DOM API.",
   "keywords": [
     "antv",

diff --git a/packages/g-lite/src/AbstractRenderer.ts b/packages/g-lite/src/AbstractRenderer.ts
@@ -86,6 +86,7 @@ export class AbstractRenderer implements IRenderer {
        */
       enableDirtyRectangleRendering: true,
       enableDirtyRectangleRenderingDebug: false,
+      enableSizeAttenuation: true,
       ...config,
     };
   }

diff --git a/packages/g-lite/src/Canvas.ts b/packages/g-lite/src/Canvas.ts
@@ -20,11 +20,11 @@ import { FrustumCullingStrategy } from './plugins/FrustumCullingStrategy';
 import { PrepareRendererPlugin } from './plugins/PrepareRendererPlugin';
 import { EventService, RenderReason, RenderingService } from './services';
 import type { PointLike } from './shapes';
-import type {
-  CanvasConfig,
-  ClipSpaceNearZ,
-  Cursor,
-  InteractivePointerEvent,
+import {
+  type CanvasConfig,
+  type ClipSpaceNearZ,
+  type Cursor,
+  type InteractivePointerEvent,
 } from './types';
 import {
   caf,
@@ -293,12 +293,26 @@ export class Canvas extends EventTarget implements ICanvas {
       this.context.renderingContext.renderReasons.add(
         RenderReason.CAMERA_CHANGED,
       );
+
+      if (
+        runtime.enableSizeAttenuation &&
+        this.getConfig().renderer.getConfig().enableSizeAttenuation
+      ) {
+        this.updateSizeAttenuation();
+      }
     });
 
     // bind camera
     this.context.camera = camera;
   }
 
+  private updateSizeAttenuation() {
+    const zoom = this.getCamera().getZoom();
+    this.document.documentElement.forEach((node: DisplayObject) => {
+      runtime.styleValueRegistry.updateSizeAttenuation(node, zoom);
+    });
+  }
+
   getConfig() {
     return this.context.config;
   }