`
var viewer = new Cesium.Viewer("cesiumContainer", {
// 加入世界地形數據
terrainProvider: Cesium.createWorldTerrain({
requestWaterMask: true,
requestVertexNormals: true
}),
});
var redLine = viewer.entities.add({
// 貼在地面上 兩點之間的直線距離
name: "Red_line on terrain",
polyline: {
positions: Cesium.Cartesian3.fromDegreesArray([-75, 35, -125, 35]),
width: 10,
// 不帶箭頭的線
// material: Cesium.Color.RED,
// 是否緊貼地面
clampToGround: true,
// 帶箭頭的線
material: new Cesium.PolylineArrowMaterialProperty(
Cesium.Color.RED
),
},
});
var greenRhumbLine = viewer.entities.add({
name: "Green rhumb line",
polyline: {
positions: Cesium.Cartesian3.fromDegreesArray([-75, 35, -125, 35]),
width: 5,
// arcType:多段線線段必須遵循的直線類型。
// NONE:不符合橢球表面的直線。
// GEODESIC:沿測地線路徑。
// RHUMB:沿着直角或斜線路徑。
arcType: Cesium.ArcType.RHUMB,
material: Cesium.Color.GREEN,
},
});
var glowingLine = viewer.entities.add({
name: "Glowing blue line on the surface",
polyline: {
positions: Cesium.Cartesian3.fromDegreesArray([-75, 37, -125, 37]),
width: 10,
material: new Cesium.PolylineGlowMaterialProperty({
// 指定輝光強度的數字屬性,以總線寬的百分比表示。
glowPower: 0.7,
// 一種數字特性,指定漸變效果的強度,以占總線條長度的百分比表示。如果為1.0或更高,則不使用錐度效果。
taperPower: 0.6,
color: Cesium.Color.RED,
}),
},
});
var orangeOutlined = viewer.entities.add({
name: "Orange line with black outline at height and following the surface",
polyline: {
positions: Cesium.Cartesian3.fromDegreesArrayHeights([
-75, 39, 250000,
-125, 39, 250000,
]),
width: 5,
// arcType: Cesium.ArcType.RHUMB,
// arcType: Cesium.ArcType.GEODESIC,
material: new Cesium.PolylineOutlineMaterialProperty({
color: Cesium.Color.ORANGE,
outlineWidth: 2,
outlineColor: Cesium.Color.BLACK,
}),
},
});
var purpleArrow = viewer.entities.add({
name: "Purple straight arrow at height",
polyline: {
positions: Cesium.Cartesian3.fromDegreesArrayHeights([
-75, 43, 500000,
-125, 43, 500000,
]),
width: 10,
arcType: Cesium.ArcType.NONE,
// 帶箭頭的直線
// material: new Cesium.PolylineArrowMaterialProperty(
// Cesium.Color.PURPLE
// ),
// 不帶箭頭的直線
material: Cesium.Color.PURPLE
},
});
var dashedLine = viewer.entities.add({
name: "Blue dashed line",
polyline: {
positions: Cesium.Cartesian3.fromDegreesArrayHeights([
-75, 45, 500000,
-125, 45, 500000,
]),
width: 4,
// 普通的直線
// PolylineGlowMaterialProperty
// 虛線
// PolylineDashMaterialProperty
// 多段線輪廓材質屬性
// PolylineOutlineMaterialProperty
material: new Cesium.PolylineOutlineMaterialProperty({
color: Cesium.Color.CYAN,
}),
},
});
viewer.zoomTo(viewer.entities);`