xiaoiver
xiaoiver
目前在每一帧结束后,都会针对发生改变的节点重新构建 R 树,在这一过程中会重新计算脏节点的包围盒,是开销较大的环节: ```js renderingService.hooks.endFrame.tap(PrepareRendererPlugin.tag, () => { this.syncRTree(); }); ``` 但 `g-canvas` 的渲染在脏矩形同样在 `endFrame` 这一 hook 中完成,且由于是顺序执行,因此需要等待上面构建 R 树完成后: ```js renderingService.hooks.endFrame.tap(CanvasRendererPlugin.tag, () => { if (this.clearFullScreen) { // 全屏擦除...
### 🤔 This is a ... - [x] New feature - [ ] Bug fix - [ ] Site / Document optimization - [ ] TypeScript definition update - [...
计算得到的脏矩形四个顶点处于 Canvas 坐标系下,需要转换到 Viewport 坐标系下: ```js const dirtyRect = this.convertAABB2Rect(dirtyRenderBounds); const { x, y, width, height } = dirtyRect; // 转换到 viewport 坐标系 const tl = vec3.transformMat4(this.vec3a, vec3.fromValues(x, y, 0),...
目前事件系统中会重复使用事件对象,避免大量事件对象的创建。被重复使用的对象仅用于携带不同的数据,例如坐标信息、原生事件对象,因此生命周期也就限定在事件处理器内,一旦试图缓存整个事件对象,就会导致意料之外的结果。 因此在保留上述性能考虑的基础上,可以提供一个 clone 方法,当用户真的想缓存时可以创建新的对象,例如: ```js circle.addEventListener('click', (e) => { const newEvent = e.clone(); }); ``` 我们暂时只支持交互事件,即 `FederatedPointerEvent` 和 `FederatedWheelEvent`。其他事件例如 `AnimationEvent` 和 `CustomEvent` 暂不支持。
以下两种用法性能差别挺大: https://g-next.antv.vision/zh/examples/perf#group-move ```js groups.forEach( (group) => // ~30FPS group.attr({ x: Math.random() * 600, y: Math.random() * 500, }), // ~60FPS // group.setLocalPosition(Math.random() * 600, Math.random() * 500), ); ``` 当变换发生导致包围盒改变时,不应该每次都创建新的...
如下图所示,为 Polyline 设置了 markerMid,但图片加载完成后只展示了第一个。除非通过 `transform` 等方式触发重绘: 原因是每个拐点在图片加载完成后确实会触发重绘,但由于 `g-canvas` 默认使用脏矩形渲染,markerMid 改变未触发擦除的区域。
node 移入 droppable 区域未触发 dragenter 事件: https://g-next.antv.vision/zh/examples/plugins#dragndrop-group 解决方案是使用 elementsFromPoint 得到所有被拾取到的图形,排除掉顶层正在拖拽的图形: ```js const elementsBelow = await document.elementsFromPoint(point[0], point[1]); // prevent from picking the dragging element const elementBelow = elementsBelow[elementsBelow.indexOf(target) + 1];...
naga v0.9.0 https://github.com/gfx-rs/naga/releases/tag/v0.9.0 https://crates.io/crates/naga 不过以下最新语法在 Chrome 103 下会报错,Tint 接受的是老版本的语法 `@stage(vertex)`: https://www.w3.org/TR/WGSL/#entry-point-decl ```wgsl @vertex fn vert_main() -> @builtin(position) vec4 { return vec4(0.0, 0.0, 0.0, 1.0); } ``` 只能等待浏览器更新了: ``` Tint WGSL...
目前 `g-canvaskit` 渲染器实现了以上特性: https://g-next.antv.vision/zh/docs/api/renderer/canvaskit#%E4%BF%AE%E9%A5%B0%E7%BA%BF 其它渲染器希望保持一致效果。 - [ ] 沿线布局 - [ ] 装饰线 - [ ] 阴影 - [ ] 文本选中 ## 沿线布局 ### 已有实现 SVG 原生可以通过 `` 实现: https://developer.mozilla.org/en-US/docs/Web/SVG/Element/textPath...
原因应该是拖拽事件对象复用了 mouseleave,应该先后依次触发两类事件,即先触发原事件,修改事件类型和携带数据后再触发拖拽事件。 同理还有 dragend 前应该触发 pointerup 事件。