一、基本用法
viewer.entities.add方法是CesiumJS中創建和添加實體的最基本方式。這個方法用於添加不同類型的實體,例如點、線、面、模型和標籤等。
以下是添加一個紅色點的實例:
viewer.entities.add({
point: {
position: Cesium.Cartesian3.fromDegrees(-75.59777, 40.03883),
color: Cesium.Color.RED
}
});
點實體可以通過設置其他屬性來進行自定義,例如大小、輪廓和顏色等。
因此,viewer.entities.add方法是CesiumJS創建場景元素的核心,開發人員可以通過它實現各種效果。
二、創建幾何實體
viewer.entities.add方法支持創建各種幾何實體,例如點、線、面和多邊形等。
以下是在地球上創建一個圓形的例子:
viewer.entities.add({
position: Cesium.Cartesian3.fromDegrees(-75.59777, 40.03883),
ellipse: {
semiMinorAxis: 200000.0,
semiMajorAxis: 200000.0,
material: Cesium.Color.BLUE.withAlpha(0.5)
}
});
這個例子創建了一個半徑為200公里的藍色半透明圓形。
除了圓形,viewer.entities.add支持創建其他幾何實體,例如點、線、多邊形和立方體等。各種幾何實體可以通過設置屬性來自定義其樣式和外觀。
三、創建模型實體
除了幾何實體,viewer.entities.add也支持創建模型實體。這個方法可以添加自定義的3D模型,例如CESIUM內置的飛機、車輛和人物模型。
以下是添加一架默認飛機模型的例子:
viewer.entities.add({
position: Cesium.Cartesian3.fromDegrees(-75.59777, 40.03883),
orientation: Cesium.Quaternion.IDENTITY,
model: {
uri: 'cesium/Assets/Models/CesiumAir/Cesium_Air.glb'
}
});
這個例子創建了一架默認的飛機模型。開發人員也可以使用自己的3D模型文件,例如在gltf、glb或obj格式中寫的模型。
四、創建標籤實體
viewer.entities.add方法支持添加標籤實體,這個方法可以在地球上標註文字、數字和各種自定義符號。標籤實體可以指定位置、大小、顏色和字體等樣式屬性。
以下是添加標籤實體的例子:
viewer.entities.add({
position: Cesium.Cartesian3.fromDegrees(-75.59777, 40.03883),
label: {
text: 'Hello, World!',
font: '24px Helvetica',
fillColor: Cesium.Color.WHITE,
outlineColor: Cesium.Color.BLACK,
outlineWidth: 2,
style: Cesium.LabelStyle.FILL_AND_OUTLINE
}
});
這個例子創建了一個稱為”Hello, World!”的標籤實體,字體大小為24px,字體顏色為白色,描邊為黑色並且寬度為2,使用填充加描邊的樣式。
五、使用批量添加實體
使用單獨的viewer.entities.add調用添加多個實體需要多次網絡訪問,並且會增加渲染複雜性。CesiumJS提供了一種將多個實體批量添加到場景中的方法,以實現高效的添加。
以下是批量添加點實體的示例:
var entities = [];
for (var i = 0; i < 1000; ++i) {
entities.push({
position : Cesium.Cartesian3.fromDegrees(-75.59777 + i / 100, 40.03883),
point : {
pixelSize : 5,
color : Cesium.Color.RED
}
});
}
viewer.entities.add(entities);
這個例子批量添加了1000個紅色點實體。開發人員可以根據需要定製添加實體的數量、位置和樣式。
六、結語
在應用場景開發中,掌握viewer.entities.add方法可以更好地創建和管理各種實體和模型。本文詳細介紹了該方法的基本用法、創建幾何實體、創建模型實體、創建標籤實體和批量添加實體等方面內容。希望對廣大開發人員有所幫助。
原創文章,作者:FWITF,如若轉載,請註明出處:https://www.506064.com/zh-hk/n/370462.html
微信掃一掃
支付寶掃一掃