11import type {
22 DisplayObject ,
3- FederatedEvent ,
4- RBushNodeAABB ,
53 RenderingPlugin ,
6- RBush ,
74 RenderingPluginContext ,
85 ContextService ,
96 CanvasContext ,
107 GlobalRuntime ,
118 ParsedBaseStyleProps ,
129 CSSRGB ,
1310} from '@antv/g-lite' ;
14- import {
15- AABB ,
16- CanvasEvent ,
17- CustomEvent ,
18- ElementEvent ,
19- Shape ,
20- Node ,
21- } from '@antv/g-lite' ;
11+ import { AABB , CanvasEvent , CustomEvent , Shape , Node } from '@antv/g-lite' ;
2212import { mat4 , vec3 } from 'gl-matrix' ;
2313import { isNil } from '@antv/util' ;
2414import type { CanvasRendererPluginOptions } from './interfaces' ;
@@ -49,17 +39,10 @@ export class CanvasRendererPlugin implements RenderingPlugin {
4939
5040 private pathGeneratorFactory : Plugin [ 'context' ] [ 'pathGeneratorFactory' ] ;
5141
52- /**
53- * RBush used in dirty rectangle rendering
54- */
55- private rBush : RBush < RBushNodeAABB > ;
56-
5742 constructor (
5843 private canvasRendererPluginOptions : CanvasRendererPluginOptions , // private styleRendererFactory: Record<Shape, StyleRenderer>,
5944 ) { }
6045
61- private removedRBushNodeAABBs : RBushNodeAABB [ ] = [ ] ;
62-
6346 private renderQueue : DisplayObject [ ] = [ ] ;
6447
6548 #renderState: RenderState = {
@@ -90,7 +73,6 @@ export class CanvasRendererPlugin implements RenderingPlugin {
9073 camera,
9174 renderingService,
9275 renderingContext,
93- rBushRoot,
9476 // @ts -ignore
9577 pathGeneratorFactory,
9678 } = this . context ;
@@ -100,42 +82,14 @@ export class CanvasRendererPlugin implements RenderingPlugin {
10082 config . renderer . getConfig ( ) . enableDirtyCheck = false ;
10183 config . renderer . getConfig ( ) . enableDirtyRectangleRendering = false ;
10284
103- this . rBush = rBushRoot ;
10485 this . pathGeneratorFactory = pathGeneratorFactory ;
10586
10687 const contextService =
10788 context . contextService as ContextService < CanvasRenderingContext2D > ;
10889
10990 const canvas = renderingContext . root . ownerDocument . defaultView ;
11091
111- const handleUnmounted = ( e : FederatedEvent ) => {
112- const object = e . target as DisplayObject ;
113-
114- // remove r-bush node
115- // @ts -ignore
116- const { rBushNode } = object ;
117-
118- if ( rBushNode ?. aabb ) {
119- // save removed aabbs for dirty-rectangle rendering later
120- this . removedRBushNodeAABBs . push ( rBushNode . aabb ) ;
121- }
122- } ;
123-
124- const handleCulled = ( e : FederatedEvent ) => {
125- const object = e . target as DisplayObject ;
126- // @ts -ignore
127- const { rBushNode } = object ;
128-
129- if ( rBushNode . aabb ) {
130- // save removed aabbs for dirty-rectangle rendering later
131- this . removedRBushNodeAABBs . push ( rBushNode . aabb ) ;
132- }
133- } ;
134-
13592 renderingService . hooks . init . tap ( CanvasRendererPlugin . tag , ( ) => {
136- canvas . addEventListener ( ElementEvent . UNMOUNTED , handleUnmounted ) ;
137- canvas . addEventListener ( ElementEvent . CULLED , handleCulled ) ;
138-
13993 // clear fullscreen
14094 const dpr = contextService . getDPR ( ) ;
14195 const { width, height } = config ;
@@ -151,10 +105,7 @@ export class CanvasRendererPlugin implements RenderingPlugin {
151105 } ) ;
152106
153107 renderingService . hooks . destroy . tap ( CanvasRendererPlugin . tag , ( ) => {
154- canvas . removeEventListener ( ElementEvent . UNMOUNTED , handleUnmounted ) ;
155- canvas . removeEventListener ( ElementEvent . CULLED , handleCulled ) ;
156108 this . renderQueue = [ ] ;
157- this . removedRBushNodeAABBs = [ ] ;
158109 this . #renderState = {
159110 restoreStack : [ ] ,
160111 prevObject : null ,
@@ -286,25 +237,12 @@ export class CanvasRendererPlugin implements RenderingPlugin {
286237 renderByZIndex ( renderingContext . root , context ) ;
287238 }
288239 // console.timeEnd('renderByZIndex');
289-
290- this . removedRBushNodeAABBs = [ ] ;
291240 } else {
292241 // console.log('canvas renderer next...', this.renderQueue);
293242 // merge removed AABB
294243 const dirtyRenderBounds = this . safeMergeAABB (
295244 this . mergeDirtyAABBs ( this . renderQueue ) ,
296- ...this . removedRBushNodeAABBs . map ( ( { minX, minY, maxX, maxY } ) => {
297- const aabb = new AABB ( ) ;
298- aabb . setMinMax (
299- // vec3.fromValues(minX, minY, 0),
300- // vec3.fromValues(maxX, maxY, 0),
301- [ minX , minY , 0 ] ,
302- [ maxX , maxY , 0 ] ,
303- ) ;
304- return aabb ;
305- } ) ,
306245 ) ;
307- this . removedRBushNodeAABBs = [ ] ;
308246
309247 if ( AABB . isEmpty ( dirtyRenderBounds ) ) {
310248 this . renderQueue = [ ] ;
@@ -374,7 +312,15 @@ export class CanvasRendererPlugin implements RenderingPlugin {
374312 }
375313
376314 // search objects intersect with dirty rectangle
377- const dirtyObjects = this . searchDirtyObjects ( dirtyRenderBounds ) ;
315+ const [ minX , minY ] = dirtyRenderBounds . getMin ( ) ;
316+ const [ maxX , maxY ] = dirtyRenderBounds . getMax ( ) ;
317+ const dirtyObjects =
318+ renderingContext . root . ownerDocument . elementsFromBBox (
319+ minX ,
320+ minY ,
321+ maxX ,
322+ maxY ,
323+ ) ;
378324
379325 // do rendering
380326 dirtyObjects
@@ -712,20 +658,6 @@ export class CanvasRendererPlugin implements RenderingPlugin {
712658 return aabb ;
713659 }
714660
715- private searchDirtyObjects ( dirtyRectangle : AABB ) : DisplayObject [ ] {
716- // search in r-tree, get all affected nodes
717- const [ minX , minY ] = dirtyRectangle . getMin ( ) ;
718- const [ maxX , maxY ] = dirtyRectangle . getMax ( ) ;
719- const rBushNodes = this . rBush . search ( {
720- minX,
721- minY,
722- maxX,
723- maxY,
724- } ) ;
725-
726- return rBushNodes . map ( ( { displayObject } ) => displayObject ) ;
727- }
728-
729661 private saveDirtyAABB ( object : DisplayObject ) {
730662 const { renderable } = object ;
731663 if ( ! renderable . dirtyRenderBounds ) {
0 commit comments