Skip to content

Instantly share code, notes, and snippets.

@onsummer
Created January 8, 2024 15:35
Show Gist options
  • Save onsummer/b14ebb30855b1e315e4ebe45ed0d3756 to your computer and use it in GitHub Desktop.
Save onsummer/b14ebb30855b1e315e4ebe45ed0d3756 to your computer and use it in GitHub Desktop.
Double side shading by real-view-direction
const viewer = new Cesium.Viewer("cesiumContainer");
const primitives = viewer.scene.primitives;
const fs = `czm_material czm_getMaterial(czm_materialInput materialInput) {
czm_material m = czm_getDefaultMaterial(materialInput);
float side = dot(materialInput.positionToEyeEC, materialInput.normalEC);
m.alpha = side > 0.0 ? 0.9 : 0.4;
m.diffuse = side > 0.0 ? vec3(0.0, 1.0, 0.0) : vec3(1.0, 0.0, 0.0);
return m;
}`;
const g = new Cesium.PolygonGeometry({
closeBottom: false,
closeTop: false,
height: 400000,
extrudedHeight: 800000,
polygonHierarchy: new Cesium.PolygonHierarchy(
Cesium.Cartesian3.fromDegreesArray([
110.0, 20.0,
115.0, 20.0,
115.0, 25.0,
112.5, 22.5,
110.0, 25.0
])
),
});
const material = new Cesium.Material({
fabric: {
type : 'DoubleSideColor',
source: fs,
},
});
const a = new Cesium.MaterialAppearance({
faceForward: false,
material,
});
console.log(a.fragmentShaderSource);
const primitive = new Cesium.Primitive({
geometryInstances: [new Cesium.GeometryInstance({
geometry: g,
})],
appearance: a,
});
primitives.add(primitive);
@onsummer
Copy link
Author

onsummer commented Jan 8, 2024

着色器不能用 -Z 轴当视线的原因很简单.
-Z 轴与三角面平行的时候,透视视角下“里面”是可以看得到的,但是因为平行的关系会在边界处轻易判断成“外面”,参考点积的意义。
所以视线应为视空间下到片元的向量,也即 materialInput.positionToEyeEC

@onsummer
Copy link
Author

onsummer commented Jan 8, 2024

image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment