threejs生成由内而外光圈、城市掠过。

1.生成掠过的光圈材质。

var uniform = {u_color: { value: new THREE.Color("#5588aa") },u_tcolor: { value: new THREE.Color("#EF5F00") },u_r: { value:0.8 },u_length: { value: 20 },//扫过区域u_max: { value: 600 }//扫过最大值
};
var Shader = {vertexShader: `varying vec3 vp;void main(){vp = position;gl_Position   = projectionMatrix * modelViewMatrix * vec4(position, 1.0);}`,fragmentShader: `varying vec3 vp;uniform vec3 u_color;uniform vec3 u_tcolor;uniform float u_r;uniform float u_length;uniform float u_max;float getLeng(float x, float y){return  sqrt((x-0.0)*(x-0.0)+(y-0.0)*(y-0.0));}void main(){float uOpacity = 0.3;vec3 vColor = u_color;float uLength = getLeng(vp.x,vp.z);if ( uLength <= u_r && uLength > u_r - u_length ) {float op = sin( (u_r - uLength) / u_length ) * 0.6 + 0.3 ;uOpacity = op;if( vp.y<0.0){vColor  = u_tcolor * 0.6;}else{vColor = u_tcolor;};}gl_FragColor = vec4(vColor,uOpacity);}`
}
aamaterial = new THREE.ShaderMaterial({vertexShader: Shader.vertexShader,fragmentShader: Shader.fragmentShader,side: THREE.DoubleSide,uniforms: uniform,transparent: true,depthWrite: false,
});

animate()中执行

if (aamaterial) {aamaterial.uniforms.u_r.value += delta * 50 + 4;if (aamaterial.uniforms.u_r.value >= 600) {aamaterial.uniforms.u_r.value = 20}
}
console.log(aamaterial);

3.使用方式

plane = new THREE.Mesh( geometry, aamaterial );

4.效果

threejs生成由内而外光圈、城市掠过。相关推荐

threejs生成3d地图所需
threejs生成3d地图所需 1.threejs,郭龙邦弄的教程熟悉形状.线绘制,绘制白模楼宇熟悉sprite,用以做POI标注熟悉光照熟悉LOD,用以远近不同时加载不同物体.地面熟悉漫游 ...
使用Navicat生成全国省份城市SQL数据库
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录前言一.表二.使用步骤 1.引入库 2.添加城市数据前言网上找了关于省份-城市的数据库,不合适自己的,现在自己写一个 ...
webgl(threejs)生成房间楼层
楔子在很多数字孪生项目中,都会涉及到楼层的建模.楼层的建模由于结构繁多,如果都是建模师进行手动建模,工作量会比较大.而楼层本身的结构,可以抽象成可以通过路径构造的对象(这和之前的文章提及的的管路以及 ...
ThingMap一键城市2.0重新出发：快速生成三维城市
在城市级可视化项目中,一般需要可视化的三维地图作为承载各种应用的载体,但大家在使用三维地图的过程中经常碰到3道难题:1.资源获取不便2.操作使用复杂3.模型效果不理想.为了降低三维地图的获取和使用难度 ...
geojson地图_ThingJS的三维城市地图搭建逻辑解析
一个城市越智慧,综合竞争力越强,面向用户的可视化更是必不可少,ThingJS的三维城市地图搭建工具应运而生. Citybuilder是ThingJS旗下三维地图城市搭建工具,使用Citybuilder ...
游戏编程中的数学——随机数字生成（RNG）的黑暗秘密
大家好,你们能听到我讲话吗?这个演讲的内容是介绍RNG(随机数字生成)的一些黑暗秘密.如你在大屏幕上看到的,Squirrel已经介绍了一些RNG的基础概念.首先,我想详细讲解几点.他的演讲更偏重理论, ...
详谈asp生成静态页方法
生成静态页的好处不用说,当今大型网站,为缓解服务器端的压力许的的页面都改用了静态的页面,并利用AJAX技术动态地更新其中的部分内容,如广告等. 一个简单的不用模板可以直接生成HTML静态页的方法. 如 ...
python爬取天气数据山东_Python的学习《山东省各城市天气爬取》
Python+scrapy爬取山东各城市天气预报 1.在命令提示符环境使用pip install scrapy命令安装Python扩展库scrapy,详见Python使用Scrapy爬虫框架爬取天涯社 ...
手把手教你使用Python+scrapy爬取山东各城市天气预报
1.在命令提示符环境使用pip install scrapy命令安装Python扩展库scrapy,详见Python使用Scrapy爬虫框架爬取天涯社区小说"大宗师"全文 2.使用 ...
城市“智慧发展”的核心是人性化
现在很多智慧城市建设规划只是将"高楼大厦.跨马路.大广场"的物质建设型城镇化模式进行了信息化升级. 经济的变局中,城市的发展起落不定,一方面,一些曾经拥有辉煌历史和重要政治经济地位 ...

threejs生成由内而外光圈、城市掠过。

threejs生成由内而外光圈、城市掠过。相关推荐

最新文章

热门文章