我正在使用three.js中的WebGLRenderer,但我无法清除画布。基本上,我有一个方法,它不断向场景中添加另一个对象,但在添加之前清除子对象。例如
group = new THREE.Object3D();
function add(object){
group.children = [];//clears the group children first
group.add(object);
}
我认为这会让它变得清晰,但我错了。我习惯了画布渲染为我做这件事。有人知道我应该如何清理WebGL画布吗?
我一直试图使用官方的three.js包three on npm来呈现图像,方法是在npm上使用canvas包。到目前为止运气不太好。
我认为这应该是可能的,因为节点-画布()是一个完整的堆栈画布呈现程序,我只是不知道如何修复这个库和three.js之间的桥梁,使它们在服务器端呈现时一起工作。
这里是我失败的方法:
通过遵循一个旧的github帖子,我成功地修改了three.js文件的开头,如下所示:
var Canvas = require('canvas');
var self = self || {}; // File:src/Three.js
var canvasWi
更新:改写这个问题,使其更笼统。(原始供参考)
我正在Three.js WebGLRenderer中渲染一个场景。然后,我需要用新的WebGLRenderer替换渲染器(用新画布替换画布),并在新呈现器中再次呈现相同的场景。
该设置大致如下:
cancelAnimationFrame(this.requestID_);
// all other Three.js objects stay same (and I let Three.js create a new canvas)
this.createNewRenderer();
this.animate();
然而,新的渲染器只会呈现一个空的
我想找到一种方法来测试浏览器是否能够支持three.js。我看到您可以在这一行代码中使用three.js提供的three.js来检查您应该使用WebGL还是画布:
renderer = Detector.webgl? new THREE.WebGLRenderer(): new THREE.CanvasRenderer();
这是工作的一部分,而不是全部。CanvasRenderer并不适用于所有其他浏览器。取决于你想做什么。在我的例子中,我想做一个简单的旋转立方体,比如three.js提供的画布示例),它在IE9上不工作,即使IE9应该支持画布()。
我希望能够测试浏览器是否支持示例代码。我
我尝试创建一个使用three.js的cordova应用程序。它在某些手机上工作正常,但在某些手机上工作正常(联想)它显示WebGL missing错误。我检查了get.webgl.org,它工作正常(运行立方体显示)。无法获取webgl画布上下文。
var myCanvas = document.createElement('canvas');
var webGl = myCanvas.getContext('webgl');
var webG1 = myCanvas.getContext('experimental-webgl');
webGl
我一直在关注three.js的在线教程,它会产生一个旋转的3D立方体。我在脚本文件中使用了以下JavaScript:
function spin() {
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth/2, window
我有一个网站,它使用angularjs和ng-route指令,让用户在视图之间导航。应用程序使用Three.js进行画布WebGL呈现。我遇到了一个问题,应用程序在Chrome和IE11上反复崩溃。
我很难找到确切的问题,所以目前我无法提供一个小的、可重复的错误案例。这是我最需要的帮助-去哪里找。
到目前为止,我已经将其缩小到ng-route视图,与反复重新初始化三个呈现器和场景相结合。我相信我可以使用IE11来重现这个问题,它给了我错误代码887a0005,它只是表示the gpu device instance has been suspended,所以我不太可能从那里跟踪我的问题。
88