Cesium天际线分析

	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，如有侵权，请联系删除。

标签：分析,fragmentShader,天际线,uniform,var,Cesium,paramObj,name
来源： https://www.cnblogs.com/hustshu/p/15867476.html