Question

下面是将一些文本放在pixi.js（使用WebGL）画布上的简单方法。

如何滚动/缩放画布的显示部分？ （即鼠标按下+拖动应移动......）

我想要实现的目标：http://s419743653.onlinehome.fr/things/test2.htm

<!DOCTYPE HTML>
<html>
<head>
    <title>pixi.js example 1</title>
    <script src="pixi.js"></script>
</head>
<body>
    <script>
    var stage = new PIXI.Stage(0xFFFFFF);
    var renderer = PIXI.autoDetectRenderer(800, 600);
    document.body.appendChild(renderer.view);
    var text = new PIXI.Text("Hello World", {font:"50px Arial", fill:"black"});
  stage.addChild(text);
  renderer.render(stage);   
    </script>
    </body>
</html>

Answer 1

在DisplayObjectContainer上设置scale属性。在你的情况下，你没有任何东西，所以你可以扩展舞台。

stage.scale.x = 2;
stage.scale.y = 2;

或者您可以将对象放在一个组中并缩放该组。

var group = new Pixi.DisplayObjectContainer();
group.scale.x = 2;
group.scale.y = 2;

group.add(text);

滚动/缩放pixi.js画布

1 个答案: