网站开发和大数据开发区别,云南免费网站建设,广州哪里可以做网站,网站开发蓝云前言 上一篇文章中介绍了如何创建三维对象及加载皮肤#xff0c;本文为大家介绍如何为场景添加光源。 一、 原理分析 光在任何地方都是非常重要的#xff0c;无论在哪里都说是要发光发热#xff0c;光和热也是分不开的。光线分为点光源和线光源#xff0c;所谓点光源和线光…前言 上一篇文章中介绍了如何创建三维对象及加载皮肤本文为大家介绍如何为场景添加光源。 一、 原理分析 光在任何地方都是非常重要的无论在哪里都说是要发光发热光和热也是分不开的。光线分为点光源和线光源所谓点光源和线光源也是个相对的概念站在地球上我们可以认为太阳光是线光源其实从更大的尺度来看太阳光也是个点光源只是我们站在地球上来看光线基本上是平行的了所以可以认为是线光源。所有问题站在不同的角度来看就会发生变化。 光线还有另外几个概念环境光ambient light、漫反射光diffuse light、镜面反射光specular light。所谓环境光是指入射光均匀地从周围环境入射至景物表面并等量地向各个方向反射出去通常物体表面还会受到从周围环境来的反射光地面、天空、墙壁等的照射这些统称为环境光。漫反射光表示特定光源在景物表面的反射光中那些向空间各方向均匀反射出去的光。镜面反射光为朝一定方向的反射光如点光源照射一个金属球时会在表面形成一块特定亮的区域它是光源在金属球面上产生的镜面反射光镜面反射光与物体的光滑程度有关系。 对于3D也是一样我这几年搞的比较多的是地理信息系统那么为什么还要学习3D以及之前的大数据等技术呢首先我对学习充满了无限热情碰到新技术就想学一下当然这不见得是个好事情因为一个人不可能把什么都学会必须要有所取舍否则就会像我一样导致什么都略懂但都不精通。其次任何知识都是有用的不知道哪天就会用到比如Hadoop集群刚开始感觉很高大上就学了一点后面果然需要使用这种分布式计算技术来处理遥感影像于是Geotrellis很快就上手了关于3D我认为也是同样如此这个说不定就会在将来的工作中用到比如倾斜摄影以及点云等等技术。 骚年们让我们开始今天的学习吧。 二、 创建光源 首先我们必须清楚光源是加在整个场景中的而不是某个对象就像太阳光打到地球上是整个环境都有了光而不是说只是某个对象有了光。对待PhiloGL也是一样直接从场景中获取光线设置信息并对其进行设置。 2.1 场景配置 所以在onLoad事件中添加如下代码 var scene app.scene
var lightConfig scene.config.lights;
lightConfig.enable true; lightConfig就是对整个场景光源设置的变量。首先设置其enbale属性为true表示使用光源。上面分析的几种光源均可以添加或者不添加在特定场景中并可以任意设置其光源位置及颜色分量等。 2.2 线光源 设置lightConfig属性的directional的direction和color属性。 lightConfig.directional.direction {x: light.x,y: light.y,z: light.z
};
lightConfig.directional.color {r: light.r,g: light.g,b: light.b
}; 其中direction表示光线方向color表示光线颜色。 坐标系此处需要补充一个之前早已涉及但被我忽略的问题——坐标系。坐标系是任何图形学的基础居然遗漏了此问题。 WEbGL同样采用笛卡尔左手坐标系其Z轴正向为从屏幕指向用户的方向X轴正向为从屏幕中央指向屏幕右侧的方向Y轴正向为从屏幕中央指向屏幕上侧的方向。 此处light是我定义的变量存储了光线的上述信息注意此处变量前的此符号在js中的意义为将其他类型的数据转换为number此处因为可以直接定义成number类型所以不写也可。 此处还有一个问题经过我实际测试线光源的x、y、z为反向即真正光线的向量方向为(-x,-y,-z)。当然此处可能是由于我对坐标系理解有误或者实验有误如果如此欢迎批评指正。 2.3 点光源 点光源直接设置lightConfig的points属性。 lightConfig.points {diffuse: { // 散射光r: light.dr,g: light.dg,b: light.db},specular: { // 反射光r: light.sr,g: light.sg,b: light.sb},position: {x: light.x,y: light.y,z: light.z}
}; 其中diffuse表示散射光specular表示散射光position表示点光源的位置此处位置为实际的光源点的位置。 2.4 环境光 设置lightConfig的ambient属性。 lightConfig.ambient {r: ambient.r,g: ambient.g,b: ambient.b
}; 环境光不需要设置位置无论物体处在何处以及哪一面均会被射上此光。 2.5 另外一种写法 采用上面的写法的好处在于我们可以改变光线的值或者光线的位置其方法如同在第二篇文章中讲述的动画直接改变light的值即可。当然如果为固定我们还可以直接写在PhiloGL的配置中如下 PhiloGL(test1, {scene: {lights: {directional: {color: {r: 1, g: 1, b: 1},direction: {x: 0, y: 0, z: 0}}}},
}) 这是线光源的设置方法可以看出两种方式写法实质相同。点光源写法相同。 三、 总结 本文简单介绍了如何设置光源。到这里PhiloGL的基础以及WebGL的基础我们已经基本全部掌握了下一篇文章介绍一个案例做一个自转的地球及围绕其公转的地球。 转载于:https://www.cnblogs.com/shoufengwei/p/7751691.html
