@antv/l7-layers 2.9.32-alpha.3 → 2.9.32-alpha.4

package/es/wind/models/windRender.js

@@ -0,0 +1,357 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import * as glUtils from "./utils";
+import { drawFrag, drawVert, fullScreenFrag, fullScreenVert, updateFrag, updateVert } from "./windShader";
+
+function getColorRamp(colors) {
+  var canvas = document.createElement('canvas');
+  var ctx = canvas.getContext('2d');
+  canvas.width = 256;
+  canvas.height = 1;
+  var gradient = ctx.createLinearGradient(0, 0, 256, 0);
+
+  for (var _i = 0, _Object$keys = Object.keys(colors); _i < _Object$keys.length; _i++) {
+    var stop = _Object$keys[_i];
+    gradient.addColorStop(+stop, colors[+stop]);
+  }
+
+  ctx.fillStyle = gradient;
+  ctx.fillRect(0, 0, 256, 1); // @ts-ignore dispose canvas element
+
+  canvas = null;
+  return new Uint8Array(ctx.getImageData(0, 0, 256, 1).data);
+}
+
+function bindAttribute(gl, buffer, attribute, numComponents) {
+  gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
+  gl.enableVertexAttribArray(attribute);
+  gl.vertexAttribPointer(attribute, numComponents, gl.FLOAT, false, 0, 0);
+}
+
+function bindFramebuffer(gl, framebuffer, texture) {
+  gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
+
+  if (texture) {
+    gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, texture, 0);
+  }
+}
+
+export var Wind = /*#__PURE__*/function () {
+  function Wind(options) {
+    _classCallCheck(this, Wind);
+
+    _defineProperty(this, "width", 512);
+
+    _defineProperty(this, "height", 512);
+
+    _defineProperty(this, "numParticles", 65536);
+
+    this.gl = options.glContext;
+    this.width = options.imageWidth;
+    this.height = options.imageHeight;
+    this.fadeOpacity = options.fadeOpacity;
+    this.speedFactor = options.speedFactor;
+    this.dropRate = options.dropRate;
+    this.dropRateBump = options.dropRateBump;
+    this.rampColors = options.rampColors;
+    this.init();
+  }
+
+  _createClass(Wind, [{
+    key: "init",
+    value: function init() {
+      var gl = this.gl;
+      this.fadeOpacity = 0.996; // how fast the particle trails fade on each frame
+
+      this.speedFactor = 0.25; // how fast the particles move
+
+      this.dropRate = 0.003; // how often the particles move to a random place
+
+      this.dropRateBump = 0.01; // drop rate increase relative to individual particle speed
+
+      this.drawProgram = glUtils.createProgram(gl, drawVert, drawFrag);
+      this.fullScreenProgram = glUtils.createProgram(gl, fullScreenVert, fullScreenFrag);
+      this.updateProgram = glUtils.createProgram(gl, updateVert, updateFrag);
+      this.quadBuffer = glUtils.createBuffer(gl, new Float32Array([0, 0, 1, 0, 0, 1, 0, 1, 1, 0, 1, 1]));
+      this.framebuffer = gl.createFramebuffer();
+      this.colorRampTexture = glUtils.createTexture(this.gl, this.gl.LINEAR, getColorRamp(this.rampColors), 16, 16);
+      var emptyPixels = new Uint8Array(this.width * this.height * 4); // screen textures to hold the drawn screen for the previous and the current frame
+
+      this.backgroundTexture = glUtils.createTexture(gl, gl.NEAREST, emptyPixels, this.width, this.height);
+      this.screenTexture = glUtils.createTexture(gl, gl.NEAREST, emptyPixels, this.width, this.height); // we create a square texture where each pixel will hold a particle position encoded as RGBA
+
+      var particleRes = this.particleStateResolution = Math.ceil(Math.sqrt(this.numParticles)); // particleRes size
+
+      this.numParticlesSize = particleRes * particleRes;
+      var particleState = new Uint8Array(this.numParticlesSize * 4);
+
+      for (var i = 0; i < particleState.length; i++) {
+        particleState[i] = Math.floor(Math.random() * 256); // randomize the initial particle positions
+      } // textures to hold the particle state for the current and the next frame
+
+
+      this.particleStateTexture0 = glUtils.createTexture(gl, gl.NEAREST, particleState, particleRes, particleRes);
+      this.particleStateTexture1 = glUtils.createTexture(gl, gl.NEAREST, particleState, particleRes, particleRes);
+      var particleIndices = new Float32Array(this.numParticlesSize);
+
+      for (var i$1 = 0; i$1 < this.numParticlesSize; i$1++) {
+        particleIndices[i$1] = i$1;
+      }
+
+      this.particleIndexBuffer = glUtils.createBuffer(gl, particleIndices);
+    }
+  }, {
+    key: "setWind",
+    value: function setWind(windData) {
+      this.windData = windData;
+      this.windTexture = glUtils.createDataTexture(this.gl, this.gl.LINEAR, windData.image);
+    }
+    /**
+     * 更新风场粒子数量
+     * @param num
+     */
+
+  }, {
+    key: "updateParticelNum",
+    value: function updateParticelNum(num) {
+      var gl = this.gl;
+
+      if (num !== this.numParticles) {
+        this.numParticles = num; // params number
+        // we create a square texture where each pixel will hold a particle position encoded as RGBA
+
+        var particleRes = this.particleStateResolution = Math.ceil(Math.sqrt(this.numParticles));
+        this.numParticlesSize = particleRes * particleRes;
+        var particleState = new Uint8Array(this.numParticlesSize * 4);
+
+        for (var i = 0; i < particleState.length; i++) {
+          particleState[i] = Math.floor(Math.random() * 256); // randomize the initial particle positions
+        } // textures to hold the particle state for the current and the next frame
+
+
+        this.particleStateTexture0 = glUtils.createTexture(gl, gl.NEAREST, particleState, particleRes, particleRes);
+        this.particleStateTexture1 = glUtils.createTexture(gl, gl.NEAREST, particleState, particleRes, particleRes);
+        var particleIndices = new Float32Array(this.numParticlesSize);
+
+        for (var i$1 = 0; i$1 < this.numParticlesSize; i$1++) {
+          particleIndices[i$1] = i$1;
+        }
+
+        this.particleIndexBuffer = glUtils.createBuffer(gl, particleIndices);
+      }
+    }
+    /**
+     * 更新风场风向风速
+     * @param uMin
+     * @param uMax
+     * @param vMin
+     * @param vMax
+     */
+
+  }, {
+    key: "updateWindDir",
+    value: function updateWindDir(uMin, uMax, vMin, vMax) {
+      this.windData.uMin = uMin;
+      this.windData.uMax = uMax;
+      this.windData.vMin = vMin;
+      this.windData.vMax = vMax;
+    }
+    /**
+     * update rampColors
+     * @param rampColors
+     */
+
+  }, {
+    key: "updateColorRampTexture",
+    value: function updateColorRampTexture(rampColors) {
+      if (this.isColorChanged(rampColors)) {
+        this.rampColors = rampColors;
+        var gl = this.gl;
+        gl.deleteTexture(this.colorRampTexture);
+        this.colorRampTexture = glUtils.createTexture(gl, gl.LINEAR, getColorRamp(rampColors), 16, 16);
+      }
+    }
+  }, {
+    key: "isColorChanged",
+    value: function isColorChanged(rampColors) {
+      var keys = Object.keys(rampColors);
+
+      for (var _i2 = 0, _keys = keys; _i2 < _keys.length; _i2++) {
+        var item = _keys[_i2];
+
+        var _key = Number(item); // exist new key -> color need update
+
+
+        if (!this.rampColors[_key]) {
+          return true;
+        } // value changed -> color need update
+
+
+        if (this.rampColors[_key] && this.rampColors[_key] !== rampColors[_key]) {
+          return true;
+        }
+      }
+
+      return false;
+    }
+  }, {
+    key: "reSize",
+    value: function reSize(width, height) {
+      if (width !== this.width || height !== this.height) {
+        var gl = this.gl;
+        gl.deleteTexture(this.backgroundTexture);
+        gl.deleteTexture(this.screenTexture);
+        this.width = width;
+        this.height = height;
+        var emptyPixels = new Uint8Array(width * height * 4); // screen textures to hold the drawn screen for the previous and the current frame
+
+        this.backgroundTexture = glUtils.createTexture(gl, gl.NEAREST, emptyPixels, width, height);
+        this.screenTexture = glUtils.createTexture(gl, gl.NEAREST, emptyPixels, width, height);
+      }
+    }
+  }, {
+    key: "draw",
+    value: function draw() {
+      var _this$windData;
+
+      if ((_this$windData = this.windData) !== null && _this$windData !== void 0 && _this$windData.image) {
+        var gl = this.gl;
+        glUtils.bindTexture(gl, this.windTexture, 0);
+        glUtils.bindTexture(gl, this.particleStateTexture0, 1);
+        this.drawScreen(); // draw Particles into framebuffer
+
+        this.updateParticles();
+        return {
+          d: this.pixels,
+          w: this.width,
+          h: this.height
+        };
+      } else {
+        return {
+          d: new Uint8Array([0, 0, 0, 0]),
+          w: 1,
+          h: 1
+        };
+      }
+    }
+  }, {
+    key: "drawScreen",
+    value: function drawScreen() {
+      var gl = this.gl; // draw the screen into a temporary framebuffer to retain it as the background on the next frame
+
+      bindFramebuffer(gl, this.framebuffer, this.screenTexture);
+      gl.viewport(0, 0, this.width, this.height);
+      gl.disable(gl.BLEND);
+      this.drawFullTexture(this.backgroundTexture, this.fadeOpacity);
+      this.drawParticles();
+      this.pixels = new Uint8Array(4 * this.width * this.height);
+      gl.readPixels(0, 0, this.width, this.height, gl.RGBA, gl.UNSIGNED_BYTE, this.pixels);
+      bindFramebuffer(gl, null, null);
+      gl.viewport(0, 0, this.gl.canvas.width, this.gl.canvas.height); //   save the current screen as the background for the next frame
+
+      var temp = this.backgroundTexture;
+      this.backgroundTexture = this.screenTexture;
+      this.screenTexture = temp;
+    }
+  }, {
+    key: "drawFullTexture",
+    value: function drawFullTexture(texture, opacity) {
+      var gl = this.gl;
+      var program = this.fullScreenProgram;
+      gl.useProgram(program); // bindAttribute(gl, this.quadBuffer, program.a_pos, 2);
+
+      gl.bindBuffer(gl.ARRAY_BUFFER, this.quadBuffer);
+      gl.vertexAttribPointer(program.a_pos, 2, gl.FLOAT, false, 0, 0);
+      gl.enableVertexAttribArray(program.a_pos);
+      gl.bindBuffer(gl.ARRAY_BUFFER, null);
+      glUtils.bindTexture(gl, texture, 2);
+      gl.uniform1i(program.u_screen, 2);
+      gl.uniform1f(program.u_opacity, opacity);
+      gl.drawArrays(gl.TRIANGLES, 0, 6); // gl.drawArrays(gl.POINTS, 0, 6);
+    }
+  }, {
+    key: "drawParticles",
+    value: function drawParticles() {
+      var gl = this.gl;
+      var program = this.drawProgram;
+      gl.useProgram(program);
+      bindAttribute(gl, this.particleIndexBuffer, program.a_index, 1);
+      glUtils.bindTexture(gl, this.colorRampTexture, 2);
+      gl.uniform1i(program.u_wind, 0);
+      gl.uniform1i(program.u_particles, 1);
+      gl.uniform1i(program.u_color_ramp, 2);
+      gl.uniform1f(program.u_particles_res, this.particleStateResolution);
+      gl.uniform2f(program.u_wind_min, this.windData.uMin, this.windData.vMin);
+      gl.uniform2f(program.u_wind_max, this.windData.uMax, this.windData.vMax);
+      gl.drawArrays(gl.POINTS, 0, this.numParticlesSize);
+    }
+  }, {
+    key: "updateParticles",
+    value: function updateParticles() {
+      var gl = this.gl;
+      bindFramebuffer(gl, this.framebuffer, this.particleStateTexture1);
+      gl.viewport(0, 0, this.particleStateResolution, this.particleStateResolution);
+      var program = this.updateProgram;
+      gl.useProgram(program);
+      bindAttribute(gl, this.quadBuffer, program.a_pos, 2);
+      gl.uniform1i(program.u_wind, 0);
+      gl.uniform1i(program.u_particles, 1);
+      gl.uniform1f(program.u_rand_seed, Math.random());
+      gl.uniform2f(program.u_wind_res, this.windData.image.width * 2, this.windData.image.height * 2);
+      gl.uniform2f(program.u_wind_min, this.windData.uMin, this.windData.vMin);
+      gl.uniform2f(program.u_wind_max, this.windData.uMax, this.windData.vMax);
+      gl.uniform1f(program.u_speed_factor, this.speedFactor);
+      gl.uniform1f(program.u_drop_rate, this.dropRate);
+      gl.uniform1f(program.u_drop_rate_bump, this.dropRateBump);
+      gl.drawArrays(gl.TRIANGLES, 0, 6); // swap the particle state textures so the new one becomes the current one
+
+      var temp = this.particleStateTexture0;
+      this.particleStateTexture0 = this.particleStateTexture1;
+      this.particleStateTexture1 = temp;
+      bindFramebuffer(gl, null, null); // gl.viewport(0, 0, this.gl.canvas.width, this.gl.canvas.height);
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // private drawProgram: WebGLProgram;
+      // private fullScreenProgram: WebGLProgram;
+      // private updateProgram: WebGLProgram;
+      // private quadBuffer: WebGLBuffer | null;
+      // private particleIndexBuffer: WebGLBuffer | null;
+      // private framebuffer: WebGLFramebuffer | null;
+      // private colorRampTexture: WebGLTexture | null;
+      // private backgroundTexture: WebGLTexture | null;
+      // private screenTexture: WebGLTexture | null;
+      // private particleStateTexture0: WebGLTexture | null;
+      // private particleStateTexture1: WebGLTexture | null;
+      // private windTexture: WebGLTexture | null;
+      this.gl.deleteBuffer(this.quadBuffer);
+      this.gl.deleteBuffer(this.particleIndexBuffer);
+      this.gl.deleteFramebuffer(this.framebuffer); // @ts-ignore
+
+      this.gl.deleteShader(this.drawProgram.vertexShader); // @ts-ignore
+
+      this.gl.deleteShader(this.drawProgram.fragmentShader);
+      this.gl.deleteProgram(this.drawProgram); // @ts-ignore
+
+      this.gl.deleteShader(this.fullScreenProgram.vertexShader); // @ts-ignore
+
+      this.gl.deleteShader(this.fullScreenProgram.fragmentShader);
+      this.gl.deleteProgram(this.fullScreenProgram); // @ts-ignore
+
+      this.gl.deleteShader(this.updateProgram.vertexShader); // @ts-ignore
+
+      this.gl.deleteShader(this.updateProgram.fragmentShader);
+      this.gl.deleteProgram(this.updateProgram);
+      this.gl.deleteTexture(this.colorRampTexture);
+      this.gl.deleteTexture(this.backgroundTexture);
+      this.gl.deleteTexture(this.screenTexture);
+      this.gl.deleteTexture(this.particleStateTexture0);
+      this.gl.deleteTexture(this.particleStateTexture1);
+      this.gl.deleteTexture(this.windTexture);
+    }
+  }]);
+
+  return Wind;
+}();

package/es/wind/models/windShader.d.ts

@@ -0,0 +1,12 @@
+/**
+ * drawProgram          drawVert drawFrag
+ * screenProgram        screenVert screenFrag
+ * updateProgram        updateVert updateFrag
+ * fullScreenProgram    fullScreenVert fullScreenFrag
+ */
+export declare const drawVert = "\n precision mediump float;\n\n attribute float a_index;\n\n uniform sampler2D u_particles;\n uniform float u_particles_res;\n\n varying vec2 v_particle_pos;\n\n void main() {\n     vec4 color = texture2D(u_particles, vec2(\n         fract(a_index / u_particles_res),\n         floor(a_index / u_particles_res) / u_particles_res)\n     );\n\n     // decode current particle position from the pixel's RGBA value\n     v_particle_pos = vec2( color.r / 255.0 + color.b, color.g / 255.0 + color.a);\n\n     gl_PointSize = 1.0;\n     gl_Position = vec4(2.0 * v_particle_pos.x - 1.0, 1.0 - 2.0 * v_particle_pos.y, 0, 1);\n }";
+export declare const drawFrag = "\n precision mediump float;\n\n uniform sampler2D u_wind;\n uniform vec2 u_wind_min;\n uniform vec2 u_wind_max;\n uniform sampler2D u_color_ramp;\n\n varying vec2 v_particle_pos;\n\n void main() {\n     vec2 velocity = mix(u_wind_min, u_wind_max, texture2D(u_wind, v_particle_pos).rg);\n     float speed_t = length(velocity) / length(u_wind_max);\n\n     // color ramp is encoded in a 16x16 texture\n     vec2 ramp_pos = vec2( fract(16.0 * speed_t), floor(16.0 * speed_t) / 16.0);\n\n     gl_FragColor = texture2D(u_color_ramp, ramp_pos);\n }";
+export declare const updateVert = "\n precision mediump float;\n\n attribute vec2 a_pos;\n\n varying vec2 v_tex_pos;\n\n void main() {\n     v_tex_pos = a_pos;\n     gl_Position = vec4(1.0 - 2.0 * a_pos, 0, 1);\n     // framebuffer \u59CB\u7EC8\u7528\u94FA\u6EE1\u5C4F\u5E55\u7684 texture\n }";
+export declare const updateFrag = "\n precision highp float;\n\n uniform sampler2D u_particles;\n uniform sampler2D u_wind;\n uniform vec2 u_wind_res;\n uniform vec2 u_wind_min;\n uniform vec2 u_wind_max;\n uniform float u_rand_seed;\n uniform float u_speed_factor;\n uniform float u_drop_rate;\n uniform float u_drop_rate_bump;\n\n varying vec2 v_tex_pos;\n\n // pseudo-random generator\n const vec3 rand_constants = vec3(12.9898, 78.233, 4375.85453);\n float rand(const vec2 co) {\n float t = dot(rand_constants.xy, co);\n     return fract(sin(t) * (rand_constants.z + t));\n }\n\n // wind speed lookup; use manual bilinear filtering based on 4 adjacent pixels for smooth interpolation\n vec2 lookup_wind(const vec2 uv) {\n     // return texture2D(u_wind, uv).rg; // lower-res hardware filtering\n     vec2 px = 1.0 / u_wind_res;\n     vec2 vc = (floor(uv * u_wind_res)) * px;\n     vec2 f = fract(uv * u_wind_res);\n     vec2 tl = texture2D(u_wind, vc).rg;\n     vec2 tr = texture2D(u_wind, vc + vec2(px.x, 0)).rg;\n     vec2 bl = texture2D(u_wind, vc + vec2(0, px.y)).rg;\n     vec2 br = texture2D(u_wind, vc + px).rg;\n     return mix(mix(tl, tr, f.x), mix(bl, br, f.x), f.y);\n }\n\n void main() {\n     vec4 color = texture2D(u_particles, v_tex_pos);\n     vec2 pos = vec2(\n         color.r / 255.0 + color.b,\n         color.g / 255.0 + color.a); // decode particle position from pixel RGBA\n     vec2 velocity = mix(u_wind_min, u_wind_max, lookup_wind(pos));\n     float speed_t = length(velocity) / length(u_wind_max);\n\n     // take EPSG:4236 distortion into account for calculating where the particle moved\n     float distortion = cos(radians(pos.y * 180.0 - 90.0));\n     vec2 offset = vec2(velocity.x / distortion, -velocity.y) * 0.0001 * u_speed_factor;\n\n     // update particle position, wrapping around the date line\n     pos = fract(1.0 + pos + offset);\n\n     // a random seed to use for the particle drop\n     vec2 seed = (pos + v_tex_pos) * u_rand_seed;\n\n     // drop rate is a chance a particle will restart at random position, to avoid degeneration\n     float drop_rate = u_drop_rate + speed_t * u_drop_rate_bump;\n     float drop = step(1.0 - drop_rate, rand(seed));\n\n     vec2 random_pos = vec2(\n         rand(seed + 1.3),\n         rand(seed + 2.1));\n         pos = mix(pos, random_pos, drop);\n\n     // encode the new particle position back into RGBA\n     gl_FragColor = vec4(\n         fract(pos * 255.0),\n         floor(pos * 255.0) / 255.0);\n }";
+export declare const fullScreenVert = "\n     precision mediump float;\n\n     attribute vec2 a_pos;\n\n     varying vec2 v_tex_pos;\n\n     void main() {\n         v_tex_pos = a_pos;\n         gl_Position = vec4(1.0 - 2.0 * a_pos, 0.0, 1.0);\n         gl_PointSize = 100.0;\n }";
+export declare const fullScreenFrag = "\n precision mediump float;\n\n uniform sampler2D u_screen;\n uniform float u_opacity;\n varying vec2 v_tex_pos;\n\n void main() {\n     vec4 color = texture2D(u_screen, 1.0 - v_tex_pos);\n\n     // a hack to guarantee opacity fade out even with a value close to 1.0\n     gl_FragColor = vec4(floor(255.0 * color * u_opacity) / 255.0);\n }";

package/es/wind/models/windShader.js

@@ -0,0 +1,12 @@
+/**
+ * drawProgram          drawVert drawFrag
+ * screenProgram        screenVert screenFrag
+ * updateProgram        updateVert updateFrag
+ * fullScreenProgram    fullScreenVert fullScreenFrag
+ */
+export var drawVert = "\n precision mediump float;\n\n attribute float a_index;\n\n uniform sampler2D u_particles;\n uniform float u_particles_res;\n\n varying vec2 v_particle_pos;\n\n void main() {\n     vec4 color = texture2D(u_particles, vec2(\n         fract(a_index / u_particles_res),\n         floor(a_index / u_particles_res) / u_particles_res)\n     );\n\n     // decode current particle position from the pixel's RGBA value\n     v_particle_pos = vec2( color.r / 255.0 + color.b, color.g / 255.0 + color.a);\n\n     gl_PointSize = 1.0;\n     gl_Position = vec4(2.0 * v_particle_pos.x - 1.0, 1.0 - 2.0 * v_particle_pos.y, 0, 1);\n }";
+export var drawFrag = "\n precision mediump float;\n\n uniform sampler2D u_wind;\n uniform vec2 u_wind_min;\n uniform vec2 u_wind_max;\n uniform sampler2D u_color_ramp;\n\n varying vec2 v_particle_pos;\n\n void main() {\n     vec2 velocity = mix(u_wind_min, u_wind_max, texture2D(u_wind, v_particle_pos).rg);\n     float speed_t = length(velocity) / length(u_wind_max);\n\n     // color ramp is encoded in a 16x16 texture\n     vec2 ramp_pos = vec2( fract(16.0 * speed_t), floor(16.0 * speed_t) / 16.0);\n\n     gl_FragColor = texture2D(u_color_ramp, ramp_pos);\n }";
+export var updateVert = "\n precision mediump float;\n\n attribute vec2 a_pos;\n\n varying vec2 v_tex_pos;\n\n void main() {\n     v_tex_pos = a_pos;\n     gl_Position = vec4(1.0 - 2.0 * a_pos, 0, 1);\n     // framebuffer \u59CB\u7EC8\u7528\u94FA\u6EE1\u5C4F\u5E55\u7684 texture\n }";
+export var updateFrag = "\n precision highp float;\n\n uniform sampler2D u_particles;\n uniform sampler2D u_wind;\n uniform vec2 u_wind_res;\n uniform vec2 u_wind_min;\n uniform vec2 u_wind_max;\n uniform float u_rand_seed;\n uniform float u_speed_factor;\n uniform float u_drop_rate;\n uniform float u_drop_rate_bump;\n\n varying vec2 v_tex_pos;\n\n // pseudo-random generator\n const vec3 rand_constants = vec3(12.9898, 78.233, 4375.85453);\n float rand(const vec2 co) {\n float t = dot(rand_constants.xy, co);\n     return fract(sin(t) * (rand_constants.z + t));\n }\n\n // wind speed lookup; use manual bilinear filtering based on 4 adjacent pixels for smooth interpolation\n vec2 lookup_wind(const vec2 uv) {\n     // return texture2D(u_wind, uv).rg; // lower-res hardware filtering\n     vec2 px = 1.0 / u_wind_res;\n     vec2 vc = (floor(uv * u_wind_res)) * px;\n     vec2 f = fract(uv * u_wind_res);\n     vec2 tl = texture2D(u_wind, vc).rg;\n     vec2 tr = texture2D(u_wind, vc + vec2(px.x, 0)).rg;\n     vec2 bl = texture2D(u_wind, vc + vec2(0, px.y)).rg;\n     vec2 br = texture2D(u_wind, vc + px).rg;\n     return mix(mix(tl, tr, f.x), mix(bl, br, f.x), f.y);\n }\n\n void main() {\n     vec4 color = texture2D(u_particles, v_tex_pos);\n     vec2 pos = vec2(\n         color.r / 255.0 + color.b,\n         color.g / 255.0 + color.a); // decode particle position from pixel RGBA\n     vec2 velocity = mix(u_wind_min, u_wind_max, lookup_wind(pos));\n     float speed_t = length(velocity) / length(u_wind_max);\n\n     // take EPSG:4236 distortion into account for calculating where the particle moved\n     float distortion = cos(radians(pos.y * 180.0 - 90.0));\n     vec2 offset = vec2(velocity.x / distortion, -velocity.y) * 0.0001 * u_speed_factor;\n\n     // update particle position, wrapping around the date line\n     pos = fract(1.0 + pos + offset);\n\n     // a random seed to use for the particle drop\n     vec2 seed = (pos + v_tex_pos) * u_rand_seed;\n\n     // drop rate is a chance a particle will restart at random position, to avoid degeneration\n     float drop_rate = u_drop_rate + speed_t * u_drop_rate_bump;\n     float drop = step(1.0 - drop_rate, rand(seed));\n\n     vec2 random_pos = vec2(\n         rand(seed + 1.3),\n         rand(seed + 2.1));\n         pos = mix(pos, random_pos, drop);\n\n     // encode the new particle position back into RGBA\n     gl_FragColor = vec4(\n         fract(pos * 255.0),\n         floor(pos * 255.0) / 255.0);\n }";
+export var fullScreenVert = "\n     precision mediump float;\n\n     attribute vec2 a_pos;\n\n     varying vec2 v_tex_pos;\n\n     void main() {\n         v_tex_pos = a_pos;\n         gl_Position = vec4(1.0 - 2.0 * a_pos, 0.0, 1.0);\n         gl_PointSize = 100.0;\n }";
+export var fullScreenFrag = "\n precision mediump float;\n\n uniform sampler2D u_screen;\n uniform float u_opacity;\n varying vec2 v_tex_pos;\n\n void main() {\n     vec4 color = texture2D(u_screen, 1.0 - v_tex_pos);\n\n     // a hack to guarantee opacity fade out even with a value close to 1.0\n     gl_FragColor = vec4(floor(255.0 * color * u_opacity) / 255.0);\n }";

package/es/wind/shaders/wind_frag.glsl

@@ -0,0 +1,9 @@
+precision mediump float;
+uniform float u_opacity: 1.0;
+uniform sampler2D u_texture;
+varying vec2 v_texCoord;
+void main() {
+  vec4 color = texture2D(u_texture,vec2(v_texCoord.x,v_texCoord.y));
+  gl_FragColor = color;
+  gl_FragColor.a *= u_opacity;
+}

package/es/wind/shaders/wind_vert.glsl

@@ -0,0 +1,17 @@
+precision highp float;
+uniform mat4 u_ModelMatrix;
+uniform mat4 u_Mvp;
+attribute vec3 a_Position;
+attribute vec2 a_Uv;
+varying vec2 v_texCoord;
+#pragma include "projection"
+void main() {
+   v_texCoord = a_Uv;
+   vec4 project_pos = project_position(vec4(a_Position, 1.0));
+   
+   if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x
+      gl_Position = u_Mvp * (vec4(project_pos.xy,0., 1.0));
+   } else {
+      gl_Position = project_common_position_to_clipspace(vec4(project_pos.xy,0., 1.0));
+   }
+}

package/lib/Geometry/index.js

@@ -0,0 +1,130 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _BaseLayer2 = _interopRequireDefault(require("../core/BaseLayer"));
+
+var _models = _interopRequireDefault(require("./models"));
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+var GeometryLayer = /*#__PURE__*/function (_BaseLayer) {
+  (0, _inherits2.default)(GeometryLayer, _BaseLayer);
+
+  var _super = _createSuper(GeometryLayer);
+
+  function GeometryLayer() {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, GeometryLayer);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _super.call.apply(_super, [this].concat(args));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "type", 'GeometryLayer');
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "defaultSourceConfig", {
+      data: [{
+        x: 0,
+        y: 0
+      }],
+      options: {
+        parser: {
+          type: 'json',
+          x: 'x',
+          y: 'y'
+        }
+      }
+    });
+    return _this;
+  }
+
+  (0, _createClass2.default)(GeometryLayer, [{
+    key: "buildModels",
+    value: function buildModels() {
+      var _this2 = this;
+
+      var modelType = this.getModelType();
+      this.layerModel = new _models.default[modelType](this);
+      this.layerModel.initModels(function (models) {
+        _this2.dispatchModelLoad(models);
+      });
+    }
+  }, {
+    key: "rebuildModels",
+    value: function rebuildModels() {
+      var _this3 = this;
+
+      this.layerModel.buildModels(function (models) {
+        _this3.dispatchModelLoad(models);
+      });
+    }
+  }, {
+    key: "getConfigSchema",
+    value: function getConfigSchema() {
+      return {
+        properties: {
+          opacity: {
+            type: 'number',
+            minimum: 0,
+            maximum: 1
+          }
+        }
+      };
+    }
+  }, {
+    key: "getDefaultConfig",
+    value: function getDefaultConfig() {
+      var type = this.getModelType();
+      var defaultConfig = {
+        plane: {},
+        sprite: {},
+        billboard: {}
+      };
+      return defaultConfig[type];
+    }
+  }, {
+    key: "getModelType",
+    value: function getModelType() {
+      var _shapeAttribute$scale;
+
+      var shapeAttribute = this.styleAttributeService.getLayerStyleAttribute('shape');
+      var shape = shapeAttribute === null || shapeAttribute === void 0 ? void 0 : (_shapeAttribute$scale = shapeAttribute.scale) === null || _shapeAttribute$scale === void 0 ? void 0 : _shapeAttribute$scale.field;
+
+      if (shape === 'plane') {
+        return 'plane';
+      } else if (shape === 'sprite') {
+        return 'sprite';
+      } else if (shape === 'billboard') {
+        return 'billboard';
+      } else {
+        return 'plane';
+      }
+    }
+  }]);
+  return GeometryLayer;
+}(_BaseLayer2.default);
+
+exports.default = GeometryLayer;