Question

我希望以两种方式在定义的显示区域（高度和宽度）上使用kineticJS：

- 在我的javascript中，我想要使用任意尺寸，放置物品等。 - 在我的CSS中，我想要其他维度，独立于JS，代表真实的显示。

这有几个优点：JS尺寸可以小于真实显示器，使计算更轻;或CSS尺寸可以轻松地适应用户屏幕尺寸，而不会影响脚本部分......

在vanilla JS中很容易做到，使用画布的尺寸高度和宽度来表示JS尺寸，CSS高度和宽度用于显示尺寸。

HTML：

<canvas height="10" width="10" id="c"></canvas>

CSS：

#c {
        height:400px;
        width:400px;
    }

但是对于KineticJS，我真的无法做同样的事情。当我这样做宽度容器时，容器本身也是大小调整，但Stage不是（使用阶段或容器的尺寸）。

HTML：

<div height="100" width="100" id="c"></div>

相同的CSS。

那么，有没有办法用KineticJS做到这一点？

Answer 1

我认为您正在寻找的是

stage.setScale(scale);

其中，比例是您希望按比例缩放所有内容的比率。因此，您只需计算一次，设置它，然后就完成了（除非您使用多个阶段;然后您需要设置所有阶段）。

它很快，我经常使用这个技巧。实际上，您可以根据需要单独缩放任何对象，也可以直接在画布上绘制。