cesium 线条效果
时间: 2023-10-11 17:09:20 浏览: 186
Cesium实现效果:1、切换底图资源;2、折叠菜单项;3、修改默认视点为北京天安门;4、开启关闭三维在线地形;5、加载离线本地
5星 · 资源好评率100%
Cesium是一个用于构建地球和空间应用的开源JavaScript库。要实现Cesium的线条效果,可以使用Cesium的PolylineGlowMaterial或PolylineOutlineMaterial材质。
PolylineGlowMaterial材质可以在线条周围创建一个发光效果,使线条看起来更加突出。以下是创建Cesium线条的示例代码:
```javascript
var viewer = new Cesium.Viewer("cesiumContainer");
var positions = Cesium.Cartesian3.fromDegreesArray([
-115.0, 37.0,
-107.0, 37.0,
-102.0, 31.0,
-102.0, 25.0
]);
viewer.entities.add({
polyline: {
positions: positions,
width: 5,
material: new Cesium.PolylineGlowMaterialProperty({
glowPower: 0.2,
color: Cesium.Color.YELLOW
})
}
});
```
PolylineOutlineMaterial材质可以在线条周围创建一个轮廓效果,使线条更加清晰。以下是创建Cesium线条的示例代码:
```javascript
var viewer = new Cesium.Viewer("cesiumContainer");
var positions = Cesium.Cartesian3.fromDegreesArray([
-115.0, 37.0,
-107.0, 37.0,
-102.0, 31.0,
-102.0, 25.0
]);
viewer.entities.add({
polyline: {
positions: positions,
width: 5,
material: new Cesium.PolylineOutlineMaterialProperty({
color: Cesium.Color.YELLOW,
outlineWidth: 2,
outlineColor: Cesium.Color.BLACK
})
}
});
```
以上示例代码中,positions数组定义了线条的坐标点,width属性定义了线条的宽度,material属性定义了线条的材质。
阅读全文