lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2026-01-24 05:45:14 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix #1106: hit canvas pixel ratio configurable

Browse Source
This commit is contained in:
Raphael Papazikas
2021-05-03 22:54:22 +02:00
parent f288e9bf14
commit 628a8ea9ca
2 changed files with 52 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/Node.ts
View File

@@ -333,6 +333,7 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
* region for debugging purposes
* @param {Number} [config.pixelRatio] change quality (or pixel ratio) of cached image. pixelRatio = 2 will produce 2x sized cache.
* @param {Boolean} [config.imageSmoothingEnabled] control imageSmoothingEnabled property of created canvas for cache
* @param {Number} [config.hitCanvasPixelRatio] change quality (or pixel ratio) of cached hit canvas.
* @returns {Konva.Node}
* @example
* // cache a shape with the x,y position of the bounding box at the center and
@@ -368,6 +369,7 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
offset?: number;
pixelRatio?: number;
imageSmoothingEnabled?: boolean;
hitCanvasPixelRatio?: number;
}) {
var conf = config || {};
var rect = {} as IRect;
@@ -391,7 +393,8 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
x = conf.x === undefined ? rect.x : conf.x,
y = conf.y === undefined ? rect.y : conf.y,
offset = conf.offset || 0,
drawBorder = conf.drawBorder || false;
drawBorder = conf.drawBorder || false,
hitCanvasPixelRatio = conf.hitCanvasPixelRatio || 1;
if (!width || !height) {
Util.error(
@@ -417,7 +420,7 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
height: 0,
}),
cachedHitCanvas = new HitCanvas({
pixelRatio: 1,
pixelRatio: hitCanvasPixelRatio,
width: width,
height: height,
}),
@@ -427,7 +430,7 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
cachedHitCanvas.isCache = true;
cachedSceneCanvas.isCache = true;
this._cache.delete('canvas');
this._cache.delete(CANVAS);
this._filterUpToDate = false;
if (conf.imageSmoothingEnabled === false) {
@@ -484,7 +487,7 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
* @returns {Boolean}
*/
isCached() {
return this._cache.has('canvas');
return this._cache.has(CANVAS);
}
abstract drawScene(canvas?: Canvas, top?: Node): void;
@@ -587,7 +590,13 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
hitCanvas = canvasCache.hit;
context.save();
context.translate(canvasCache.x, canvasCache.y);
context.drawImage(hitCanvas._canvas, 0, 0);
context.drawImage(
hitCanvas._canvas,
0,
0,
hitCanvas.width / hitCanvas.pixelRatio,
hitCanvas.height / hitCanvas.pixelRatio,
);
context.restore();
}
_getCachedSceneCanvas() {