区块链技术博客
www.b2bchain.cn

Cesium 顶点着色器中解算模型坐标求职学习资料

D0b2wT.gif

本文介绍了Cesium 顶点着色器中解算模型坐标求职学习资料,有助于帮助完成毕业设计以及求职,是一篇很好的资料。

对技术面试,学习经验等有一些体会,在此分享。

  • 1. 由世界坐标转模型坐标
  • 2. 由相机坐标转模型坐标
  • 3. 坐标陷阱:模型坐标系≠东北上坐标系

1. 由世界坐标转模型坐标

顶点着色器:

attribute vec3 position3DHigh; attribute vec3 position3DLow; attribute vec3 normal; attribute vec2 st; attribute float batchId;  varying vec3 v_positionEC; varying vec3 v_normalEC; varying vec2 v_st;  void main() {   vec3 positionWC = position3DHigh + position3DLow; // 得到世界坐标   // 官方得到世界坐标(齐次)是这么做的,在三维模式下等价     // vec4 positionWC = czm_computePosition();   vec4 positionMC = czm_inverseModel * vec4(positionWC, 1); // 得到模型坐标    // 以下为官方代码,未改动,仅修改注释   vec4 p = czm_computePosition(); // 得到世界坐标    v_positionEC = (czm_modelViewRelativeToEye * p).xyz; // 得到相机坐标   v_normalEC = czm_normal * normal; // 得到相机坐标系下的法线向量   v_st = st; // 传递uv    gl_Position = czm_modelViewProjectionRelativeToEye * p; // 世界坐标到裁剪空间坐标 }

2. 由相机坐标转模型坐标

顶点着色器

attribute vec3 position3DHigh; attribute vec3 position3DLow; attribute vec3 normal; attribute vec2 st; attribute float batchId;  varying vec3 v_positionEC; varying vec3 v_normalEC; varying vec2 v_st;  void main() {       vec4 p = czm_computePosition(); // 得到齐次世界坐标    v_positionEC = (czm_modelViewRelativeToEye * p).xyz; // 得到相机坐标   v_normalEC = czm_normal * normal;   v_st = st;    /** 此处开始添加计算模型坐标的代码 */   vec4 positionMC = czm_inverseModelView * vec4(v_positionEC, 1.0); // 得到模型坐标   /** 添加的代码结束 */    gl_Position = czm_modelViewProjectionRelativeToEye * p; // 世界坐标到裁剪空间坐标 }

3. 坐标陷阱:模型坐标系≠东北上坐标系

参考如下代码:

“` JS
var viewer = new Cesium.Viewer(“cesiumContainer”);
viewer.scene.globe.depthTestAgainstTerrain = true;
viewer.camera.setView({
destination : new Cesium.Cartesian3(-2644963.9889313546, 5763731.142118295, 2199400.7089496767), //世界坐标系下的一个坐标点
orientation : {//旋转角度
heading :6.075,
pitch :-0.727,
roll : 6.283
}
});

const extrudedPolygon = new Cesium.PolygonGeometry({
polygonHierarchy : new Cesium.PolygonHierarchy(
Cesium.Cartesian3.fromDegreesArray([
112.41726298378288, 23.290411251106182,
113.67072522399741, 23.560312361463682,
114.09370956893551, 22.590768298743153,
112.83803246418894, 22.285610818885644
])
),
extrudedHeight: 30000

  • 1. 由世界坐标转模型坐标
  • 2. 由相机坐标转模型坐标
  • 3. 坐标陷阱:模型坐标系≠东北上坐标系

1. 由世界坐标转模型坐标

顶点着色器:

attribute vec3 position3DHigh; attribute vec3 position3DLow; attribute vec3 normal; attribute vec2 st; attribute float batchId;  varying vec3 v_positionEC; varying vec3 v_normalEC; varying vec2 v_st;  void main() {   vec3 positionWC = position3DHigh + position3DLow; // 得到世界坐标   // 官方得到世界坐标(齐次)是这么做的,在三维模式下等价     // vec4 positionWC = czm_computePosition();   vec4 positionMC = czm_inverseModel * vec4(positionWC, 1); // 得到模型坐标    // 以下为官方代码,未改动,仅修改注释   vec4 p = czm_computePosition(); // 得到世界坐标    v_positionEC = (czm_modelViewRelativeToEye * p).xyz; // 得到相机坐标   v_normalEC = czm_normal * normal; // 得到相机坐标系下的法线向量   v_st = st; // 传递uv    gl_Position = czm_modelViewProjectionRelativeToEye * p; // 世界坐标到裁剪空间坐标 }

2. 由相机坐标转模型坐标

顶点着色器

attribute vec3 position3DHigh; attribute vec3 position3DLow; attribute vec3 normal; attribute vec2 st; attribute float batchId;  varying vec3 v_positionEC; varying vec3 v_normalEC; varying vec2 v_st;  void main() {       vec4 p = czm_computePosition(); // 得到齐次世界坐标    v_positionEC = (czm_modelViewRelativeToEye * p).xyz; // 得到相机坐标   v_normalEC = czm_normal * normal;   v_st = st;    /** 此处开始添加计算模型坐标的代码 */   vec4 positionMC = czm_inverseModelView * vec4(v_positionEC, 1.0); // 得到模型坐标   /** 添加的代码结束 */    gl_Position = czm_modelViewProjectionRelativeToEye * p; // 世界坐标到裁剪空间坐标 }

3. 坐标陷阱:模型坐标系≠东北上坐标系

参考如下代码:

“` JS
var viewer = new Cesium.Viewer(“cesiumContainer”);
viewer.scene.globe.depthTestAgainstTerrain = true;
viewer.camera.setView({
destination : new Cesium.Cartesian3(-2644963.9889313546, 5763731.142118295, 2199400.7089496767), //世界坐标系下的一个坐标点
orientation : {//旋转角度
heading :6.075,
pitch :-0.727,
roll : 6.283
}
});

const extrudedPolygon = new Cesium.PolygonGeometry({
polygonHierarchy : new Cesium.PolygonHierarchy(
Cesium.Cartesian3.fromDegreesArray([
112.41726298378288, 23.290411251106182,
113.67072522399741, 23.560312361463682,
114.09370956893551, 22.590768298743153,
112.83803246418894, 22.285610818885644
])
),
extrudedHeight: 30000

  • 1. 由世界坐标转模型坐标
  • 2. 由相机坐标转模型坐标
  • 3. 坐标陷阱:模型坐标系≠东北上坐标系

1. 由世界坐标转模型坐标

顶点着色器:

attribute vec3 position3DHigh; attribute vec3 position3DLow; attribute vec3 normal; attribute vec2 st; attribute float batchId;  varying vec3 v_positionEC; varying vec3 v_normalEC; varying vec2 v_st;  void main() {   vec3 positionWC = position3DHigh + position3DLow; // 得到世界坐标   // 官方得到世界坐标(齐次)是这么做的,在三维模式下等价     // vec4 positionWC = czm_computePosition();   vec4 positionMC = czm_inverseModel * vec4(positionWC, 1); // 得到模型坐标    // 以下为官方代码,未改动,仅修改注释   vec4 p = czm_computePosition(); // 得到世界坐标    v_positionEC = (czm_modelViewRelativeToEye * p).xyz; // 得到相机坐标   v_normalEC = czm_normal * normal; // 得到相机坐标系下的法线向量   v_st = st; // 传递uv    gl_Position = czm_modelViewProjectionRelativeToEye * p; // 世界坐标到裁剪空间坐标 }

2. 由相机坐标转模型坐标

顶点着色器

attribute vec3 position3DHigh; attribute vec3 position3DLow; attribute vec3 normal; attribute vec2 st; attribute float batchId;  varying vec3 v_positionEC; varying vec3 v_normalEC; varying vec2 v_st;  void main() {       vec4 p = czm_computePosition(); // 得到齐次世界坐标    v_positionEC = (czm_modelViewRelativeToEye * p).xyz; // 得到相机坐标   v_normalEC = czm_normal * normal;   v_st = st;    /** 此处开始添加计算模型坐标的代码 */   vec4 positionMC = czm_inverseModelView * vec4(v_positionEC, 1.0); // 得到模型坐标   /** 添加的代码结束 */    gl_Position = czm_modelViewProjectionRelativeToEye * p; // 世界坐标到裁剪空间坐标 }

3. 坐标陷阱:模型坐标系≠东北上坐标系

参考如下代码:

“` JS
var viewer = new Cesium.Viewer(“cesiumContainer”);
viewer.scene.globe.depthTestAgainstTerrain = true;
viewer.camera.setView({
destination : new Cesium.Cartesian3(-2644963.9889313546, 5763731.142118295, 2199400.7089496767), //世界坐标系下的一个坐标点
orientation : {//旋转角度
heading :6.075,
pitch :-0.727,
roll : 6.283
}
});

const extrudedPolygon = new Cesium.PolygonGeometry({
polygonHierarchy : new Cesium.PolygonHierarchy(
Cesium.Cartesian3.fromDegreesArray([
112.41726298378288, 23.290411251106182,
113.67072522399741, 23.560312361463682,
114.09370956893551, 22.590768298743153,
112.83803246418894, 22.285610818885644
])
),
extrudedHeight: 30000

部分转自互联网,侵权删除联系

赞(0) 打赏
部分文章转自网络,侵权联系删除b2bchain区块链学习技术社区 » Cesium 顶点着色器中解算模型坐标求职学习资料
分享到: 更多 (0)
D0b2wT.gif

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

b2b链

联系我们联系我们