fix: fix issue with inversify error when nobind

common/changes/@visactor/vrender-core/fix-inversify-optional_2025-01-27-04-55.json

@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "@visactor/vrender-core",
+      "comment": "fix: fix issue with inversify error when nobind",
+      "type": "none"
+    }
+  ],
+  "packageName": "@visactor/vrender-core"
+}

common/changes/@visactor/vrender-kits/fix-inversify-optional_2025-01-27-04-55.json

@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "@visactor/vrender-kits",
+      "comment": "fix: fix issue with inversify error when nobind",
+      "type": "none"
+    }
+  ],
+  "packageName": "@visactor/vrender-kits"
+}

common/changes/@visactor/vrender/fix-inversify-optional_2025-01-27-04-55.json

@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "@visactor/vrender",
+      "comment": "fix: fix issue with inversify error when nobind",
+      "type": "none"
+    }
+  ],
+  "packageName": "@visactor/vrender"
+}

packages/vrender-core/src/common/inversify/annotation/optional.ts

@@ -0,0 +1,9 @@
+import { Metadata } from '../meta-data';
+import { OPTIONAL_TAG } from '../metadata_keys';
+import { createTaggedDecorator } from './inject_base';
+
+function optional() {
+  return createTaggedDecorator(new Metadata(OPTIONAL_TAG, true));
+}
+
+export { optional };

packages/vrender-core/src/common/inversify/container.ts

@@ -200,16 +200,18 @@ export class Container {
         serviceIdentifier: injectIdentifier,
         constructorArgsMetadata
       };
-      const bindings = this._bindingDictionary.get(injectIdentifier).filter(b => {
+      const bindings = (this._bindingDictionary.get(injectIdentifier) || []).filter(b => {
         return b.constraint(target as any);
       });
-      const request = {
-        injectIdentifier,
-        metadata: constructorArgsMetadata,
-        bindings
-      };
-
-      arr.push(request);
+      if (bindings.length) {
+        const request = {
+          injectIdentifier,
+          metadata: constructorArgsMetadata,
+          bindings: bindings
+        };
+
+        arr.push(request);
+      }
     }
 
     return arr;

packages/vrender-core/src/render/contributions/render/draw-contribution.ts

@@ -18,7 +18,7 @@ import { findNextGraphic, foreach } from '../../../common/sort';
 import { ContributionProvider } from '../../../common/contribution-provider';
 import { DefaultAttribute } from '../../../graphic/config';
 import type { IAABBBounds, IBounds, IMatrix } from '@visactor/vutils';
-import { Bounds, Logger, getRectIntersect, isRectIntersect } from '@visactor/vutils';
+import { Bounds, Logger, getRectIntersect, isArray, isRectIntersect } from '@visactor/vutils';
 import { container } from '../../../container';
 import { GraphicRender, IncrementalDrawContribution } from './symbol';
 import { DrawItemInterceptor } from './draw-interceptor';
@@ -66,6 +66,9 @@ export class DefaultDrawContribution implements IDrawContribution {
     this.backupDirtyBounds = new Bounds();
     this.global = application.global;
     this.layerService = application.layerService;
+    if (!isArray(this.contributions)) {
+      this.contributions = [this.contributions];
+    }
     this.init();
   }
 

packages/vrender-kits/src/picker/contributions/common/base.ts

@@ -12,7 +12,7 @@ import type {
 } from '@visactor/vrender-core';
 
 export abstract class PickerBase {
-  canvasRenderer!: IGraphicRender;
+  canvasRenderer?: IGraphicRender;
 
   contains(graphic: IGraphic, point: IPoint, params?: IPickParams): boolean {
     if (!graphic.AABBBounds.containsPoint(point)) {
@@ -21,6 +21,9 @@ export abstract class PickerBase {
     if (graphic.attribute.pickMode === 'imprecise') {
       return true;
     }
+    if (!this.canvasRenderer) {
+      return true;
+    }
 
     const { pickContext } = params ?? {};
     if (!pickContext) {

packages/vrender/__tests__/browser/src/pages/anxu-picker.ts

@@ -0,0 +1,47 @@
+import { createStage, createRect, IGraphic, container } from '@visactor/vrender-core';
+import { loadBrowserEnv, loadMathPicker, registerRect } from '@visactor/vrender-kits';
+
+registerRect();
+loadBrowserEnv(container);
+loadMathPicker(container);
+
+// container.load(roughModule);
+export const page = () => {
+  const graphics: IGraphic[] = [];
+  // graphics.push(
+  //   createRect({
+  //     x: 100,
+  //     y: 100,
+  //     width: 20,
+  //     height: 100,
+  //     fill: colorPools[10],
+  //     stroke: [colorPools[0], colorPools[0], colorPools[0], colorPools[0]],
+  //     cornerRadius: 10,
+  //     lineWidth: 5
+  //   })
+  // );
+
+  const rect = createRect({
+    x: 20,
+    y: 20,
+    width: 101.55555555555556,
+    height: 30,
+    cornerRadius: -4,
+    background:
+      'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzFfMTUxNjkpIj4KPHBhdGggZD0iTTEwIDIwQzE1LjUyMjggMjAgMjAgMTUuNTIyOCAyMCAxMEMyMCA0LjQ3NzE1IDE1LjUyMjggMCAxMCAwQzQuNDc3MTUgMCAwIDQuNDc3MTUgMCAxMEMwIDE1LjUyMjggNC40NzcxNSAyMCAxMCAyMFoiIGZpbGw9IiNGMEYwRjAiLz4KPHBhdGggZD0iTTIwIDkuOTk5OTZDMjAgNS43MDAzMSAxNy4yODYzIDIuMDM0ODggMTMuNDc4MyAwLjYyMTk0OFYxOS4zNzhDMTcuMjg2MyAxNy45NjUgMjAgMTQuMjk5NiAyMCA5Ljk5OTk2WiIgZmlsbD0iI0Q4MDAyNyIvPgo8cGF0aCBkPSJNMCA5Ljk5OTk2QzAgMTQuMjk5NiAyLjcxMzc1IDE3Ljk2NSA2LjUyMTc2IDE5LjM3OFYwLjYyMTk0OEMyLjcxMzc1IDIuMDM0ODggMCA1LjcwMDMxIDAgOS45OTk5NloiIGZpbGw9IiM2REE1NDQiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8xXzE1MTY5Ij4KPHJlY3Qgd2lkdGg9IjIwIiBoZWlnaHQ9IjIwIiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=',
+    fill: 'rgba(0,0,0,0.3)',
+    backgroundMode: 'repeat-x',
+    boundsPadding: [2, 2, 2, 2],
+    pickMode: 'imprecise'
+  });
+
+  rect.addEventListener('click', () => {
+    console.log('click');
+  });
+
+  const stage = createStage({
+    canvas: 'main',
+    autoRender: true
+  });
+  stage.defaultLayer.add(rect);
+};

packages/vrender/__tests__/browser/src/pages/index.ts

@@ -15,6 +15,10 @@ export const pages = [
         name: '性能测试',
         path: 'performance-test'
       },
+      {
+        name: '按需加载',
+        path: 'anxu-picker'
+      },
       {
         name: '基础事件测试',
         path: 'interactive-test'