diff --git a/CHANGELOG.md b/CHANGELOG.md index 5da13ba..4983d65 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,7 @@ +## 0.3.1 + +Add render fallback. + ## 0.3.0 Happy New year. This version improves performance and provides a smooth UI. diff --git a/package.json b/package.json index a37ca3b..5c6c60e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "squarified", - "version": "0.3.0", + "version": "0.3.1", "description": "squarified tree map", "main": "dist/index.js", "module": "dist/index.mjs", diff --git a/src/primitives/cache.ts b/src/primitives/cache.ts index 1424651..20dfffb 100644 --- a/src/primitives/cache.ts +++ b/src/primitives/cache.ts @@ -35,6 +35,9 @@ export class RenderCache extends Canvas implements Cache { resetLayout(treemap, width * a, height * d) drawGraphIntoCanvas(treemap, { c: this.canvas, ctx: this.ctx, dpr: devicePixelRatio }) this.$memory = true + if (this.ctx.isContextLost()) { + this.$memory = false + } } destroy() { this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height) diff --git a/src/primitives/event.ts b/src/primitives/event.ts index bf223fc..e4c9652 100644 --- a/src/primitives/event.ts +++ b/src/primitives/event.ts @@ -283,9 +283,6 @@ export class TreemapEvent extends DOMEvent { private onwheel(ctx: TreemapEventContext, metadata: DOMEventMetadata<'wheel'>) { ctx.treemap.renderCache.destroy() - this.silent('mousedown') - this.exposedEvent.silent('mousemove') - this.silent('mousemove') const { native } = metadata const { treemap } = ctx // @ts-expect-error safe @@ -306,6 +303,11 @@ export class TreemapEvent extends DOMEvent { const translateX = offsetX - (offsetX - this.matrix.e) * delta const translateY = offsetY - (offsetY - this.matrix.f) * delta runEffect((progress, cleanup) => { + this.silent('mousedown') + this.exposedEvent.silent('mousemove') + this.silent('mousemove') + this.silent('click') + this.exposedEvent.silent('click') cleanup() treemap.highlight.reset() treemap.highlight.setZIndexForHighlight() @@ -335,6 +337,8 @@ export class TreemapEvent extends DOMEvent { this.active('mousedown') this.active('mousemove') this.exposedEvent.active('mousemove') + this.active('click') + this.exposedEvent.active('click') } }) }