diff --git a/.gitignore b/.gitignore index 038a3de..16e66d5 100644 --- a/.gitignore +++ b/.gitignore @@ -57,6 +57,4 @@ typings/ .yarn-integrity # dotenv environment variables file -.env - -dist/ +.env \ No newline at end of file diff --git a/dist/leaflet.canvas-layer.js b/dist/leaflet.canvas-layer.js new file mode 100644 index 0000000..28217af --- /dev/null +++ b/dist/leaflet.canvas-layer.js @@ -0,0 +1 @@ +!function(t){var n={};function i(a){if(n[a])return n[a].exports;var e=n[a]={i:a,l:!1,exports:{}};return t[a].call(e.exports,e,e.exports,i),e.l=!0,e.exports}i.m=t,i.c=n,i.d=function(t,n,a){i.o(t,n)||Object.defineProperty(t,n,{enumerable:!0,get:a})},i.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},i.t=function(t,n){if(1&n&&(t=i(t)),8&n)return t;if(4&n&&"object"==typeof t&&t&&t.__esModule)return t;var a=Object.create(null);if(i.r(a),Object.defineProperty(a,"default",{enumerable:!0,value:t}),2&n&&"string"!=typeof t)for(var e in t)i.d(a,e,function(n){return t[n]}.bind(null,e));return a},i.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return i.d(n,"a",n),n},i.o=function(t,n){return Object.prototype.hasOwnProperty.call(t,n)},i.p="",i(i.s=0)}([function(t,n,i){var a=i(1),e=i(3);window.L.CanvasLayer=e(L),window.rbush=a},function(t,n,i){"use strict";t.exports=e,t.exports.default=e;var a=i(2);function e(t,n){if(!(this instanceof e))return new e(t,n);this._maxEntries=Math.max(4,t||9),this._minEntries=Math.max(2,Math.ceil(.4*this._maxEntries)),n&&this._initFormat(n),this.clear()}function r(t,n,i){if(!i)return n.indexOf(t);for(var a=0;a=t.minX&&n.maxY>=t.minY}function g(t){return{children:t,height:1,leaf:!0,minX:1/0,minY:1/0,maxX:-1/0,maxY:-1/0}}function x(t,n,i,e,r){for(var o,s=[n,i];s.length;)(i=s.pop())-(n=s.pop())<=e||(o=n+Math.ceil((i-n)/e/2)*e,a(t,o,n,i,r),s.push(n,o,o,i))}e.prototype={all:function(){return this._all(this.data,[])},search:function(t){var n=this.data,i=[],a=this.toBBox;if(!p(t,n))return i;for(var e,r,o,s,h=[];n;){for(e=0,r=n.children.length;e=0&&r[n].children.length>this._maxEntries;)this._split(r,n),n--;this._adjustParentBBoxes(e,r,n)},_split:function(t,n){var i=t[n],a=i.children.length,e=this._minEntries;this._chooseSplitAxis(i,e,a);var r=this._chooseSplitIndex(i,e,a),s=g(i.children.splice(r,i.children.length-r));s.height=i.height,s.leaf=i.leaf,o(i,this.toBBox),o(s,this.toBBox),n?t[n-1].children.push(s):this._splitRoot(i,s)},_splitRoot:function(t,n){this.data=g([t,n]),this.data.height=t.height+1,this.data.leaf=!1,o(this.data,this.toBBox)},_chooseSplitIndex:function(t,n,i){var a,e,r,o,h,l,c,u;for(l=c=1/0,a=n;a<=i-n;a++)o=d(e=s(t,0,a,this.toBBox),r=s(t,a,i,this.toBBox)),h=m(e)+m(r),o=n;e--)r=t.children[e],h(c,t.leaf?o(r):r),m+=u(c);return m},_adjustParentBBoxes:function(t,n,i){for(var a=i;a>=0;a--)h(n[a],t)},_condense:function(t){for(var n,i=t.length-1;i>=0;i--)0===t[i].children.length?i>0?(n=t[i-1].children).splice(n.indexOf(t[i]),1):this.clear():o(t[i],this.toBBox)},_initFormat:function(t){var n=["return a"," - b",";"];this.compareMinX=new Function("a","b",n.join(t[0])),this.compareMinY=new Function("a","b",n.join(t[1])),this.toBBox=new Function("a","return {minX: a"+t[0]+", minY: a"+t[1]+", maxX: a"+t[2]+", maxY: a"+t[3]+"};")}}},function(t,n,i){t.exports=function(){"use strict";function t(t,n,i){var a=t[n];t[n]=t[i],t[i]=a}function n(t,n){return tn?1:0}return function(i,a,e,r,o){!function n(i,a,e,r,o){for(;r>e;){if(r-e>600){var s=r-e+1,h=a-e+1,l=Math.log(s),c=.5*Math.exp(2*l/3),m=.5*Math.sqrt(l*c*(s-c)/s)*(h-s/2<0?-1:1),u=Math.max(e,Math.floor(a-h*c/s+m)),f=Math.min(r,Math.floor(a+(s-h)*c/s+m));n(i,a,u,f,o)}var d=i[a],_=e,p=r;for(t(i,e,a),o(i[r],d)>0&&t(i,e,r);_0;)p--}0===o(i[e],d)?t(i,e,p):t(i,++p,r),p<=a&&(e=p+1),a<=p&&(r=p-1)}}(i,a,e||0,r||i.length-1,o||n)}}()},function(t,n,i){"use strict";t.exports=function(t){var n=(t.Layer?t.Layer:t.Class).extend({initialize:function(n){t.setOptions(this,n),this._onClickListeners=[],this._onHoverListeners=[]},setOptions:function(n){return t.setOptions(this,n),this.redraw()},redraw:function(){this._redraw(!0)},addMarkers:function(t){var n=this,i=[],a=[];t.forEach(function(t){if("markerPane"==t.options.pane&&t.options.icon){var e=t.getLatLng(),r=n._map.getBounds().contains(e),o=n._addMarker(t,e,r);!0===r&&i.push(o[0]),a.push(o[1])}else console.error("Layer isn't a marker")}),n._markers.load(i),n._latlngMarkers.load(a)},addMarker:function(t){var n=t.getLatLng(),i=this._map.getBounds().contains(n),a=this._addMarker(t,n,i);!0===i&&this._markers.insert(a[0]),this._latlngMarkers.insert(a[1])},addLayer:function(t){"markerPane"==t.options.pane&&t.options.icon?this.addMarker(t):console.error("Layer isn't a marker")},addLayers:function(t){this.addMarkers(t)},removeLayer:function(t){this.removeMarker(t,!0)},removeMarker:function(t,n){t.minX&&(t=t.data);var i=t.getLatLng(),a=this._map.getBounds().contains(i),e={minX:i.lng,minY:i.lat,maxX:i.lng,maxY:i.lat,data:t};this._latlngMarkers.remove(e,function(t,n){return t.data._leaflet_id===n.data._leaflet_id}),this._latlngMarkers.total--,this._latlngMarkers.dirty++,!0===a&&!0===n&&this._redraw(!0)},onAdd:function(t){this._map=t,this._canvas||this._initCanvas(),this.options.pane?this.getPane().appendChild(this._canvas):t._panes.overlayPane.appendChild(this._canvas),t.on("moveend",this._reset,this),t.on("resize",this._reset,this),t.on("click",this._executeListeners,this),t.on("mousemove",this._executeListeners,this),t._zoomAnimated&&t.on("zoomanim",this._animateZoom,this)},onRemove:function(t){this.options.pane?this.getPane().removeChild(this._canvas):t.getPanes().overlayPane.removeChild(this._canvas),t.off("click",this._executeListeners,this),t.off("mousemove",this._executeListeners,this),t.off("moveend",this._reset,this),t.off("resize",this._reset,this),t._zoomAnimated&&t.off("zoomanim",this._animateZoom,this)},addTo:function(t){return t.addLayer(this),this},clearLayers:function(){this._latlngMarkers=null,this._markers=null,this._redraw(!0)},_getClassName(){return this.options&&this.options.className?this.options.className:null},_animateZoom:function(t){t&&this._updateCanvasPosition(t.center,t.zoom)},_updateCanvasPosition(n,i){var a=this._map.getZoomScale(i),e=this._map._latLngBoundsToNewLayerBounds(this._map.getBounds(),i,n).min;t.DomUtil.setTransform(this._canvas,e,a)},_addMarker:function(n,i,a){n._map=this._map,this._markers||(this._markers=new rbush),this._latlngMarkers||(this._latlngMarkers=new rbush,this._latlngMarkers.dirty=0,this._latlngMarkers.total=0),t.Util.stamp(n);var e=this._map.latLngToContainerPoint(i),r=n.options.icon.options.iconSize,o=r[0]/2,s=r[1]/2,h=[{minX:e.x-o,minY:e.y-s,maxX:e.x+o,maxY:e.y+s,data:n},{minX:i.lng,minY:i.lat,maxX:i.lng,maxY:i.lat,data:n}];return this._latlngMarkers.dirty++,this._latlngMarkers.total++,!0===a&&this._drawMarker(n,e),h},_drawMarker:function(t,n){var i=this;if(this._imageLookup||(this._imageLookup={}),n||(n=i._map.latLngToContainerPoint(t.getLatLng())),this.options.userDrawFunc&&"function"==typeof this.options.userDrawFunc){const i=t.options.icon.options.iconSize;this.options.userDrawFunc(this,t,n,i)}else if(t.canvas_img)i._drawImage(t,n);else{let a=t.options.icon.options.iconUrl;if(i._imageLookup[a])t.canvas_img=i._imageLookup[a][0],!1===i._imageLookup[a][1]?i._imageLookup[a][2].push([t,n]):i._drawImage(t,n);else{let e=t.options.icon.options.html,r=window.URL||window.webkitURL||window,o=new Image,s=new Blob([e],{type:"image/svg+xml"}),h=r.createObjectURL(s);o.src=h,t.canvas_img=o,i._imageLookup[a]=[o,!1,[[t,n]]],o.onload=function(){i._imageLookup[a][1]=!0,i._imageLookup[a][2].forEach(function(t){i._drawImage(t[0],t[1])}),r.revokeObjectURL(h)}}}},_drawImage:function(t,n){var i=t.options.icon.options;this._context.drawImage(t.canvas_img,n.x-i.iconAnchor[0],n.y-i.iconAnchor[1],i.iconSize[0],i.iconSize[1])},_reset:function(){var n=this._map.containerPointToLayerPoint([0,0]);t.DomUtil.setPosition(this._canvas,n);var i=this._map.getSize();this._canvas.width=i.x,this._canvas.height=i.y,this._redraw()},_redraw:function(t){this._updateCanvasPosition(this._map.getCenter(),this._map.getZoom());var n=this;if(t&&this._context.clearRect(0,0,this._canvas.width,this._canvas.height),this._map&&this._latlngMarkers){var i=[];n._latlngMarkers.dirty/n._latlngMarkers.total>=.1&&(n._latlngMarkers.all().forEach(function(t){i.push(t)}),n._latlngMarkers.clear(),n._latlngMarkers.load(i),n._latlngMarkers.dirty=0,i=[]);var a=n._map.getBounds(),e={minX:a.getWest(),minY:a.getSouth(),maxX:a.getEast(),maxY:a.getNorth()};n._latlngMarkers.search(e).forEach(function(t){var a=n._map.latLngToContainerPoint(t.data.getLatLng()),e=t.data.options.icon.options.iconSize,r=e[0]/2,o=e[1]/2,s={minX:a.x-r,minY:a.y-o,maxX:a.x+r,maxY:a.y+o,data:t.data};i.push(s),n._drawMarker(t.data,a)}),this._markers.clear(),this._markers.load(i)}},_initCanvas:function(){this._canvas=t.DomUtil.create("canvas","leaflet-canvas-layer leaflet-layer ".concat(this._getClassName())),t.DomUtil.testProp(["transformOrigin","WebkitTransformOrigin","msTransformOrigin"]);var n=this._map.getSize();this._canvas.width=n.x,this._canvas.height=n.y,this._context=this._canvas.getContext("2d");var i=this._map.options.zoomAnimation&&t.Browser.any3d;t.DomUtil.addClass(this._canvas,"leaflet-zoom-"+(i?"animated":"hide"))},addOnClickListener:function(t){this._onClickListeners.push(t)},addOnHoverListener:function(t){this._onHoverListeners.push(t)},_executeListeners:function(t){if(this._markers){var n=this,i=t.containerPoint.x,a=t.containerPoint.y;n._openToolTip&&(n._openToolTip.closeTooltip(),delete n._openToolTip);var e=this._markers.search({minX:i,minY:a,maxX:i,maxY:a});e&&e.length>0?(n._map._container.style.cursor="pointer","click"===t.type&&(e[0].data.getPopup()&&e[0].data.openPopup(),n._onClickListeners.forEach(function(n){n(t,e)})),"mousemove"===t.type&&(e[0].data.getTooltip()&&(n._openToolTip=e[0].data,e[0].data.openTooltip()),n._onHoverListeners.forEach(function(n){n(t,e)}))):n._map._container.style.cursor=""}}});t.canvasLayer=function(t){return new n(t)}}}]); \ No newline at end of file diff --git a/dist/leaflet.canvas-layer.standalone.js b/dist/leaflet.canvas-layer.standalone.js new file mode 100644 index 0000000..61e3825 --- /dev/null +++ b/dist/leaflet.canvas-layer.standalone.js @@ -0,0 +1 @@ +!function(t){var e={};function a(n){if(e[n])return e[n].exports;var i=e[n]={i:n,l:!1,exports:{}};return t[n].call(i.exports,i,i.exports,a),i.l=!0,i.exports}a.m=t,a.c=e,a.d=function(t,e,n){a.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:n})},a.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},a.t=function(t,e){if(1&e&&(t=a(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(a.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var i in t)a.d(n,i,function(e){return t[e]}.bind(null,i));return n},a.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return a.d(e,"a",e),e},a.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},a.p="",a(a.s=4)}([,,,function(t,e,a){"use strict";t.exports=function(t){var e=(t.Layer?t.Layer:t.Class).extend({initialize:function(e){t.setOptions(this,e),this._onClickListeners=[],this._onHoverListeners=[]},setOptions:function(e){return t.setOptions(this,e),this.redraw()},redraw:function(){this._redraw(!0)},addMarkers:function(t){var e=this,a=[],n=[];t.forEach(function(t){if("markerPane"==t.options.pane&&t.options.icon){var i=t.getLatLng(),o=e._map.getBounds().contains(i),s=e._addMarker(t,i,o);!0===o&&a.push(s[0]),n.push(s[1])}else console.error("Layer isn't a marker")}),e._markers.load(a),e._latlngMarkers.load(n)},addMarker:function(t){var e=t.getLatLng(),a=this._map.getBounds().contains(e),n=this._addMarker(t,e,a);!0===a&&this._markers.insert(n[0]),this._latlngMarkers.insert(n[1])},addLayer:function(t){"markerPane"==t.options.pane&&t.options.icon?this.addMarker(t):console.error("Layer isn't a marker")},addLayers:function(t){this.addMarkers(t)},removeLayer:function(t){this.removeMarker(t,!0)},removeMarker:function(t,e){t.minX&&(t=t.data);var a=t.getLatLng(),n=this._map.getBounds().contains(a),i={minX:a.lng,minY:a.lat,maxX:a.lng,maxY:a.lat,data:t};this._latlngMarkers.remove(i,function(t,e){return t.data._leaflet_id===e.data._leaflet_id}),this._latlngMarkers.total--,this._latlngMarkers.dirty++,!0===n&&!0===e&&this._redraw(!0)},onAdd:function(t){this._map=t,this._canvas||this._initCanvas(),this.options.pane?this.getPane().appendChild(this._canvas):t._panes.overlayPane.appendChild(this._canvas),t.on("moveend",this._reset,this),t.on("resize",this._reset,this),t.on("click",this._executeListeners,this),t.on("mousemove",this._executeListeners,this),t._zoomAnimated&&t.on("zoomanim",this._animateZoom,this)},onRemove:function(t){this.options.pane?this.getPane().removeChild(this._canvas):t.getPanes().overlayPane.removeChild(this._canvas),t.off("click",this._executeListeners,this),t.off("mousemove",this._executeListeners,this),t.off("moveend",this._reset,this),t.off("resize",this._reset,this),t._zoomAnimated&&t.off("zoomanim",this._animateZoom,this)},addTo:function(t){return t.addLayer(this),this},clearLayers:function(){this._latlngMarkers=null,this._markers=null,this._redraw(!0)},_getClassName(){return this.options&&this.options.className?this.options.className:null},_animateZoom:function(t){t&&this._updateCanvasPosition(t.center,t.zoom)},_updateCanvasPosition(e,a){var n=this._map.getZoomScale(a),i=this._map._latLngBoundsToNewLayerBounds(this._map.getBounds(),a,e).min;t.DomUtil.setTransform(this._canvas,i,n)},_addMarker:function(e,a,n){e._map=this._map,this._markers||(this._markers=new rbush),this._latlngMarkers||(this._latlngMarkers=new rbush,this._latlngMarkers.dirty=0,this._latlngMarkers.total=0),t.Util.stamp(e);var i=this._map.latLngToContainerPoint(a),o=e.options.icon.options.iconSize,s=o[0]/2,r=o[1]/2,l=[{minX:i.x-s,minY:i.y-r,maxX:i.x+s,maxY:i.y+r,data:e},{minX:a.lng,minY:a.lat,maxX:a.lng,maxY:a.lat,data:e}];return this._latlngMarkers.dirty++,this._latlngMarkers.total++,!0===n&&this._drawMarker(e,i),l},_drawMarker:function(t,e){var a=this;if(this._imageLookup||(this._imageLookup={}),e||(e=a._map.latLngToContainerPoint(t.getLatLng())),this.options.userDrawFunc&&"function"==typeof this.options.userDrawFunc){const a=t.options.icon.options.iconSize;this.options.userDrawFunc(this,t,e,a)}else if(t.canvas_img)a._drawImage(t,e);else{let n=t.options.icon.options.iconUrl;if(a._imageLookup[n])t.canvas_img=a._imageLookup[n][0],!1===a._imageLookup[n][1]?a._imageLookup[n][2].push([t,e]):a._drawImage(t,e);else{let i=t.options.icon.options.html,o=window.URL||window.webkitURL||window,s=new Image,r=new Blob([i],{type:"image/svg+xml"}),l=o.createObjectURL(r);s.src=l,t.canvas_img=s,a._imageLookup[n]=[s,!1,[[t,e]]],s.onload=function(){a._imageLookup[n][1]=!0,a._imageLookup[n][2].forEach(function(t){a._drawImage(t[0],t[1])}),o.revokeObjectURL(l)}}}},_drawImage:function(t,e){var a=t.options.icon.options;this._context.drawImage(t.canvas_img,e.x-a.iconAnchor[0],e.y-a.iconAnchor[1],a.iconSize[0],a.iconSize[1])},_reset:function(){var e=this._map.containerPointToLayerPoint([0,0]);t.DomUtil.setPosition(this._canvas,e);var a=this._map.getSize();this._canvas.width=a.x,this._canvas.height=a.y,this._redraw()},_redraw:function(t){this._updateCanvasPosition(this._map.getCenter(),this._map.getZoom());var e=this;if(t&&this._context.clearRect(0,0,this._canvas.width,this._canvas.height),this._map&&this._latlngMarkers){var a=[];e._latlngMarkers.dirty/e._latlngMarkers.total>=.1&&(e._latlngMarkers.all().forEach(function(t){a.push(t)}),e._latlngMarkers.clear(),e._latlngMarkers.load(a),e._latlngMarkers.dirty=0,a=[]);var n=e._map.getBounds(),i={minX:n.getWest(),minY:n.getSouth(),maxX:n.getEast(),maxY:n.getNorth()};e._latlngMarkers.search(i).forEach(function(t){var n=e._map.latLngToContainerPoint(t.data.getLatLng()),i=t.data.options.icon.options.iconSize,o=i[0]/2,s=i[1]/2,r={minX:n.x-o,minY:n.y-s,maxX:n.x+o,maxY:n.y+s,data:t.data};a.push(r),e._drawMarker(t.data,n)}),this._markers.clear(),this._markers.load(a)}},_initCanvas:function(){this._canvas=t.DomUtil.create("canvas","leaflet-canvas-layer leaflet-layer ".concat(this._getClassName())),t.DomUtil.testProp(["transformOrigin","WebkitTransformOrigin","msTransformOrigin"]);var e=this._map.getSize();this._canvas.width=e.x,this._canvas.height=e.y,this._context=this._canvas.getContext("2d");var a=this._map.options.zoomAnimation&&t.Browser.any3d;t.DomUtil.addClass(this._canvas,"leaflet-zoom-"+(a?"animated":"hide"))},addOnClickListener:function(t){this._onClickListeners.push(t)},addOnHoverListener:function(t){this._onHoverListeners.push(t)},_executeListeners:function(t){if(this._markers){var e=this,a=t.containerPoint.x,n=t.containerPoint.y;e._openToolTip&&(e._openToolTip.closeTooltip(),delete e._openToolTip);var i=this._markers.search({minX:a,minY:n,maxX:a,maxY:n});i&&i.length>0?(e._map._container.style.cursor="pointer","click"===t.type&&(i[0].data.getPopup()&&i[0].data.openPopup(),e._onClickListeners.forEach(function(e){e(t,i)})),"mousemove"===t.type&&(i[0].data.getTooltip()&&(e._openToolTip=i[0].data,i[0].data.openTooltip()),e._onHoverListeners.forEach(function(e){e(t,i)}))):e._map._container.style.cursor=""}}});t.canvasLayer=function(t){return new e(t)}}},function(t,e,a){var n=a(3);window.L.CanvasLayer=n(L)}]); \ No newline at end of file