javascript - 删除数据(刷新)WebGL Globe

Question

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

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

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();