2

我正在使用 WebGL Globe ( http://globe.chromeexperiments.com/ ) 并希望能够用新数据“刷新”它,然后将其动画化到新状态。库中提供的示例无济于事,因为它们在页面加载时立即加载数据系列,但我想动态加载新数据(例如,每 30 秒)

使用 new 重复执行以下操作data只会累加地更新地球的数据,因此当新数据进入时,条形图会“堆积”在地球上:

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

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

4

2 回答 2

6

我想到了。在您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();
于 2015-05-13T04:40:28.783 回答
4

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

你不需要打电话globe.animate()

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

于 2015-12-05T08:22:27.217 回答