三维地图实现下雪效果源代码
作者:互联网
三维地图服务器 下载地址:http://download.bigemap.com/bm3Dserver.rar (最新版)
安装以上SDK后,启动,启动面板上找到开发使用,如下图源代码:
//注释:安装地图服务器后,下列代码中的 http://bigemap.com 替换成 http://localhost ,其他不变
<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'/>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no'/>
<link href='http://bigemap.com:9000/bigemap-gl.js/v1.1.0/Widgets/widgets.css' rel='stylesheet'/>
<script src='http://bigemap.com:9000/bigemap-gl.js/v1.1.0/bigemap-gl.js'></script>
<style>
body {
margin: 0;
padding: 0;
}
#container {
position: absolute;
top: 0;
bottom: 0;
width: 100%;
}
.bmgl-widget-credits{display:none}
</style>
<title>part_test</title>
</head>
<body>
<div id='container'></div>
<script>
bmgl.Config.HTTP_URL = 'http://bigemap.com:9000';
var viewer = new bmgl.Viewer('container', {mapId:'bigemap.googlemap-satellite',requestRenderMode:false});
var lat = 30.6;
var lon = 104.055;
//取消双击事件
viewer.BMWidget.screenSpaceEventHandler.removeInputAction(bmgl.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
//设置初始位置
viewer.camera.setView({
destination: bmgl.Cartesian3.fromDegrees(lon, lat, 300000)
});
//定义下雪场景 着色器
function FS_Snow() {
return "uniform sampler2D colorTexture;\n\
varying vec2 v_textureCoordinates;\n\
\n\
float snow(vec2 uv,float scale)\n\
{\n\
float time = czm_frameNumber / 60.0;\n\
float w=smoothstep(1.,0.,-uv.y*(scale/10.));if(w<.1)return 0.;\n\
uv+=time/scale;uv.y+=time*2./scale;uv.x+=sin(uv.y+time*.5)/scale;\n\
uv*=scale;vec2 s=floor(uv),f=fract(uv),p;float k=3.,d;\n\
p=.5+.35*sin(11.*fract(sin((s+p+scale)*mat2(7,3,6,5))*5.))-f;d=length(p);k=min(d,k);\n\
k=smoothstep(0.,k,sin(f.x+f.y)*0.01);\n\
return k*w;\n\
}\n\
\n\
void main(void){\n\
vec2 resolution = czm_viewport.zw;\n\
vec2 uv=(gl_FragCoord.xy*2.-resolution.xy)/min(resolution.x,resolution.y);\n\
vec3 finalColor=vec3(0);\n\
float c = 0.0;\n\
c+=snow(uv,30.)*.0;\n\
c+=snow(uv,20.)*.0;\n\
c+=snow(uv,15.)*.0;\n\
c+=snow(uv,10.);\n\
c+=snow(uv,8.);\n\
c+=snow(uv,6.);\n\
c+=snow(uv,5.);\n\
finalColor=(vec3(c)); \n\
gl_FragColor = mix(texture2D(colorTexture, v_textureCoordinates), vec4(finalColor,1), 0.3); \n\
\n\
}\n\
";
}
var collection = viewer.scene.postProcessStages;
var fs_snow = FS_Snow();
var snow = new bmgl.PostProcessStage({
name: 'czm_snow',
fragmentShader: fs_snow
});
collection.add(snow);
</script>
</body>
</html>
效果图:
标签:scale,float,下雪,uv,三维,snow,var,bmgl,源代码 来源: https://blog.51cto.com/u_15262562/2883422