@antv/l7-layers 2.8.3 → 2.8.6

package/es/polygon/models/ocean.js

@@ -0,0 +1,238 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _isNumber from "lodash/isNumber";
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(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; } }
+
+import { AttributeType, gl } from '@antv/l7-core';
+import { getMask, rgb2arr } from '@antv/l7-utils';
+import BaseModel from '../../core/BaseModel';
+import { polygonTriangulation } from '../../core/triangulation';
+var ocean_frag = "\nuniform float u_time;\nuniform float u_opacity: 1.0;\n\nvarying vec4 v_Color;\nvarying vec2 v_uv;\nvarying mat4 styleMappingMat; // \u4F20\u9012\u4ECE\u7247\u5143\u4E2D\u4F20\u9012\u7684\u6620\u5C04\u6570\u636E\n\n#pragma include \"picking\"\n\nfloat coast2water_fadedepth = 0.10;\nfloat large_waveheight      = .750; // change to adjust the \"heavy\" waves\nfloat large_wavesize        = 3.4;  // factor to adjust the large wave size\nfloat small_waveheight      = 0.6;  // change to adjust the small random waves\nfloat small_wavesize        = 0.5;   // factor to ajust the small wave size\nfloat water_softlight_fact  = 15.;  // range [1..200] (should be << smaller than glossy-fact)\nfloat water_glossylight_fact= 120.; // range [1..200]\nfloat particle_amount       = 70.;\n// vec3 watercolor             = vec3(0.43, 0.60, 0.66); // 'transparent' low-water color (RGB)\n// vec3 watercolor2            = vec3(0.06, 0.07, 0.11); // deep-water color (RGB, should be darker than the low-water color)\nuniform vec4 u_watercolor;\nuniform vec4 u_watercolor2;\nvec3 water_specularcolor    = vec3(1.3, 1.3, 0.9);    // specular Color (RGB) of the water-highlights\n#define light                 vec3(-0., sin(u_time*0.5)*.5 + .35, 2.8) // position of the sun\n\nuniform sampler2D u_texture1;\nuniform sampler2D u_texture2;\nuniform sampler2D u_texture3;\n\n  \n\nfloat hash( float n ) {\n    return fract(sin(n)*43758.5453123);\n}\n\n// 2d noise function\nfloat noise1( in vec2 x ) {\n  vec2 p  = floor(x);\n  vec2 f  = smoothstep(0.0, 1.0, fract(x));\n  float n = p.x + p.y*57.0;\n  return mix(mix( hash(n+  0.0), hash(n+  1.0),f.x),\n    mix( hash(n+ 57.0), hash(n+ 58.0),f.x),f.y);\n}\n\nfloat noise(vec2 p) {\n    return texture2D(u_texture2,p*vec2(1./256.)).x;\n}\n\nvec4 highness(vec2 p) {\n    vec4 t = texture2D(u_texture1,fract(p));\n    float clipped = -2.0-smoothstep(3.,10.,t.a)*6.9-smoothstep(10.,100.,t.a)*89.9-smoothstep(0.,10000.,t.a)*10000.0;\n    return clamp(t, 0.0,3.0)+clamp(t/3.0-1.0, 0.0,1.0)+clamp(t/16.0-1.0, 0.0,1.0);\n}\n\nfloat height_map( vec2 p ) {\n    vec4 height=highness(p);\n    /*\n    height = -0.5+\n        0.5*smoothstep(-100.,0.,-height)+\n        2.75*smoothstep(0.,2.,height)+\n        1.75*smoothstep(2.,4.,height)+\n        2.75*smoothstep(4.,16.,height)+\n        1.5*smoothstep(16.,1000.,height);\n    */\n\n    mat2 m = mat2( 0.9563*1.4,  -0.2924*1.4,  0.2924*1.4,  0.9563*1.4 );\n    //p = p*6.;\n    float f = 0.6000*noise1( p ); p = m*p*1.1*6.;\n    f += 0.2500*noise( p ); p = m*p*1.32;\n    f += 0.1666*noise( p ); p = m*p*1.11;\n    f += 0.0834*noise( p ); p = m*p*1.12;\n    f += 0.0634*noise( p ); p = m*p*1.13;\n    f += 0.0444*noise( p ); p = m*p*1.14;\n    f += 0.0274*noise( p ); p = m*p*1.15;\n    f += 0.0134*noise( p ); p = m*p*1.16;\n    f += 0.0104*noise( p ); p = m*p*1.17;\n    f += 0.0084*noise( p );\n    f = .25*f+dot(height,vec4(-.03125,-.125,.25,.25))*.5;\n        const float FLAT_LEVEL = 0.92525;\n        //f = f*0.25+height*0.75;\n    if (f<FLAT_LEVEL)\n        f = f;\n    else\n        f = pow((f-FLAT_LEVEL)/(1.-FLAT_LEVEL), 2.)*(1.-FLAT_LEVEL)*2.0+FLAT_LEVEL; // makes a smooth coast-increase\n    return clamp(f, 0., 10.);\n}\n\nvec3 plasma_quintic( float x ) {\n    x = clamp( x, 0.0, 1.0);\n    vec4 x1 = vec4( 1.0, x, x * x, x * x * x ); // 1 x x2 x3\n    vec4 x2 = x1 * x1.w * x; // x4 x5 x6 x7\n    return vec3(\n        dot( x1.xyzw, vec4( +0.063861086, +1.992659096, -1.023901152, -0.490832805 ) ) + dot( x2.xy, vec2( +1.308442123, -0.914547012 ) ),\n        dot( x1.xyzw, vec4( +0.049718590, -0.791144343, +2.892305078, +0.811726816 ) ) + dot( x2.xy, vec2( -4.686502417, +2.717794514 ) ),\n        dot( x1.xyzw, vec4( +0.513275779, +1.580255060, -5.164414457, +4.559573646 ) ) + dot( x2.xy, vec2( -1.916810682, +0.570638854 ) ) );\n}\n\nvec4 color(vec2 p){\n    vec4 c1 = vec4(1.7,1.6,.9,1);\n    vec4 c2 = vec4(.2,.94,.1,1);\n    vec4 c3 = vec4(.3,.2,.0,1);\n    vec4 c4 = vec4(.99,.99,1.6,1);\n    vec4 v = highness(p);\n    float los = smoothstep(0.1,1.1,v.b);\n    float his = smoothstep(3.5,6.5,v.b);\n    float ces = smoothstep(1.,5.,v.a);\n    vec4 lo = mix(c1,c2,los);\n    vec4 hi = mix(c3,c4,his);\n    vec4 ce = mix(lo,hi,ces);\n\n    return vec4(plasma_quintic(ces),1).ragb;\n}\n\nvec3 terrain_map( vec2 p )\n{\n  return color(p).rgb*0.75+0.25*vec3(0.7, .55, .4)+texture2D(u_texture3, fract(p*5.)).rgb*.5; // test-terrain is simply 'sandstone'\n}\n\nconst mat2 m = mat2( 0.72, -1.60,  1.60,  0.72 );\n\nfloat water_map( vec2 p, float height ) {\n    vec2 p2 = p*large_wavesize;\n    vec2 shift1 = 0.001*vec2( u_time*160.0*2.0, u_time*120.0*2.0 );\n    vec2 shift2 = 0.001*vec2( u_time*190.0*2.0, -u_time*130.0*2.0 );\n\n    // coarse crossing 'ocean' waves...\n    float f = 0.6000*noise( p );\n    f += 0.2500*noise( p*m );\n    f += 0.1666*noise( p*m*m );\n    float wave = sin(p2.x*0.622+p2.y*0.622+shift2.x*4.269)*large_waveheight*f*height*height ;\n\n    p *= small_wavesize;\n    f = 0.;\n    float amp = 1.0, s = .5;\n    for (int i=0; i<9; i++)\n    { p = m*p*.947; f -= amp*abs(sin((noise( p+shift1*s )-.5)*2.)); amp = amp*.59; s*=-1.329; }\n    \n    return wave+f*small_waveheight;\n}\n\nfloat nautic(vec2 p) {\n    p *= 18.;\n    float f = 0.;\n    float amp = 1.0, s = .5;\n    for (int i=0; i<3; i++)\n    { p = m*p*1.2; f += amp*abs(smoothstep(0., 1., noise( p+u_time*s ))-.5); amp = amp*.5; s*=-1.227; }\n    return pow(1.-f, 5.);\n}\n\nfloat particles(vec2 p) {\n    p *= 200.;\n    float f = 0.;\n    float amp = 1.0, s = 1.5;\n    for (int i=0; i<3; i++)\n    { p = m*p*1.2; f += amp*noise( p+u_time*s ); amp = amp*.5; s*=-1.227; }\n    return pow(f*.35, 7.)*particle_amount;\n}\n\nfloat test_shadow( vec2 xy, float height) {\n    vec3 r0 = vec3(xy, height);\n    vec3 rd = normalize( light - r0 );\n    \n    float hit = 1.0;\n    float t   = 0.001;\n    for (int j=1; j<25; j++)\n    {\n        vec3 p = r0 + t*rd;\n        float h = height_map( p.xy );\n        float height_diff = p.z - h;\n        if (height_diff<0.0)\n        {\n            return 0.0;\n        }\n        t += 0.01+height_diff*.02;\n        hit = min(hit, 2.*height_diff/t); // soft shaddow   \n    }\n    return hit;\n}\n\nvec3 CalcTerrain(vec2 uv, float height) {\n    vec3 col = terrain_map( uv );\n    vec2 iResolution = vec2(512.);\n    float h1 = height_map(uv-vec2(0., 0.5)/ iResolution.xy);\n    float h2 = height_map(uv+vec2(0., 0.5)/ iResolution.xy);\n    float h3 = height_map(uv-vec2(0.5, 0.)/ iResolution.xy);\n    float h4 = height_map(uv+vec2(0.5, 0.)/ iResolution.xy);\n    vec3 norm = normalize(vec3(h3-h4, h1-h2, 1.));\n    vec3 r0 = vec3(uv, height);\n    vec3 rd = normalize( light - r0 );\n    float grad = dot(norm, rd);\n    col *= grad+pow(grad, 8.);\n    float terrainshade = test_shadow( uv, height );\n    col = mix(col*.25, col, terrainshade);\n    return col;\n}\n\n\nvoid main() {\n  vec3 watercolor = u_watercolor.rgb;\n  vec3 watercolor2 = u_watercolor2.rgb;\n  vec2 uv = v_uv;\n  float WATER_LEVEL = 0.84; // Water level (range: 0.0 - 2.0)\n  float deepwater_fadedepth   = 0.4 + coast2water_fadedepth;\n  float height = height_map( uv );\n  vec3 col;\n\n    float waveheight = clamp(WATER_LEVEL*3.-1.5, 0., 1.);\n    float level = WATER_LEVEL + .2*water_map(uv*15. + vec2(u_time*.1), waveheight);\n    if (height > level)\n    {\n        col = CalcTerrain(uv, height);\n    }\n    if (height <= level)\n    {\n        vec2 dif = vec2(.0, .01);\n        vec2 pos = uv*15. + vec2(u_time*.01);\n        float h1 = water_map(pos-dif,waveheight);\n        float h2 = water_map(pos+dif,waveheight);\n        float h3 = water_map(pos-dif.yx,waveheight);\n        float h4 = water_map(pos+dif.yx,waveheight);\n        vec3 normwater = normalize(vec3(h3-h4, h1-h2, .125)); // norm-vector of the 'bumpy' water-plane\n        uv += normwater.xy*.002*(level-height);\n        \n        col = CalcTerrain(uv, height);\n\n        float coastfade = clamp((level-height)/coast2water_fadedepth, 0., 1.);\n        float coastfade2= clamp((level-height)/deepwater_fadedepth, 0., 1.);\n        float intensity = col.r*.2126+col.g*.7152+col.b*.0722;\n        watercolor = mix(watercolor*intensity, watercolor2, smoothstep(0., 1., coastfade2));\n\n        vec3 r0 = vec3(uv, WATER_LEVEL);\n        vec3 rd = normalize( light - r0 ); // ray-direction to the light from water-position\n        float grad     = dot(normwater, rd); // dot-product of norm-vector and light-direction\n        float specular = pow(grad, water_softlight_fact);  // used for soft highlights                          \n        float specular2= pow(grad, water_glossylight_fact); // used for glossy highlights\n        float gradpos  = dot(vec3(0., 0., 1.), rd);\n        float specular1= smoothstep(0., 1., pow(gradpos, 5.));  // used for diffusity (some darker corona around light's specular reflections...)                          \n        float watershade  = test_shadow( uv, level );\n        watercolor *= 2.2+watershade;\n        watercolor += (.2+.8*watershade) * ((grad-1.0)*.5+specular) * .25;\n        watercolor /= (1.+specular1*1.25);\n        watercolor += watershade*specular2*water_specularcolor;\n        watercolor += watershade*coastfade*(1.-coastfade2)*(vec3(.5, .6, .7)*nautic(uv)+vec3(1., 1., 1.)*particles(uv));\n        \n        col = mix(col, watercolor, coastfade);\n    }\n    \n\n  float opacity = styleMappingMat[0][0];\n  gl_FragColor = vec4(col, opacity);\n\n  // gl_FragColor = v_Color;\n  \n}\n";
+var ocean_vert = "attribute vec4 a_Color;\nattribute vec2 a_uv;\nattribute vec3 a_Position;\nuniform mat4 u_ModelMatrix;\nuniform mat4 u_Mvp;\n\nvarying vec4 v_Color;\nvarying vec2 v_uv;\nuniform float u_opacity: 1.0;\nvarying mat4 styleMappingMat; // \u7528\u4E8E\u5C06\u5728\u9876\u70B9\u7740\u8272\u5668\u4E2D\u8BA1\u7B97\u597D\u7684\u6837\u5F0F\u503C\u4F20\u9012\u7ED9\u7247\u5143\n\n#pragma include \"styleMapping\"\n#pragma include \"styleMappingCalOpacity\"\n\n#pragma include \"projection\"\n#pragma include \"picking\"\n\nvoid main() {\n  v_uv = a_uv;\n  // cal style mapping - \u6570\u636E\u7EB9\u7406\u6620\u5C04\u90E8\u5206\u7684\u8BA1\u7B97\nstyleMappingMat = mat4(\n    0.0, 0.0, 0.0, 0.0, // opacity - strokeOpacity - strokeWidth - empty\n    0.0, 0.0, 0.0, 0.0, // strokeR - strokeG - strokeB - strokeA\n    0.0, 0.0, 0.0, 0.0, // offsets[0] - offsets[1]\n    0.0, 0.0, 0.0, 0.0\n  );\n\n  float rowCount = u_cellTypeLayout[0][0];    // \u5F53\u524D\u7684\u6570\u636E\u7EB9\u7406\u6709\u51E0\u884C\n  float columnCount = u_cellTypeLayout[0][1]; // \u5F53\u770B\u5230\u6570\u636E\u7EB9\u7406\u6709\u51E0\u5217\n  float columnWidth = 1.0/columnCount;  // \u5217\u5BBD\n  float rowHeight = 1.0/rowCount;       // \u884C\u9AD8\n  float cellCount = calCellCount(); // opacity - strokeOpacity - strokeWidth - stroke - offsets\n  float id = a_vertexId; // \u7B2Cn\u4E2A\u9876\u70B9\n  float cellCurrentRow = floor(id * cellCount / columnCount) + 1.0; // \u8D77\u59CB\u70B9\u5728\u7B2C\u51E0\u884C\n  float cellCurrentColumn = mod(id * cellCount, columnCount) + 1.0; // \u8D77\u59CB\u70B9\u5728\u7B2C\u51E0\u5217\n  \n  // cell \u56FA\u5B9A\u987A\u5E8F opacity -> strokeOpacity -> strokeWidth -> stroke ... \n  // \u6309\u987A\u5E8F\u4ECE cell \u4E2D\u53D6\u503C\u3001\u82E5\u6CA1\u6709\u5219\u81EA\u52A8\u5F80\u4E0B\u53D6\u503C\n  float textureOffset = 0.0; // \u5728 cell \u4E2D\u53D6\u503C\u7684\u504F\u79FB\u91CF\n\n  vec2 opacityAndOffset = calOpacityAndOffset(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset, columnWidth, rowHeight);\n  styleMappingMat[0][0] = opacityAndOffset.r;\n  textureOffset = opacityAndOffset.g;\n  // cal style mapping - \u6570\u636E\u7EB9\u7406\u6620\u5C04\u90E8\u5206\u7684\u8BA1\u7B97\n\n  v_Color = a_Color;\n  vec4 project_pos = project_position(vec4(a_Position, 1.0));\n  // gl_Position = project_common_position_to_clipspace(vec4(project_pos.xyz, 1.0));\n\n  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x\n    gl_Position = u_Mvp * (vec4(project_pos.xyz, 1.0));\n  } else {\n    gl_Position = project_common_position_to_clipspace(vec4(project_pos.xyz, 1.0));\n  }\n\n  setPickingColor(a_PickingColor);\n}\n\n";
+
+var OceanModel = function (_BaseModel) {
+  _inherits(OceanModel, _BaseModel);
+
+  var _super = _createSuper(OceanModel);
+
+  function OceanModel() {
+    var _this;
+
+    _classCallCheck(this, OceanModel);
+
+    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));
+
+    _defineProperty(_assertThisInitialized(_this), "texture1", void 0);
+
+    _defineProperty(_assertThisInitialized(_this), "texture2", void 0);
+
+    _defineProperty(_assertThisInitialized(_this), "texture3", void 0);
+
+    return _this;
+  }
+
+  _createClass(OceanModel, [{
+    key: "getUninforms",
+    value: function getUninforms() {
+      var _ref = this.layer.getLayerConfig(),
+          _ref$opacity = _ref.opacity,
+          opacity = _ref$opacity === void 0 ? 1 : _ref$opacity,
+          _ref$watercolor = _ref.watercolor,
+          watercolor = _ref$watercolor === void 0 ? '#6D99A8' : _ref$watercolor,
+          _ref$watercolor2 = _ref.watercolor2,
+          watercolor2 = _ref$watercolor2 === void 0 ? '#0F121C' : _ref$watercolor2;
+
+      if (this.dataTextureTest && this.dataTextureNeedUpdate({
+        opacity: opacity
+      })) {
+        this.judgeStyleAttributes({
+          opacity: opacity
+        });
+        var encodeData = this.layer.getEncodedData();
+
+        var _this$calDataFrame = this.calDataFrame(this.cellLength, encodeData, this.cellProperties),
+            data = _this$calDataFrame.data,
+            width = _this$calDataFrame.width,
+            height = _this$calDataFrame.height;
+
+        this.rowCount = height;
+        this.dataTexture = this.cellLength > 0 && data.length > 0 ? this.createTexture2D({
+          flipY: true,
+          data: data,
+          format: gl.LUMINANCE,
+          type: gl.FLOAT,
+          width: width,
+          height: height
+        }) : this.createTexture2D({
+          flipY: true,
+          data: [1],
+          format: gl.LUMINANCE,
+          type: gl.FLOAT,
+          width: 1,
+          height: 1
+        });
+      }
+
+      return {
+        u_texture1: this.texture1,
+        u_texture2: this.texture2,
+        u_texture3: this.texture3,
+        u_watercolor: rgb2arr(watercolor),
+        u_watercolor2: rgb2arr(watercolor2),
+        u_dataTexture: this.dataTexture,
+        u_cellTypeLayout: this.getCellTypeLayout(),
+        u_opacity: _isNumber(opacity) ? opacity : 1.0
+      };
+    }
+  }, {
+    key: "getAnimateUniforms",
+    value: function getAnimateUniforms() {
+      return {
+        u_time: this.layer.getLayerAnimateTime()
+      };
+    }
+  }, {
+    key: "initModels",
+    value: function initModels() {
+      this.loadTexture();
+      return this.buildModels();
+    }
+  }, {
+    key: "buildModels",
+    value: function buildModels() {
+      var _ref2 = this.layer.getLayerConfig(),
+          _ref2$mask = _ref2.mask,
+          mask = _ref2$mask === void 0 ? false : _ref2$mask,
+          _ref2$maskInside = _ref2.maskInside,
+          maskInside = _ref2$maskInside === void 0 ? true : _ref2$maskInside;
+
+      return [this.layer.buildLayerModel({
+        moduleName: 'polygon_ocean',
+        vertexShader: ocean_vert,
+        fragmentShader: ocean_frag,
+        triangulation: polygonTriangulation,
+        depth: {
+          enable: false
+        },
+        stencil: getMask(mask, maskInside)
+      })];
+    }
+  }, {
+    key: "clearModels",
+    value: function clearModels() {
+      var _this$dataTexture;
+
+      this.texture1.destroy();
+      this.texture2.destroy();
+      this.texture3.destroy();
+      (_this$dataTexture = this.dataTexture) === null || _this$dataTexture === void 0 ? void 0 : _this$dataTexture.destroy();
+    }
+  }, {
+    key: "registerBuiltinAttributes",
+    value: function registerBuiltinAttributes() {
+      var bbox = this.layer.getSource().extent;
+
+      var _bbox = _slicedToArray(bbox, 4),
+          minLng = _bbox[0],
+          minLat = _bbox[1],
+          maxLng = _bbox[2],
+          maxLat = _bbox[3];
+
+      var lngLen = maxLng - minLng;
+      var latLen = maxLat - minLat;
+      this.styleAttributeService.registerStyleAttribute({
+        name: 'linear',
+        type: AttributeType.Attribute,
+        descriptor: {
+          name: 'a_uv',
+          buffer: {
+            usage: gl.STATIC_DRAW,
+            data: [],
+            type: gl.FLOAT
+          },
+          size: 2,
+          update: function update(feature, featureIdx, vertex, attributeIdx, normal) {
+            var _vertex = _slicedToArray(vertex, 2),
+                lng = _vertex[0],
+                lat = _vertex[1];
+
+            return [(lng - minLng) / lngLen, (lat - minLat) / latLen];
+          }
+        }
+      });
+    }
+  }, {
+    key: "loadTexture",
+    value: function loadTexture() {
+      var _this2 = this;
+
+      var createTexture2D = this.rendererService.createTexture2D;
+      var defaultTextureOptions = {
+        height: 0,
+        width: 0
+      };
+      this.texture1 = createTexture2D(defaultTextureOptions);
+      this.texture2 = createTexture2D(defaultTextureOptions);
+      this.texture3 = createTexture2D(defaultTextureOptions);
+      initImage(function (images) {
+        _this2.texture1 = initTex(images[0]);
+        _this2.texture2 = initTex(images[1]);
+        _this2.texture3 = initTex(images[2]);
+
+        _this2.layerService.updateLayerRenderList();
+
+        _this2.layerService.renderLayers();
+      });
+
+      function initImage(callback) {
+        var loadedCount = 0;
+        var loadedImages = [];
+        var images = ['https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*EojwT4VzSiYAAAAAAAAAAAAAARQnAQ', 'https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*MJ22QbpuCzIAAAAAAAAAAAAAARQnAQ', 'https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*-z2HSIVDsHIAAAAAAAAAAAAAARQnAQ'];
+        images.map(function (imgSrc) {
+          var image = new Image();
+          image.crossOrigin = '';
+          image.src = imgSrc;
+          loadedImages.push(image);
+
+          image.onload = function () {
+            loadedCount++;
+
+            if (loadedCount === 3) {
+              callback(loadedImages);
+            }
+          };
+        });
+      }
+
+      function initTex(image) {
+        return createTexture2D({
+          data: image,
+          width: image.width,
+          height: image.height,
+          wrapS: gl.MIRRORED_REPEAT,
+          wrapT: gl.MIRRORED_REPEAT,
+          min: gl.LINEAR,
+          mag: gl.LINEAR
+        });
+      }
+    }
+  }]);
+
+  return OceanModel;
+}(BaseModel);
+
+export { OceanModel as default };
+//# sourceMappingURL=ocean.js.map

package/es/polygon/models/ocean.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/polygon/models/ocean.ts"],"names":["AttributeType","gl","getMask","rgb2arr","BaseModel","polygonTriangulation","OceanModel","layer","getLayerConfig","opacity","watercolor","watercolor2","dataTextureTest","dataTextureNeedUpdate","judgeStyleAttributes","encodeData","getEncodedData","calDataFrame","cellLength","cellProperties","data","width","height","rowCount","dataTexture","length","createTexture2D","flipY","format","LUMINANCE","type","FLOAT","u_texture1","texture1","u_texture2","texture2","u_texture3","texture3","u_watercolor","u_watercolor2","u_dataTexture","u_cellTypeLayout","getCellTypeLayout","u_opacity","u_time","getLayerAnimateTime","loadTexture","buildModels","mask","maskInside","buildLayerModel","moduleName","vertexShader","ocean_vert","fragmentShader","ocean_frag","triangulation","depth","enable","stencil","destroy","bbox","getSource","extent","minLng","minLat","maxLng","maxLat","lngLen","latLen","styleAttributeService","registerStyleAttribute","name","Attribute","descriptor","buffer","usage","STATIC_DRAW","size","update","feature","featureIdx","vertex","attributeIdx","normal","lng","lat","rendererService","defaultTextureOptions","initImage","images","initTex","layerService","updateLayerRenderList","renderLayers","callback","loadedCount","loadedImages","map","imgSrc","image","Image","crossOrigin","src","push","onload","wrapS","MIRRORED_REPEAT","wrapT","min","LINEAR","mag"],"mappings":"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","sourcesContent":["import {\n  AttributeType,\n  gl,\n  IEncodeFeature,\n  IModel,\n  IModelUniform,\n  ITexture2D,\n} from '@antv/l7-core';\nimport { getMask, rgb2arr } from '@antv/l7-utils';\nimport { create, isNumber } from 'lodash';\nimport BaseModel from '../../core/BaseModel';\nimport { IPolygonLayerStyleOptions } from '../../core/interface';\nimport { polygonTriangulation } from '../../core/triangulation';\nimport ocean_frag from '../shaders/water/polygon_ocean_frag.glsl';\nimport ocean_vert from '../shaders/water/polygon_ocean_vert.glsl';\nexport default class OceanModel extends BaseModel {\n  private texture1: ITexture2D;\n  private texture2: ITexture2D;\n  private texture3: ITexture2D;\n  public getUninforms() {\n    const {\n      opacity = 1,\n      watercolor = '#6D99A8',\n      watercolor2 = '#0F121C',\n    } = this.layer.getLayerConfig() as IPolygonLayerStyleOptions;\n    if (this.dataTextureTest && this.dataTextureNeedUpdate({ opacity })) {\n      this.judgeStyleAttributes({ opacity });\n      const encodeData = this.layer.getEncodedData();\n      const { data, width, height } = this.calDataFrame(\n        this.cellLength,\n        encodeData,\n        this.cellProperties,\n      );\n      this.rowCount = height; // 当前数据纹理有多少行\n\n      this.dataTexture =\n        this.cellLength > 0 && data.length > 0\n          ? this.createTexture2D({\n              flipY: true,\n              data,\n              format: gl.LUMINANCE,\n              type: gl.FLOAT,\n              width,\n              height,\n            })\n          : this.createTexture2D({\n              flipY: true,\n              data: [1],\n              format: gl.LUMINANCE,\n              type: gl.FLOAT,\n              width: 1,\n              height: 1,\n            });\n    }\n    return {\n      u_texture1: this.texture1,\n      u_texture2: this.texture2,\n      u_texture3: this.texture3,\n      u_watercolor: rgb2arr(watercolor),\n      u_watercolor2: rgb2arr(watercolor2),\n      u_dataTexture: this.dataTexture, // 数据纹理 - 有数据映射的时候纹理中带数据，若没有任何数据映射时纹理是 [1]\n      u_cellTypeLayout: this.getCellTypeLayout(),\n      u_opacity: isNumber(opacity) ? opacity : 1.0,\n    };\n  }\n\n  public getAnimateUniforms(): IModelUniform {\n    return {\n      u_time: this.layer.getLayerAnimateTime(),\n    };\n  }\n\n  public initModels(): IModel[] {\n    this.loadTexture();\n    return this.buildModels();\n  }\n\n  public buildModels(): IModel[] {\n    const {\n      mask = false,\n      maskInside = true,\n    } = this.layer.getLayerConfig() as IPolygonLayerStyleOptions;\n    return [\n      this.layer.buildLayerModel({\n        moduleName: 'polygon_ocean',\n        vertexShader: ocean_vert,\n        fragmentShader: ocean_frag,\n        triangulation: polygonTriangulation,\n        depth: { enable: false },\n\n        stencil: getMask(mask, maskInside),\n      }),\n    ];\n  }\n\n  public clearModels() {\n    this.texture1.destroy();\n    this.texture2.destroy();\n    this.texture3.destroy();\n    this.dataTexture?.destroy();\n  }\n\n  protected registerBuiltinAttributes() {\n    const bbox = this.layer.getSource().extent;\n    const [minLng, minLat, maxLng, maxLat] = bbox;\n    const lngLen = maxLng - minLng;\n    const latLen = maxLat - minLat;\n\n    this.styleAttributeService.registerStyleAttribute({\n      name: 'linear',\n      type: AttributeType.Attribute,\n      descriptor: {\n        name: 'a_uv',\n        buffer: {\n          // give the WebGL driver a hint that this buffer may change\n          usage: gl.STATIC_DRAW,\n          data: [],\n          type: gl.FLOAT,\n        },\n        size: 2,\n        update: (\n          feature: IEncodeFeature,\n          featureIdx: number,\n          vertex: number[],\n          attributeIdx: number,\n          normal: number[],\n        ) => {\n          const [lng, lat] = vertex;\n          return [(lng - minLng) / lngLen, (lat - minLat) / latLen];\n        },\n      },\n    });\n  }\n\n  private loadTexture() {\n    const { createTexture2D } = this.rendererService;\n    const defaultTextureOptions = { height: 0, width: 0 };\n    // 默认索引为 undefined，所以单独赋值\n    this.texture1 = createTexture2D(defaultTextureOptions);\n    this.texture2 = createTexture2D(defaultTextureOptions);\n    this.texture3 = createTexture2D(defaultTextureOptions);\n\n    // 加载完 image 后单独给 texture f赋值\n    initImage((images: HTMLImageElement[]) => {\n      this.texture1 = initTex(images[0]);\n      this.texture2 = initTex(images[1]);\n      this.texture3 = initTex(images[2]);\n      this.layerService.updateLayerRenderList();\n      this.layerService.renderLayers();\n    });\n\n    function initImage(callback: (loadedImages: HTMLImageElement[]) => void) {\n      let loadedCount = 0;\n      const loadedImages: HTMLImageElement[] = [];\n      const images = [\n        'https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*EojwT4VzSiYAAAAAAAAAAAAAARQnAQ',\n        'https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*MJ22QbpuCzIAAAAAAAAAAAAAARQnAQ',\n        'https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*-z2HSIVDsHIAAAAAAAAAAAAAARQnAQ',\n      ];\n      images.map((imgSrc: string) => {\n        const image = new Image();\n        image.crossOrigin = '';\n        image.src = imgSrc;\n        loadedImages.push(image);\n        image.onload = () => {\n          loadedCount++;\n          if (loadedCount === 3) {\n            callback(loadedImages);\n          }\n        };\n      });\n    }\n\n    function initTex(image: HTMLImageElement) {\n      return createTexture2D({\n        data: image,\n        width: image.width,\n        height: image.height,\n        wrapS: gl.MIRRORED_REPEAT,\n        wrapT: gl.MIRRORED_REPEAT,\n        min: gl.LINEAR,\n        mag: gl.LINEAR,\n      });\n    }\n  }\n}\n"],"file":"ocean.js"}

package/lib/canvas/index.js

@@ -0,0 +1,95 @@
+"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 _index = _interopRequireDefault(require("./models/index"));
+
+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 CanvasLayer = function (_BaseLayer) {
+  (0, _inherits2.default)(CanvasLayer, _BaseLayer);
+
+  var _super = _createSuper(CanvasLayer);
+
+  function CanvasLayer() {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, CanvasLayer);
+
+    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", 'CanvasLayer');
+    return _this;
+  }
+
+  (0, _createClass2.default)(CanvasLayer, [{
+    key: "buildModels",
+    value: function buildModels() {
+      var modelType = this.getModelType();
+      this.layerModel = new _index.default[modelType](this);
+      this.models = this.layerModel.initModels();
+    }
+  }, {
+    key: "rebuildModels",
+    value: function rebuildModels() {
+      this.models = this.layerModel.buildModels();
+    }
+  }, {
+    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 = {
+        canvas: {}
+      };
+      return defaultConfig[type];
+    }
+  }, {
+    key: "getModelType",
+    value: function getModelType() {
+      return 'canvas';
+    }
+  }]);
+  return CanvasLayer;
+}(_BaseLayer2.default);
+
+exports.default = CanvasLayer;
+//# sourceMappingURL=index.js.map

package/lib/canvas/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/canvas/index.ts"],"names":["CanvasLayer","modelType","getModelType","layerModel","CanvasModels","models","initModels","buildModels","properties","opacity","type","minimum","maximum","defaultConfig","canvas","BaseLayer"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAEA;;;;;;IACqBA,W;;;;;;;;;;;;;;;uFACG,a;;;;;;WACtB,uBAAqB;AACnB,UAAMC,SAAS,GAAG,KAAKC,YAAL,EAAlB;AACA,WAAKC,UAAL,GAAkB,IAAIC,eAAaH,SAAb,CAAJ,CAA4B,IAA5B,CAAlB;AACA,WAAKI,MAAL,GAAc,KAAKF,UAAL,CAAgBG,UAAhB,EAAd;AACD;;;WACD,yBAAuB;AACrB,WAAKD,MAAL,GAAc,KAAKF,UAAL,CAAgBI,WAAhB,EAAd;AACD;;;WACD,2BAA4B;AAC1B,aAAO;AACLC,QAAAA,UAAU,EAAE;AACVC,UAAAA,OAAO,EAAE;AACPC,YAAAA,IAAI,EAAE,QADC;AAEPC,YAAAA,OAAO,EAAE,CAFF;AAGPC,YAAAA,OAAO,EAAE;AAHF;AADC;AADP,OAAP;AASD;;;WACD,4BAA6B;AAC3B,UAAMF,IAAI,GAAG,KAAKR,YAAL,EAAb;AACA,UAAMW,aAAa,GAAG;AACpBC,QAAAA,MAAM,EAAE;AADY,OAAtB;AAGA,aAAOD,aAAa,CAACH,IAAD,CAApB;AACD;;;WAED,wBAA0C;AACxC,aAAO,QAAP;AACD;;;EA/BsCK,mB","sourcesContent":["import BaseLayer from '../core/BaseLayer';\nimport { ICanvasLayerStyleOptions } from '../core/interface';\nimport CanvasModels, { CanvasModelType } from './models/index';\nexport default class CanvasLayer extends BaseLayer<ICanvasLayerStyleOptions> {\n  public type: string = 'CanvasLayer';\n  public buildModels() {\n    const modelType = this.getModelType();\n    this.layerModel = new CanvasModels[modelType](this);\n    this.models = this.layerModel.initModels();\n  }\n  public rebuildModels() {\n    this.models = this.layerModel.buildModels();\n  }\n  protected getConfigSchema() {\n    return {\n      properties: {\n        opacity: {\n          type: 'number',\n          minimum: 0,\n          maximum: 1,\n        },\n      },\n    };\n  }\n  protected getDefaultConfig() {\n    const type = this.getModelType();\n    const defaultConfig = {\n      canvas: {},\n    };\n    return defaultConfig[type];\n  }\n\n  protected getModelType(): CanvasModelType {\n    return 'canvas';\n  }\n}\n"],"file":"index.js"}

package/lib/canvas/models/canvas.js

@@ -0,0 +1,208 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+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 _BaseModel2 = _interopRequireDefault(require("../../core/BaseModel"));
+
+var _interface = require("../../core/interface");
+
+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 CanvaModel = function (_BaseModel) {
+  (0, _inherits2.default)(CanvaModel, _BaseModel);
+
+  var _super = _createSuper(CanvaModel);
+
+  function CanvaModel() {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, CanvaModel);
+
+    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), "updateMode", _interface.CanvasUpdateType.AWAYS);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "canvas", void 0);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "ctx", void 0);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "prevSize", void 0);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderUpdate", function () {
+      var _ref = _this.layer.getLayerConfig(),
+          _ref$zIndex = _ref.zIndex,
+          zIndex = _ref$zIndex === void 0 ? 10 : _ref$zIndex,
+          _ref$update = _ref.update,
+          update = _ref$update === void 0 ? _interface.CanvasUpdateType.AWAYS : _ref$update;
+
+      if (+_this.canvas.style.zIndex === zIndex) {
+        _this.canvas.style.zIndex = zIndex + '';
+      }
+
+      if (_this.updateMode !== update) {
+        _this.updateMode = update;
+
+        _this.unBindListener();
+
+        _this.bindListener();
+      }
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "unBindListener", function () {
+      _this.mapService.off('mapchange', _this.renderCanvas);
+
+      _this.mapService.off('zoomstart', _this.clearCanvas);
+
+      _this.mapService.off('zoomend', _this.renderCanvas);
+
+      _this.mapService.off('movestart', _this.clearCanvas);
+
+      _this.mapService.off('moveend', _this.renderCanvas);
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "bindListener", function () {
+      if (_this.updateMode === _interface.CanvasUpdateType.AWAYS) {
+        _this.mapService.on('mapchange', _this.renderCanvas);
+      } else {
+        _this.mapService.on('zoomstart', _this.clearCanvas);
+
+        _this.mapService.on('zoomend', _this.renderCanvas);
+
+        _this.mapService.on('movestart', _this.clearCanvas);
+
+        _this.mapService.on('moveend', _this.renderCanvas);
+      }
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "clearCanvas", function () {
+      if (_this.ctx) {
+        var _this$rendererService = _this.rendererService.getViewportSize(),
+            w = _this$rendererService.width,
+            h = _this$rendererService.height;
+
+        _this.ctx.clearRect(0, 0, w, h);
+      }
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderCanvas", function () {
+      var _this$rendererService2 = _this.rendererService.getViewportSize(),
+          viewWidth = _this$rendererService2.width,
+          viewHeight = _this$rendererService2.height;
+
+      if (_this.prevSize[0] !== viewWidth || _this.prevSize[1] !== viewHeight) {
+        _this.prevSize = [viewWidth, viewHeight];
+
+        var size = _this.mapService.getSize();
+
+        var _size = (0, _slicedToArray2.default)(size, 2),
+            width = _size[0],
+            height = _size[1];
+
+        _this.canvas.width = viewWidth;
+        _this.canvas.height = viewHeight;
+        _this.canvas.style.width = width + 'px';
+        _this.canvas.style.height = height + 'px';
+      }
+
+      var _ref2 = _this.layer.getLayerConfig(),
+          drawingOnCanvas = _ref2.drawingOnCanvas;
+
+      if (_this.ctx) {
+        drawingOnCanvas(_this.ctx, _this.mapService, [viewWidth, viewHeight]);
+      }
+    });
+    return _this;
+  }
+
+  (0, _createClass2.default)(CanvaModel, [{
+    key: "clearModels",
+    value: function clearModels() {
+      if (this.canvas) {
+        document.removeChild(this.canvas);
+        this.canvas = null;
+      }
+
+      this.unBindListener();
+    }
+  }, {
+    key: "initModels",
+    value: function initModels() {
+      var _ref3 = this.layer.getLayerConfig(),
+          _ref3$update = _ref3.update,
+          update = _ref3$update === void 0 ? _interface.CanvasUpdateType.AWAYS : _ref3$update;
+
+      this.updateMode = update;
+      this.initCanvas();
+      this.renderCanvas();
+      this.bindListener();
+      this.mapService.getContainer();
+      return [];
+    }
+  }, {
+    key: "initCanvas",
+    value: function initCanvas() {
+      var _this$mapService$getC;
+
+      var _ref4 = this.layer.getLayerConfig(),
+          zIndex = _ref4.zIndex;
+
+      var size = this.mapService.getSize();
+
+      var _size2 = (0, _slicedToArray2.default)(size, 2),
+          width = _size2[0],
+          height = _size2[1];
+
+      var _this$rendererService3 = this.rendererService.getViewportSize(),
+          viewWidth = _this$rendererService3.width,
+          viewHeight = _this$rendererService3.height;
+
+      this.prevSize = [viewWidth, viewHeight];
+      var canvas = document.createElement('canvas');
+      this.canvas = canvas;
+      canvas.width = viewWidth;
+      canvas.height = viewHeight;
+      canvas.style.pointerEvents = 'none';
+      canvas.style.width = width + 'px';
+      canvas.style.height = height + 'px';
+      canvas.style.position = 'absolute';
+      canvas.style.top = '0';
+      canvas.style.left = '0';
+      canvas.style.zIndex = zIndex + '';
+      (_this$mapService$getC = this.mapService.getContainer()) === null || _this$mapService$getC === void 0 ? void 0 : _this$mapService$getC.appendChild(canvas);
+      var ctx = canvas.getContext('2d');
+      this.ctx = ctx;
+    }
+  }, {
+    key: "buildModels",
+    value: function buildModels() {
+      return this.initModels();
+    }
+  }, {
+    key: "registerBuiltinAttributes",
+    value: function registerBuiltinAttributes() {
+      return;
+    }
+  }]);
+  return CanvaModel;
+}(_BaseModel2.default);
+
+exports.default = CanvaModel;
+//# sourceMappingURL=canvas.js.map

package/lib/canvas/models/canvas.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/canvas/models/canvas.ts"],"names":["CanvaModel","CanvasUpdateType","AWAYS","layer","getLayerConfig","zIndex","update","canvas","style","updateMode","unBindListener","bindListener","mapService","off","renderCanvas","clearCanvas","on","ctx","rendererService","getViewportSize","w","width","h","height","clearRect","viewWidth","viewHeight","prevSize","size","getSize","drawingOnCanvas","document","removeChild","initCanvas","getContainer","createElement","pointerEvents","position","top","left","appendChild","getContext","initModels","BaseModel"],"mappings":"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","sourcesContent":["import BaseModel from '../../core/BaseModel';\nimport {\n  CanvasUpdateType,\n  ICanvasLayerStyleOptions,\n} from '../../core/interface';\n\nexport default class CanvaModel extends BaseModel {\n  protected updateMode: CanvasUpdateType = CanvasUpdateType.AWAYS;\n  protected canvas: HTMLCanvasElement;\n  protected ctx: CanvasRenderingContext2D;\n  protected prevSize: [number, number];\n  public renderUpdate = () => {\n    const {\n      zIndex = 10,\n      update = CanvasUpdateType.AWAYS,\n    } = this.layer.getLayerConfig() as ICanvasLayerStyleOptions;\n    if (+this.canvas.style.zIndex === zIndex) {\n      this.canvas.style.zIndex = zIndex + '';\n    }\n    if (this.updateMode !== update) {\n      this.updateMode = update as CanvasUpdateType;\n      this.unBindListener();\n      this.bindListener();\n    }\n  };\n\n  public unBindListener = () => {\n    this.mapService.off('mapchange', this.renderCanvas);\n    this.mapService.off('zoomstart', this.clearCanvas);\n    this.mapService.off('zoomend', this.renderCanvas);\n    this.mapService.off('movestart', this.clearCanvas);\n    this.mapService.off('moveend', this.renderCanvas);\n  };\n\n  public bindListener = () => {\n    if (this.updateMode === CanvasUpdateType.AWAYS) {\n      this.mapService.on('mapchange', this.renderCanvas);\n    } else {\n      this.mapService.on('zoomstart', this.clearCanvas);\n      this.mapService.on('zoomend', this.renderCanvas);\n      this.mapService.on('movestart', this.clearCanvas);\n      this.mapService.on('moveend', this.renderCanvas);\n    }\n  };\n\n  public clearModels(): void {\n    if (this.canvas) {\n      document.removeChild(this.canvas);\n      // @ts-ignore\n      this.canvas = null;\n    }\n    this.unBindListener();\n  }\n\n  public initModels() {\n    const {\n      update = CanvasUpdateType.AWAYS,\n    } = this.layer.getLayerConfig() as ICanvasLayerStyleOptions;\n    this.updateMode = update as CanvasUpdateType;\n    this.initCanvas();\n\n    this.renderCanvas();\n\n    this.bindListener();\n\n    this.mapService.getContainer();\n    return [];\n  }\n\n  public initCanvas(): void {\n    const { zIndex } = this.layer.getLayerConfig() as ICanvasLayerStyleOptions;\n    const size = this.mapService.getSize();\n    const [width, height] = size;\n    const {\n      width: viewWidth,\n      height: viewHeight,\n    } = this.rendererService.getViewportSize();\n    this.prevSize = [viewWidth, viewHeight];\n\n    const canvas = document.createElement('canvas');\n    this.canvas = canvas;\n    canvas.width = viewWidth;\n    canvas.height = viewHeight;\n    canvas.style.pointerEvents = 'none';\n    canvas.style.width = width + 'px';\n    canvas.style.height = height + 'px';\n    canvas.style.position = 'absolute';\n    canvas.style.top = '0';\n    canvas.style.left = '0';\n    canvas.style.zIndex = zIndex + '';\n    this.mapService.getContainer()?.appendChild(canvas);\n\n    const ctx = canvas.getContext('2d') as CanvasRenderingContext2D;\n    this.ctx = ctx;\n  }\n\n  public clearCanvas = () => {\n    if (this.ctx) {\n      const { width: w, height: h } = this.rendererService.getViewportSize();\n      this.ctx.clearRect(0, 0, w, h);\n    }\n  };\n\n  public renderCanvas = () => {\n    const {\n      width: viewWidth,\n      height: viewHeight,\n    } = this.rendererService.getViewportSize();\n    if (this.prevSize[0] !== viewWidth || this.prevSize[1] !== viewHeight) {\n      this.prevSize = [viewWidth, viewHeight];\n      const size = this.mapService.getSize();\n      const [width, height] = size;\n      this.canvas.width = viewWidth;\n      this.canvas.height = viewHeight;\n      this.canvas.style.width = width + 'px';\n      this.canvas.style.height = height + 'px';\n    }\n\n    const {\n      drawingOnCanvas,\n    } = this.layer.getLayerConfig() as ICanvasLayerStyleOptions;\n\n    if (this.ctx) {\n      drawingOnCanvas(this.ctx, this.mapService, [viewWidth, viewHeight]);\n    }\n  };\n\n  public buildModels() {\n    return this.initModels();\n  }\n\n  protected registerBuiltinAttributes() {\n    return;\n  }\n}\n"],"file":"canvas.js"}

package/lib/canvas/models/index.js

@@ -0,0 +1,17 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _canvas = _interopRequireDefault(require("./canvas"));
+
+var CanvasModels = {
+  canvas: _canvas.default
+};
+var _default = CanvasModels;
+exports.default = _default;
+//# sourceMappingURL=index.js.map

package/lib/canvas/models/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/canvas/models/index.ts"],"names":["CanvasModels","canvas","CanvasModel"],"mappings":";;;;;;;;;AAAA;;AAGA,IAAMA,YAA+C,GAAG;AACtDC,EAAAA,MAAM,EAAEC;AAD8C,CAAxD;eAIeF,Y","sourcesContent":["import CanvasModel from './canvas';\nexport type CanvasModelType = 'canvas';\n\nconst CanvasModels: { [key in CanvasModelType]: any } = {\n  canvas: CanvasModel,\n};\n\nexport default CanvasModels;\n"],"file":"index.js"}

package/lib/core/BaseLayer.js

@@ -1071,6 +1071,10 @@ var BaseLayer = (_dec = (0, _l7Core.lazyInject)(_l7Core.TYPES.IGlobalConfigServi
           this.layerModelNeedUpdate = false;
         }
 
+        if (this.layerModel.renderUpdate) {
+          this.layerModel.renderUpdate();
+        }
+
         this.models.forEach(function (model) {
           model.draw({
             uniforms: _this7.layerModel.getUninforms()