Javascript Craftyjs画布旋转

如果我将e1属性y更改为1或其他正值，则此代码有效，但如果y为0或负值，则失败。没有错误，但形状不会显示。如果我画其他类型的形状，同样的问题也会发生。无论如何，旋转值（如0、90和271）适用于y:0。x值没有这样的问题。为什么呢？这是一个与Crafty.js相关的bug吗

<script>
        Crafty.init(480,680, document.getElementById('test'));

        Crafty.c("myComponent", {
            init: function () {
                this.requires("2D, Canvas");
                this.bind("Draw", this._draw_me);
                this.ready = true;
            },
            _draw_me: function (e) {
                var ctx = e.ctx;

                ctx.beginPath();
                ctx.moveTo(e.pos._x, e.pos._y);
                ctx.lineTo(e.pos._x + e.pos._w, e.pos._y);
                ctx.lineTo(e.pos._x + e.pos._w/2, e.pos._y + e.pos._h);
                ctx.lineTo(e.pos._x, e.pos._y);

                ctx.fillStyle = "blue";
                ctx.fill();
            }
        });

        var e1 = Crafty.e("myComponent")
            .attr({x: 100, y: 0, w: 60, h: 60, rotation:180})
            .origin("center");
</script>

Crafty.init（480680，document.getElementById（'test'）；
Crafty.c（“myComponent”{
init：函数（）{
这需要（“2D，画布”）；
这个.bind（“Draw”，this.\u Draw\u me）；
this.ready=true；
},
_绘图：函数（e）{
var-ctx=e.ctx；
ctx.beginPath（）；
ctx.移动到（e.pos.\U x，e.pos.\U y）；
ctx.lineTo（e位置x+e位置w、e位置y）；
ctx.lineTo（e位置x+e位置w/2，e位置y+e位置h）；
ctx.lineTo（e.pos.\u x，e.pos.\u y）；
ctx.fillStyle=“蓝色”；
ctx.fill（）；
}
});
var e1=Crafty.e（“myComponent”）
.attr（{x:100，y:0，w:60，h:60，旋转：180}）
.原产地（“中心”）；

在设置原点之前设置

w

和

h

。在设置旋转之前设置旋转原点。
这应该清楚地记录在API文档中，我继续并打开了它

如果在旋转后设置原点，事情会以某种方式变得一团糟，

\u draw\u me

函数永远不会被调用，因为狡猾的人认为三角形位于视口（摄影机）之外，不需要绘制。（观察设置

Crafty.viewport.y=100时发生的情况-三角形出现）

下面的代码片段适合我。代码按该顺序设置
w
和
h
，
原点
和
旋转


Crafty.init（）；
Crafty.c（“myComponent”{
init：函数（）{
这需要（“2D，画布”）；
这个.bind（“Draw”，this.\u Draw\u me）；
this.ready=true；
},
_绘图：函数（e）{
var-ctx=e.ctx；
ctx.beginPath（）；
ctx.移动到（e.pos.\U x，e.pos.\U y）；
ctx.lineTo（e位置x+e位置w、e位置y）；
ctx.lineTo（e位置x+e位置w/2，e位置y+e位置h）；
ctx.lineTo（e.pos.\u x，e.pos.\u y）；
ctx.fillStyle=“蓝色”；
ctx.fill（）；
}
});
var e1=Crafty.e（“myComponent”）
.attr（{w:60，h:60}）
.来源（“中心”）
.attr（{x:100，y:0，旋转：180}）
在设置原点之前设置
w
和
h
。在设置旋转之前设置旋转原点。

这应该清楚地记录在API文档中，我继续并打开了它

如果在旋转后设置原点，事情会以某种方式变得一团糟，
\u draw\u me
函数永远不会被调用，因为狡猾的人认为三角形位于视口（摄影机）之外，不需要绘制。（观察设置
Crafty.viewport.y=100时发生的情况-三角形出现）

下面的代码片段适合我。代码按该顺序设置
w
和
h
，
原点
和
旋转


Crafty.init（）；
Crafty.c（“myComponent”{
init：函数（）{
这需要（“2D，画布”）；
这个.bind（“Draw”，this.\u Draw\u me）；
this.ready=true；
},
_绘图：函数（e）{
var-ctx=e.ctx；
ctx.beginPath（）；
ctx.移动到（e.pos.\U x，e.pos.\U y）；
ctx.lineTo（e位置x+e位置w、e位置y）；
ctx.lineTo（e位置x+e位置w/2，e位置y+e位置h）；
ctx.lineTo（e.pos.\u x，e.pos.\u y）；
ctx.fillStyle=“蓝色”；
ctx.fill（）；
}
});
var e1=Crafty.e（“myComponent”）
.attr（{w:60，h:60}）
.来源（“中心”）
.attr（{x:100，y:0，旋转：180}）