我决定不从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 = `
- uniform float iTime;
- const vec2 iResolution = vec2(1.0,1.0);
- varying vec2 vUv;
- floatsdSphere(vec3 pos, float size)
- {
- return length(pos) - size;
- }
- floatsdBox(vec3 pos, vec3 size)
- {
- pos = abs(pos) - vec3(size);
- return max(max(pos.x, pos.y), pos.z);
- }
- floatsdOctahedron(vec3 p, float s)
- {
- p = abs(p);
- float m = p.x+p.y+p.z-s;
- vec3 q;
- if( 3.0*p.x < m ) q = p.xyz;
- elseif( 3.0*p.y < m ) q = p.yzx;
- elseif( 3.0*p.z < m ) q = p.zxy;
- elsereturn m*0.57735027;
- float k = clamp(0.5*(q.z-q.y+s),0.0,s);
- return length(vec3(q.x,q.y-s+k,q.z-k));
- }
- floatsdPlane(vec3 pos)
- {
- return pos.y;
- }
- mat2 rotate(float a)
- {
- float s = sin(a);
- float c = cos(a);
- return mat2(c, s, -s, c);
- }
- vec3 repeat(vec3 pos, vec3 span)
- {
- return abs(mod(pos, span)) - span * 0.5;