[英]Working with Multiple Layers - KineticJS
我正在使用KineticJS 4.0.5并且我正在尝试绘制几个图层的内容,但只绘制了添加到舞台的最后一个...如果我正确理解文档这应该是可能的,否则我们为什么需要一层?
我有三个不同的层:
我在我创建的对象内部的绘图函数中填充这些图层,此对象还具有一个引用背景的shape属性和一个带有要添加到元素图层的元素的contents属性。 我的绘图函数代码如下:
this.draw = function() {
var stage = E.game.stage, layers = E.game.layers;
stage.clear();
// Add Background
this.shape.setSize(stage.getWidth(), stage.getHeight());
layers.background.add(this.shape);
// Iterate over contents
for(var i = 0; i < this.contents.length; i++) {
layers.elements.add(this.contents[i].shape);
}
// Draw Everything
stage.add(layers.background);
stage.add(layers.elements);
stage.add(layers.top); // This one is currently empty
stage.draw();
}
运行此函数后,在画布中仅绘制了layers.top,如果我对添加它的行进行注释,则仅绘制layers.elements。 然而,舞台上有3个孩子(我用chrome上的inspect元素检查过),在文档中它说绘制功能绘制了所有图层......我在这里做错了吗? 还是不可能? 如果不可能,为什么我需要一个层和一个舞台? 一个人不够吗?
先感谢您。
编辑 :我能够解决问题,我用css将白色背景颜色应用到canvas元素,因为每个图层在其他图层上方创建一个新的画布元素,我只能看到最顶层的内容(在这种情况下)只是白色)。
但是,我仍然遇到一个与多层相关的问题,而我之前只有一层。 当我在舞台上使用清除功能时,应该清除图层对吗? 但是相反,图层保持完全相同,即使我试图在每个单独的图层上调用清除它们也不会改变...我也在清除它们之后使用阶段绘制功能但仍然没有任何变化...直到现在我发现的唯一解决方案是从舞台上移除图层并再次添加:s有没有更好的方法来重置图层内容?
再次感谢你,对于第一个问题的困惑感到抱歉。
Clear只是在重绘之前清除画布。 它不会删除添加到图层的对象。 因此,对于您的情况,使用remove函数取出附加到图层的对象或者您正在做的其他操作,删除整个图层本身。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.