如果我从场景中移除()Object3D,则不会渲染它,但是它将保留在内存中。如果我将该对象的visible属性设置为false,则不会渲染它,但是它将保留在内存中。有什么不同?
上下文:当我有很多复杂的网格物体时,我遇到了性能问题。任何时候都只需要显示一个即可。其他的通常用visible = false隐藏。
我用 Fabric.js 在画布上绘制了一座六层楼的建筑。为了只显示一层,我这样做:
building.selectFloor = function(floorId){
for (var i = 0; i < floors.length; i++){
if (floorId == floors[i].name){
floors[i].visible = true;
}else{
floors[i].visible = false;
}
}
canvas.renderAll();
};
Run Code Online (Sandbox Code Playgroud)
但一切都没有改变——所有楼层仍然可见。设置为visible = false的楼层不会消失,直到稍后在调整窗口大小时调用renderAll():
$(window).resize(setSize);
setSize();
function setSize(){
viewportWidth = $(window).width();
viewportHeight = $(window).height();
$appContainer.css({ "width": viewportWidth, "height": viewportHeight});
canvas.setDimensions({ width: viewportWidth, height: viewportHeight });
if (canvas.building){
canvas.building.center();
canvas.building.scaleX = canvas.building.scaleY = (viewportWidth + viewportHeight) / (1920 + 1080);
canvas.renderAll();
}
}
Run Code Online (Sandbox Code Playgroud)
但随后它们就消失了。为什么一个 renderAll() 可以工作,而另一个却不能?我尝试将不起作用的 renderAll() 包装在 window.timeOut 中,看看延迟是否有帮助,但没有运气。