javascript - 无法呈现在 jQuery $.get 请求函数中添加到场景中的三个 js 对象

Question

我是 three.js 初学者。我正在尝试使用从 JavaScript get 请求返回的位置坐标向场景中添加一个球体。

在 get 请求之前创建的球体被正确渲染，但是在回调函数中创建并添加到场景中的球体没有被渲染 - 尽管如果我调试和检查场景，两个球体都作为它的子存在。

我的代码:

var sphere = new THREE.Mesh(
  new THREE.SphereGeometry(radius),
  sphereMaterial);
sphere.position.set(-20,-20,-20);
scene.add(sphere); // this sphere shows

sphere2 = sphere.clone();
sphere2.position.set(50,50,50); // testing initializing outside 

$.get("{% /graph %}",function(data,status){
  scene.add(sphere2); // this sphere does not show
});

renderer.render(scene, camera);

我尝试在回调内外初始化第二个球体，我尝试创建新球体而不是克隆，我不确定还能尝试什么，我不知道我错过了什么。

Answer 1

jQuery get request 是一个异步请求。在渲染调用之后才会调用回调函数。这意味着对象将被添加到场景中，但不会被绘制。

您需要在 get 处理程序中调用渲染函数。

$.get("{% /graph %}",function(data,status){
  scene.add(sphere2);
  renderer.render(scene, camera);
});

或者，如果您为动画之类的内容创建渲染循环，则这是不必要的。