踩坑记录 在网上找的教程,但是写出来怎么都不对,最后发现是geometry的 vertexFormat写错了导致shader的效果很奇怪
有点疑惑 什么样子的shader 要配合 对应的顶点格式 挖个坑先
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
|
export function addWallGeojson(wallList, maximumHeights, minimumHeights, type, defaultShow) {
const geometryInstances = wallList.map(positions => {
positions.push(positions[0])
return new Cesium.GeometryInstance({
geometry: new Cesium.WallGeometry({
positions: positions,
maximumHeights: positions.map(e => maximumHeights),
minimumHeights: positions.map(e => minimumHeights),
vertexFormat: Cesium.MaterialAppearance.VERTEX_FORMAT
})
})
})
const wall = new Cesium.Primitive({
show: defaultShow,
geometryInstances,
appearance: new Cesium.MaterialAppearance({
material: new Cesium.Material({
fabric: {
type: 'DynamicWall',
uniforms: {
image: getAssetsFile('imgs/materialImg/wall.png'),
color: new Cesium.Color.fromCssColorString(typeColorDic[type]),
speed: 2
},
source: `
czm_material czm_getMaterial(czm_materialInput materialInput) {
czm_material material = czm_getDefaultMaterial(materialInput);
vec2 st = materialInput.st;
vec4 colorImage = texture(image, vec2((1. - fract(st.t - speed * czm_frameNumber * 0.005)), st.t));
vec4 fragColor;
fragColor.rgb = color.rgb / 1.0;
fragColor = czm_gammaCorrect(fragColor); // 伽马校正
material.alpha = colorImage.a * color.a * .5;
material.diffuse = color.rgb;
material.emission = fragColor.rgb;
return material;
}
`
},
})
})
})
wall.name = type
window.gViewer.scene.primitives.add(wall)
}
|