铯 - 移动广告牌
cesium - moving billboards
我正在测试 Cesiumjs 以查看它是否可以反映近乎实时的体验 - 例如:飞机的位置。
为此,我需要绘制广告牌并让它们移动 - 我知道用铯可以做到这一点,只是不确定如何实现。
代码如下所示:
var billboards = scene.primitives.add(new Cesium.BillboardCollection());
var billboard = {
image : '/path/to/logo.png',
position : Cesium.Cartesian3.fromDegrees(-75.59777, 40.03883)
};
billboards.add(billboard);
我的问题是如何更改广告牌的位置。我找不到可以解释的 ant 文档。
我想这样做:
billboard.position = ... //new position
但是cesium怎么知道我已经改变了位置属性,除非它以某种方式将该引用变成一个可观察的对象。
那么我该如何更新位置呢?
谢谢。
Cesium 确实会监听 billboard.position
的变化
(source code here),因此应用仅写入新位置是正确的行为。
请注意,您必须一次写入整个位置,这意味着您可以而不是写入billboard.position.x
。相反,保留一个 "scratch" Cartesian3(不要在 60fps 的每个动画帧中创建一个 new
),写入 scratch 变量的 x,y,z
属性,然后分配你的 scratch 变量至 billboard.position
。您可以在源代码中看到分配的值将被克隆到另一个预先存在的 Cartesian3 中,因此您可以立即重用 scratch 变量。
这是一个例子:
// Just once at app startup. Don't call "new" at 60fps.
var scratchCartesian3 = new Cesium.Cartesian3();
var ellipsoid = viewer.scene.mapProjection.ellipsoid;
function onTick() {
// This is safe to call at 60fps.
billboard.position = Cesium.Cartesian3.fromDegrees(
lon, lat, alt, ellipsoid, scratchCartesian3);
}
另请注意,您的问题和上述答案都集中在 Cesium API 的 "Graphics Primitive" 层上。 Cesium 有一个更高的层,称为“Entity" API, that you can use if you want Cesium to handle the concept of user-selectable objects with pop-up descriptions etc. Here's a Sandcastle demo showing how to add a billboard as a property of an entity, instead of as a primitive. This allows you to add other properties to the same entity, for example a name, description, label, 3D model, etc, and have them all be controlled from the same position property, and have Cesium take care of popup descriptions. The position property is more complex for entities than for primitives, for example it can be constant or sampled。这允许实体在显示时间线时随时间改变位置。
我正在测试 Cesiumjs 以查看它是否可以反映近乎实时的体验 - 例如:飞机的位置。
为此,我需要绘制广告牌并让它们移动 - 我知道用铯可以做到这一点,只是不确定如何实现。
代码如下所示:
var billboards = scene.primitives.add(new Cesium.BillboardCollection());
var billboard = {
image : '/path/to/logo.png',
position : Cesium.Cartesian3.fromDegrees(-75.59777, 40.03883)
};
billboards.add(billboard);
我的问题是如何更改广告牌的位置。我找不到可以解释的 ant 文档。
我想这样做:
billboard.position = ... //new position
但是cesium怎么知道我已经改变了位置属性,除非它以某种方式将该引用变成一个可观察的对象。
那么我该如何更新位置呢?
谢谢。
Cesium 确实会监听 billboard.position
的变化
(source code here),因此应用仅写入新位置是正确的行为。
请注意,您必须一次写入整个位置,这意味着您可以而不是写入billboard.position.x
。相反,保留一个 "scratch" Cartesian3(不要在 60fps 的每个动画帧中创建一个 new
),写入 scratch 变量的 x,y,z
属性,然后分配你的 scratch 变量至 billboard.position
。您可以在源代码中看到分配的值将被克隆到另一个预先存在的 Cartesian3 中,因此您可以立即重用 scratch 变量。
这是一个例子:
// Just once at app startup. Don't call "new" at 60fps.
var scratchCartesian3 = new Cesium.Cartesian3();
var ellipsoid = viewer.scene.mapProjection.ellipsoid;
function onTick() {
// This is safe to call at 60fps.
billboard.position = Cesium.Cartesian3.fromDegrees(
lon, lat, alt, ellipsoid, scratchCartesian3);
}
另请注意,您的问题和上述答案都集中在 Cesium API 的 "Graphics Primitive" 层上。 Cesium 有一个更高的层,称为“Entity" API, that you can use if you want Cesium to handle the concept of user-selectable objects with pop-up descriptions etc. Here's a Sandcastle demo showing how to add a billboard as a property of an entity, instead of as a primitive. This allows you to add other properties to the same entity, for example a name, description, label, 3D model, etc, and have them all be controlled from the same position property, and have Cesium take care of popup descriptions. The position property is more complex for entities than for primitives, for example it can be constant or sampled。这允许实体在显示时间线时随时间改变位置。