Некорректные пропорции фигур в CreateJS

174

01 января 2019, 11:50

Есть проблема с пропорциями фигур при их создании посредством CreateJS. Ниже приведён JS-код:

var draw = function(){
var stage = new createjs.Stage('game');
var circle = new createjs.Shape();
circle.graphics.beginFill("DeepSkyBlue").drawCircle(0, 0, 50);
circle.x = 100;
circle.y = 100;
stage.addChild(circle);
stage.update();
}

CSS:

#game {
  outline: 1px solid grey;
  width: 500px;
  height:300px;
}

HTML:

<!DOCTYPE html>
<html>
 <head></head>
 <body>
  <canvas id="game"></canvas>
  <script src="https://cdn.jsdelivr.net/npm/createjs@1.0.1/builds/1.0.0/createjs.min.js"></script>
  <script src="myscript.js"></script>
 </body>
</html>

JS-код скопирован из раздела Getting started, и должен создавать правильный круг на холсте, однако в результате он выглядит следующим образом:

Проблема решается при изменении соотношения сторон самого холста.

Правильно ли я понимаю, что Stage в CreateJS использует собственную систему координат, которая имеет собственное соотношение сторон, и вписывает её в холст? Если это так, то странно, что я не нашёл никакой информации в документации по настройке подобных свойств сцены.