删除数据（刷新）WebGL Globe

Question

我正在玩 WebGL Globe (http://globe.chromeexperiments.com/)，希望能够 "refresh" 使用新数据并将其动画化为新状态。库中提供的示例没有帮助，因为它们在页面加载时立即加载数据系列，但我想动态加载新数据（比如，每 30 秒）

使用 new data 重复执行以下操作只会累加地更新地球的数据，因此当新数据进来时地球上的柱子 "stack up"：

globe.addData(data, {format: 'magnitude'});
globe.createPoints();
globe.animate();

似乎没有明显的方法可以使用内置的 API 减去/清除/重置地球数据（然后动画到新的数据状态）。这容易做到吗？

Answer 1

我明白了。在您的 globe.js 中添加以下行：

function createPoints() {
    ...
    this.points.name = "lines"; // Add this line
    scene.add(this.points);
    }
}

// Create this function
function removeAllPoints() {
    scene.remove(scene.getObjectByName("lines"));
}

// Near the bottom of the code
this.addData = addData;
this.removeAllPoints = removeAllPoints; // Add this line
this.createPoints = createPoints;
this.renderer = renderer;
this.scene = scene;

现在您可以简单地执行以下操作：

TWEEN.start();
globe.removeAllPoints();
globe.addData(data, {format: 'magnitude', name: 'results', animated: false});
globe.createPoints();

Answer 2

hobbes3 给出的答案真的很有帮助。但只是一个小的改变。

您无需致电 globe.animate()。

我曾在一个项目中使用它，我每 5 秒更新一次数据并一遍又一遍地调用 globe.animate() 使渲染变得缓慢。评论出来，你就是金子。

删除数据（刷新）WebGL Globe

Removing data (refreshing) WebGL Globe

javascript

webgl-globe