首页 > 其他分享 >Arcgis 与 Claygl 可视化 glsl 特效篇(三十七)

Arcgis 与 Claygl 可视化 glsl 特效篇(三十七)

时间:2023-04-24 15:34:41浏览次数:35  
标签:glsl claygl float uv snow Claygl Arcgis vec2 sin

我决定不从claygl基础来讲了 直接整合arcgis与claygl可视化来讲
关于整合clagyl 有兴趣看我这篇文章 arcgis 与 claygl 引擎结合做地图可视化

我整合一个类库 后续不断更新中

  • npm i @haibalai/gismap4-claygl

 

初始化gismap4-claygl 类库, view是arcgis的sceneView对象

  • import { ClayglMapManager} from "@haibalai/gismap4-claygl";
  • ClayglMapManager.init(view);

 

添加特效

  • import { ClayglMapManager} from "@haibalai/gismap4-claygl";
  • import * as clay from "claygl";
  • const fragmentShader =`
  • #ifdef GL_ES
  • precision highp float;
  • #endif
  • #extension GL_OES_standard_derivatives : enable
  • uniform float time;
  • uniform vec2 mouse;
  • vec2 resolution = vec2(1.0,1.0);
  • varying vec2 vUv;
  • floatsnow(vec2 uv,float scale)
  • {
  • float _t = time * 0.35;
  • uv.x+=_t/scale;
  • uv*=scale;vec2 s=floor(uv),f=fract(uv),p;float k=0.5,d;
  • p=.5+.35*sin(11.*fract(sin((s+p+scale)*mat2(7,3,6,5))*5.))-f;d=length(p);k=min(d,k);
  • k=smoothstep(0.0008,k,sin(f.x+f.y)*0.003);
  • return k;
  • }
  • voidmain(void){
  • vec2 uv = (vUv -0.5) * 2.0 ;
  • float dd = 1.0-length(uv);
  • uv.x += sin(time*0.48);
  • uv.y += sin(uv.x*-1.4)*0.2;
  • uv.x *= 0.09;
  • float c=snow(uv,30.)*.3;
  • c+=snow(uv,25.)*.5;
  • c+=snow(uv,35.)*.8;
  • c+=snow(uv,10.);
  • c+=snow(uv,20.);
  • c+=snow(uv,8.);
  • c+=snow(uv,10.);
  • c*=0.2/dd;
  • vec3 finalColor=(vec3(1,0.5,3.2))*c*100.0;
  • gl_FragColor = vec4(finalColor,1.);
  • }
  • `
  • const vertexShader = `
  • attribute vec3 position: POSITION;
  • uniform mat4 worldViewProjection : WORLDVIEWPROJECTION;
  • attribute vec2 uv : TEXCOORD_0;

Arcgis 与 Claygl 可视化 glsl 特效篇(三十七) - 小专栏

标签:glsl,claygl,float,uv,snow,Claygl,Arcgis,vec2,sin
From: https://www.cnblogs.com/haibalai/p/17349665.html

相关文章

  • ArcGIS切片服务获取切片方案xml文件(conf.xml)
    在使用ArcGIS进行影像、地形等切片时,往往需要保持一致的切片方案才能够更好的加载地图服务。本文介绍如何获取已经发布好的ArcGIS服务的切片方案xml文件。当然切片xml文件还可以通过工具GenerateTileCacheTilingScheme生成,具体操作可参考相关文档,本文不做说明。示例服务地......
  • ArcGIS API for JavaScript 4.x加载GeoServer发布的WMTS服务
    前言 以前用OpenLayers加载GeoServer我记得很简单,现在用ArcGISAPI加载捣鼓了一天没搞好,第二天早上来参考一篇文章搞好了,我这纯属记录下。背景 客户没有ArcGISServer的许可,所以就只能用GeoServer发布或者离线切片,先研究下GeoServer,后面如果心情好再研究下离线切片。......
  • ArcGIS Pro发布地图服务(影像、矢量)
    做GIS一般都是用ArcMap发布影像或者矢量服务,由于ArcGIS后续不在更新ArcMap,改用ArcGISPro,本文对ArcGISPro发布服务进行说明。本文示例使用(因为portal的授权的版本只有10.5的,故使用10.5进行示例):软件:ArcGISPro3.0.1(破解版),    ArcGISPortal10.5当ArcGISPro和Portal......
  • Arcgis中创建要素时绘制XY轴的矩形
    本章记录一个在绘制要素时能够平行于XY轴绘制一个“正矩形”的方法。1.在选定线段起始点后,将鼠标移动至需要的Y轴大概位置,右键,点击“增量X,Y”  2.设置X=0,Y增量不变,即得到平行于Y轴的矩形边 重复该操作即可得到矩形,也可以在第一步完成后按TAB唤出要素构造菜单,选择追踪-直......
  • ArcGIS Portal/Server局域网域名访问问题
    安装好arcgisportal后,假设:门户url:https://esrichina.arcgiscloud.com/arcgis/home/ip:10.0.3.159则需要修改host进行域名访问,找到C:\Windows\System32\drivers\etc下的HOSTS文件,打开HOSTS文件在文件最下面新加一行:10.0.3.159esrichina.arcgiscloud.com由于Windows的自我保护设置......
  • Arcgis 与 Claygl 可视化 glsl 特效篇(十八)
    我决定不从claygl基础来讲了直接整合arcgis与claygl可视化来讲关于整合clagyl有兴趣看我这篇文章arcgis与claygl引擎结合做地图可视化我整合一个类库后续不断更新中npmi@haibalai/gismap4-claygl 初始化gismap4-claygl类库,view是arcgis的sceneView对象import......
  • Arcgis 与 Claygl 可视化 glsl 特效篇(二十四)
    我决定不从claygl基础来讲了直接整合arcgis与claygl可视化来讲关于整合clagyl有兴趣看我这篇文章arcgis与claygl引擎结合做地图可视化我整合一个类库后续不断更新中npmi@haibalai/gismap4-claygl 初始化gismap4-claygl类库,view是arcgis的sceneView对象import......
  • Arcgis 与 Claygl 可视化 glsl 特效篇(二十三)
    我决定不从claygl基础来讲了直接整合arcgis与claygl可视化来讲关于整合clagyl有兴趣看我这篇文章arcgis与claygl引擎结合做地图可视化我整合一个类库后续不断更新中npmi@haibalai/gismap4-claygl 初始化gismap4-claygl类库,view是arcgis的sceneView对象import......
  • Arcgis 与 Claygl 可视化 glsl 特效篇(二十二)
    我决定不从claygl基础来讲了直接整合arcgis与claygl可视化来讲关于整合clagyl有兴趣看我这篇文章arcgis与claygl引擎结合做地图可视化我整合一个类库后续不断更新中npmi@haibalai/gismap4-claygl 初始化gismap4-claygl类库,view是arcgis的sceneView对象import......
  • Arcgis 与 Claygl 可视化 glsl 特效篇(二十五)
    我决定不从claygl基础来讲了直接整合arcgis与claygl可视化来讲关于整合clagyl有兴趣看我这篇文章arcgis与claygl引擎结合做地图可视化我整合一个类库后续不断更新中npmi@haibalai/gismap4-claygl 初始化gismap4-claygl类库,view是arcgis的sceneView对象import......