如何在缩放后缓存图层

Question

我遇到的问题是图层看起来很丑陋＆＃39;在缩放图层之后。

var stage = new Kinetic.Stage({
  container: "canvas", width: 500, height: 200,
});

var myLayer = new Kinetic.Layer();
myLayer.x(0); 
myLayer.y(0);
myLayer.width(300);
myLayer.height(200);
myLayer.clearBeforeDraw(true);

var simpleText = new Kinetic.Text({
  x: 2,
  y: 10,
  text: 'Text',
  fontSize: 30,
  fontFamily: 'Calibri',
  fill: 'green'
});
simpleText.cache();
myLayer.add(simpleText);

stage.add(myLayer)
stage.scaleX(4);
stage.scaleY(4);
stage.draw();

看起来kinetic首先绘制图层，然后缓存它，最后缩放图层。

有人可以帮我确定如何缓存缩放图层吗？

Answer 1

当您执行simpleText.cache时，您正在创建文本图像。

当您缩放该图像（任何图像）4倍时，您将始终存在扭曲。

为避免失真，请在simpleText中使用较大的字体而不是缩放。