var obj = {
			id: "Skyline",
			name: 'czm_skylinetemp',
			//fragmentShader 細繩   uniform著色器物件  
			fragmentShader: 'uniform sampler2D colorTexture;' +
				'uniform sampler2D depthTexture;' +
				'varying vec2 v_textureCoordinates;' +
				'void main(void)' +
				'{' +
				'float depth = czm_readDepth(depthTexture, v_textureCoordinates);' +
				'vec4 color = texture2D(colorTexture, v_textureCoordinates);' +
				'if(depth<1.0 - 0.000001){' +
				'gl_FragColor = color;' +
				'}' +
				'else{' +
				'gl_FragColor = vec4(1.0,0.0,0.0,1.0);' +
				'}' +
				'}',
			url: "http://earthsdk.com/v/last/Apps/assets/dayanta/tileset.json", //載入大雁塔傾斜模型資料
			position: [114.0595, 22.539, 10], 
			heading: 0, // 方位角(heading)
			pitch: 0, // 俯仰角(pitch) 旋轉角度
			roll: 360, // 滾動角(roll)
			destination:[114.0595, 22.539, 50],//相機視角
			orientation: {   
				heading : 0.0, 
				pitch : 0.0, 
				roll : 0.0                           
			}
		}

 

var tjx_model;
function addSkyline (paramObj) {
		var viewer = this.viewer
		var position = Cesium.Cartesian3.fromDegrees(paramObj.position[0], paramObj.position[1], paramObj.position[2]);
		var heading = Cesium.Math.toRadians(paramObj.heading);
		var pitch = Cesium.Math.toRadians(paramObj.pitch);
		var roll = Cesium.Math.toRadians(paramObj.roll);
		var hpRoll = new Cesium.HeadingPitchRoll(heading, pitch, roll);
		var converter = Cesium.Transforms.eastNorthUpToFixedFrame;
		var modelMatrix = Cesium.Transforms.headingPitchRollToFixedFrame(position, hpRoll, Cesium.Ellipsoid.WGS84, converter);
		//新增三維模型
		tjx_model = viewer.scene.primitives.add(
			new Cesium.Cesium3DTileset({
				url: paramObj.url, //模型資料url
			})
		);
		tjx_model.readyPromise.then(function () {
			//請求模型後執行
			tjx_model._root.transform = modelMatrix; //模型位置
		})

		//設定相機視角  上下調整
		viewer.camera.setView({
			destination: Cesium.Cartesian3.fromDegrees(paramObj.destination[0], paramObj.destination[1], paramObj.destination[2]),
			orientation: {       //設定視角
				heading: Cesium.Math.toRadians(paramObj.orientation.heading), // east, default value is 0.0 (north)左右擺頭
				pitch: Cesium.Math.toRadians(paramObj.orientation.pitch),    // default value (looking down)上下抬頭 -90俯視 0平視 90仰視(預設俯視)
				roll: paramObj.orientation.roll                          // default value
			}
		});

		//載入天際線
		var collection = viewer.scene.postProcessStages;
		var edgeDetection = Cesium.PostProcessStageLibrary.createEdgeDetectionStage();

		var postProccessStage = new Cesium.PostProcessStage({
			//此後處理階段的唯一名稱，供組合中的其他階段參考。如果未提供名稱，將生成 GUID。
			name: paramObj.name,
			//fragmentShader 細繩 uniform著色器物件  textureScale
			fragmentShader: paramObj.fragmentShader,
		});

		//PostProcessStage:要使用的片段著色器。預設sampler2D制服是colorTexture和depthTexture。
		var postProccessStage1 = new Cesium.PostProcessStage({
			//name:此後處理階段的唯一名稱，供組合中的其他階段參考。如果未提供名稱，將生成 GUID。
			name: 'czm_skylinetemp1',
			//fragmentShader 細繩 uniform著色器物件  textureScale
			fragmentShader: 'uniform sampler2D colorTexture;' +
				'uniform sampler2D redTexture;' +
				'uniform sampler2D silhouetteTexture;' +
				'varying vec2 v_textureCoordinates;' +
				'void main(void)' +
				'{' +
				'vec4 redcolor=texture2D(redTexture, v_textureCoordinates);' +
				'vec4 silhouetteColor = texture2D(silhouetteTexture, v_textureCoordinates);' +
				'vec4 color = texture2D(colorTexture, v_textureCoordinates);' +
				'if(redcolor.r == 1.0){' +
				'gl_FragColor = mix(color, vec4(5.0,0.0,0.0,1.0), silhouetteColor.a);' +
				'}' +
				'else{' +
				'gl_FragColor = color;' +
				'}' +
				'}',
			//uniform著色器物件
			uniforms: {
				redTexture: postProccessStage.name,
				silhouetteTexture: edgeDetection.name
			}
		});
		// 如果inputPreviousStageTexture是true，則每個階段的輸入是場景渲染到的輸出紋理或之前執行的階段的輸出紋理。
		// 如果inputPreviousStageTexture是false，則合成中每個階段的輸入紋理都是相同的。
		var postProccessStage = new Cesium.PostProcessStageComposite({
			//PostProcessStage要按順序執行 的 s 或組合的陣列。
			stages: [edgeDetection, postProccessStage, postProccessStage1],
			//是否執行每個後處理階段，其中一個階段的輸入是前一個階段的輸出。
			//否則，每個包含階段的輸入是在組合之前執行的階段的輸出。
			inputPreviousStageTexture: false,
			//後處理階段制服的別名。
			uniforms: edgeDetection.uniforms
		});
		collection.add(postProccessStage);
}

 

一頓操作之後，最終得到下面的結果

本文轉自 https://blog.csdn.net/qq_44505797/article/details/122804374，如有侵權，請聯絡刪除。