From 084ee79b1c84bd19d380d126fbf5073f1119c8fc Mon Sep 17 00:00:00 2001
From: kanno <812137533@qq.com>
Date: Fri, 24 Jan 2025 09:13:17 +0800
Subject: [PATCH] fix: respect dpi

---
 src/etoile/graph/image.ts   | 5 ++++-
 src/primitives/component.ts | 2 +-
 src/primitives/event.ts     | 6 +++++-
 3 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/etoile/graph/image.ts b/src/etoile/graph/image.ts
index a1121d6..2affc4a 100644
--- a/src/etoile/graph/image.ts
+++ b/src/etoile/graph/image.ts
@@ -12,19 +12,22 @@ export interface BitmapOptions extends Omit<GraphOptions, 'style'> {
     }
   >
   bitmap: HTMLCanvasElement
+  dpi: number
 }
 
 export class Bitmap extends Graph {
   bitmap: HTMLCanvasElement | null
   style: Required<BitmapOptions['style']>
+  dpi: number
   constructor(options: Partial<BitmapOptions> = {}) {
     super(options)
     this.bitmap = options.bitmap || null
     this.style = (options.style || Object.create(null)) as Required<BitmapOptions['style']>
+    this.dpi = options.dpi || 1
   }
   create() {
     if (this.bitmap) {
-      this.instruction.drawImage(this.bitmap, 0, 0)
+      this.instruction.drawImage(this.bitmap, 0, 0, this.bitmap.width / this.dpi, this.bitmap.height / this.dpi)
     }
   }
   clone() {
diff --git a/src/primitives/component.ts b/src/primitives/component.ts
index 6ddf7a3..27743fc 100644
--- a/src/primitives/component.ts
+++ b/src/primitives/component.ts
@@ -199,7 +199,7 @@ export class TreemapLayout extends Schedule<InternalEventDefinition> {
     this.bgBox.destory()
     if (this.renderCache.state) {
       this.fgBox.destory()
-      this.bgBox.add(new Bitmap({ bitmap: this.renderCache.canvas }))
+      this.bgBox.add(new Bitmap({ bitmap: this.renderCache.canvas, dpi: this.render.options.devicePixelRatio }))
     } else {
       for (const node of this.layoutNodes) {
         this.drawBackgroundNode(node)
diff --git a/src/primitives/event.ts b/src/primitives/event.ts
index ec73a56..710c1fd 100644
--- a/src/primitives/event.ts
+++ b/src/primitives/event.ts
@@ -311,7 +311,11 @@ export class TreemapEvent extends DOMEvent {
       this.matrix.a += scale
       this.matrix.d += scale
       this.matrix.translation((translateX - this.matrix.e) * easedProgress, (translateY - this.matrix.f) * easedProgress)
-      resetLayout(treemap, treemap.render.canvas.width * this.matrix.a, treemap.render.canvas.height * this.matrix.d)
+      resetLayout(
+        treemap,
+        treemap.render.canvas.width * this.matrix.a / treemap.render.options.devicePixelRatio,
+        treemap.render.canvas.height * this.matrix.d / treemap.render.options.devicePixelRatio
+      )
       stackMatrixTransformWithGraphAndLayer(treemap.elements, this.matrix.e, this.matrix.f, 1)
       treemap.update()
     }, {