text: !function(t){var e={};function n(r){if(e[r])return e[r].exports;var a=e[r]={i:r,l:!1,exports:{}};return t[r].call(a.exports,a,a.exports,n),a.l=!0,a.exports}n.m=t,n.c=e,n.d=function(t,e,r){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:r})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var a in t)n.d(r,a,function(e){return t[e]}.bind(null,a));return r},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=0)}([function(t,e,n){"use strict";var r,a=n(1);new((r=a)&&r.__esModule?r:{default:r}).default(document.getElementById("myCanvas"))},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var r=function(){function t(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(e,n,r){return n&&t(e.prototype,n),r&&t(e,r),e}}();function a(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var o=function t(){a(this,t),this.desURL="http://a.tile.openstreetmap.org/",this.desTileSize=256,this.desOverlap=0,this.desFormat="png",this.offsetX=1,this.offsetY=1},i=function t(e,n){a(this,t),this.canvas=e,this.ctx=e.getContext("2d"),this.lastX=0,e.width,this.lastY=e.height/2,this.dragStart=!1,this.dragged=!1,this.level=1,this.maxLevel=n},s=function(){function t(e){var n=this;a(this,t),this.onMouseDown=function(t){document.body.style.mozUserSelect=document.body.style.webkitUserSelect=document.body.style.userSelect="none",n.drawingContext.lastX=t.offsetX||t.pageX-n.drawingContext.canvas.offsetLeft,n.drawingContext.lastY=t.offsetY||t.pageY-n.drawingContext.canvas.offsetTop,n.drawingContext.dragStart=n.drawingContext.ctx.transformedPoint(n.drawingContext.lastX,n.drawingContext.lastY),n.drawingContext.dragged=!1},this.onMouseMove=function(t){if(n.drawingContext.lastX=t.offsetX||t.pageX-n.drawingContext.canvas.offsetLeft,n.drawingContext.lastY=t.offsetY||t.pageY-n.drawingContext.canvas.offsetTop,n.drawingContext.dragged=!0,n.drawingContext.dragStart){var e=n.drawingContext.ctx.transformedPoint(n.drawingContext.lastX,n.drawingContext.lastY);n.drawingContext.ctx.translate(e.x-n.drawingContext.dragStart.x,e.y-n.drawingContext.dragStart.y),n.draw(n.drawingContext)}},this.onMouseUp=function(t){n.drawingContext.dragStart=null,n.drawingContext.dragged=!1},this.onMouseWheel=function(t){n.handleScroll(event,n)},this.onImageload=function(t,e,r){return function(){for(var a=n.getIntransit(e,r.col,r.row),o=null,i=0;i<a.length;i++)o=a[i],n.drawingContext.ctx.drawImage(t,o.x,o.y)}},this.addToTransit=function(t,e,r,a){var o=n.genKey(t,e,r);n.inTransit[o]||(n.inTransit[o]=[]),n.inTransit[o].push(a)},this.getIntransit=function(t,e,r){var a=n.genKey(t,e,r),o=n.inTransit[a];return delete n.inTransit[a],o},this.descriptor=new o,this.desURL="http://a.tile.openstreetmap.org/",this.desTileSize=256,this.desOverlap=0,this.desFormat="png",this.offsetX=1,this.offsetY=1,this.width=e.width,this.height=e.height,this.cache=new l,this.drawingContext=new i(e,this.getMaximumLevel()),this.maxLevel=this.getMaximumLevel(),this.coorh=new u,this.inTransit={},e.addEventListener("mousedown",this.onMouseDown,!1),e.addEventListener("mousemove",this.onMouseMove,!1),e.addEventListener("mouseup",this.onMouseUp,!1),e.addEventListener("DOMMouseScroll",this.onMouseWheel,!1),e.addEventListener("mousewheel",this.onMouseWheel,!1),this.trackTransforms(this.drawingContext.ctx),this.draw(this.drawingContext),this.debounceDraw=this.debounce(this.draw,100)}return r(t,[{key:"setUrl",value:function(t){var e=null;return(e=new XMLHttpRequest).open("GET",t,!0),e.onreadystatechange(),e.send(),e.responseText}},{key:"handleScroll",value:function(t,e){var n=t.wheelDelta?t.wheelDelta/40:t.detail?-t.detail:0;return n&&e.zoom(n,e),t.preventDefault()&&!1}},{key:"zoom",value:function(t,e){var n=1;if(t>0?(n=2,e.drawingContext.level=e.drawingContext.level+1):(n=.5,e.drawingContext.level=e.drawingContext.level-1),e.drawingContext.level>e.drawingContext.maxLevel)e.drawingContext.level=e.drawingContext.maxLevel;else if(e.drawingContext.level<2)e.drawingContext.level=2;else{var r=e.drawingContext.ctx.transformedPoint(e.drawingContext.lastX,e.drawingContext.lastY);e.drawingContext.ctx.translate(r.x,r.y),e.drawingContext.ctx.translate(-r.x*n,-r.y*n),this.debounceDraw(e.drawingContext)}}},{key:"debounce",value:function(t,e,n){var r;return function(){var a=this,o=arguments,i=n&&!r;clearTimeout(r),r=setTimeout(function(){r=null,n||t.apply(a,o)},e),i&&t.apply(a,o)}}},{key:"getUrlId",value:function(t,e,n){return{col:this.normalize(t,n),row:this.normalize(e,n)}}},{key:"normalize",value:function(t,e){var n=t;return t>=e?n=t%=e:t<0&&(n=-0==(t%=e)?0:e+t),n}},{key:"genKey",value:function(t,e,n,r){return"L"+t+"-C"+e+"-R"+n}},{key:"draw",value:function(t){this.clearCanvas(t);for(var e=this.getLevelRowCol(t.level),n=this.getVisibleRowCols(t.ctx,t.level,e.cols,e.rows,this.desTileSize),r={},a={},o=n.sc;o<n.ec;o++)for(var i=n.sr;i<n.er;i++){r=this.getUrlId(o,i,e.cols);var s=this.cache.getFromCache(t.level,r.col,r.row);a=this.getTilePosition(o,i),s?0==s.height?this.addToTransit(t.level,r.col,r.row,a):t.ctx.drawImage(s,a.x,a.y):((s=new Image).onload=this.onImageload(s,t.level,r),this.addToTransit(t.level,r.col,r.row,a),s.src=this.getTileURL(t.level,r.col,r.row),this.cache.putToCache(t.level,r.col,r.row,s))}}},{key:"drawPoint",value:function(t,e){t.ctx.beginPath(),t.ctx.arc(e.x,e.y,5,0,2*Math.PI,!1),t.ctx.fillStyle="grey",t.ctx.fill(),t.ctx.lineWidth=1,t.ctx.strokeStyle="#003300",t.ctx.stroke()}},{key:"trackTransforms",value:function(t){var e=document.createElementNS("http://www.w3.org/2000/svg","svg"),n=e.createSVGMatrix();t.getTransform=function(){return n};var r=[],a=t.save;t.save=function(){return r.push(n.translate(0,0)),a.call(t)};var o=t.restore;t.restore=function(){return n=r.pop(),o.call(t)};var i=t.scale;t.scale=function(e,r){return n=n.scaleNonUniform(e,r),i.call(t,e,r)};var s=t.rotate;t.rotate=function(e){return n=n.rotate(180*e/Math.PI),s.call(t,e)};var l=t.translate;t.translate=function(e,r){return n=n.translate(e,r),l.call(t,e,r)};var u=t.transform;t.transform=function(r,a,o,i,s,l){var c=e.createSVGMatrix();return c.a=r,c.b=a,c.c=o,c.d=i,c.e=s,c.f=l,n=n.multiply(c),u.call(t,r,a,o,i,s,l)};var c=t.setTransform;t.setTransform=function(e,r,a,o,i,s){return n.a=e,n.b=r,n.c=a,n.d=o,n.e=i,n.f=s,c.call(t,e,r,a,o,i,s)};var h=e.createSVGPoint();t.transformedPoint=function(t,e){return h.x=t,h.y=e,h.matrixTransform(n.inverse())}}},{key:"clearCanvas",value:function(t){var e=t.ctx.transformedPoint(0,0),n=t.ctx.transformedPoint(t.canvas.width,t.canvas.height);t.ctx.clearRect(e.x,e.y,n.x-e.x,n.y-e.y)}},{key:"getLevelRowCol",value:function(t){var e=Math.pow(2,t);return{cols:e,rows:e}}},{key:"getVisibleRowCols",value:function(t,e,n,r,a){var o=t.transformedPoint(0,0),i=new Object;return i.sc=Math.ceil(o.x/a)-1,i.ec=Math.ceil((this.width+o.x)/a),i.sr=Math.ceil(o.y/a)-1,i.er=Math.ceil((this.height+o.y)/a),i}},{key:"getMaximumLevel",value:function(){return 19}},{key:"getTileURL",value:function(t,e,n){return this.desURL+t+"/"+e+"/"+n+"."+this.desFormat}},{key:"getTilePosition",value:function(t,e){var n={x:0,y:0},r=0==t?0:this.desOverlap,a=0==e?0:this.desOverlap;return n.x=t*this.desTileSize-r,n.y=e*this.desTileSize-a,n}},{key:"flush",value:function(){this.cache.flush()}}]),t}(),l=function(){function t(){a(this,t),this.cacheImages=new Object}return r(t,[{key:"getFromCache",value:function(t,e,n){var r="R"+t+"|"+e+"|"+n;return this.cacheImages[r]}},{key:"putToCache",value:function(t,e,n,r){var a="R"+t+"|"+e+"|"+n;this.cacheImages[a]=r}},{key:"flush",value:function(){this.cacheImages=null,this.cacheImages=new Object}}]),t}(),u=function(){function t(){a(this,t),this.maxLat=90,this.minLat=-90,this.maxLong=180,this.minLong=-180}return r(t,[{key:"LatLongtoPoint",value:function(t,e,n){var r={x:0,y:0},a=this.getPixelsLevel(n);return r.x=this.transformLong(e,a),r.y=this.transformLat(t,a),r}},{key:"getPixelsLevel",value:function(t){return 256*Math.pow(2,t)}},{key:"transformLong",value:function(t,e){return(t+180)*(e/360)}},{key:"transformLat",value:function(t,e){var n=t*Math.PI/180;return e/2-e*Math.log(Math.tan(Math.PI/4+n/2))/(2*Math.PI)}},{key:"PointtoLatLong",value:function(t,e,n){var r={lon:0,lat:0},a=this.getPixelsLevel(n);return r.x=this.transformLong(e,a),r.y=this.transformLat(t,a),r}},{key:"transformX",value:function(t,e){return longitude=(e/360*180-t)/(-e/360),longitude}},{key:"transformY",value:function(t,e){var n=latitude*Math.PI/180;return mercN=Math.log(Math.tan(Math.PI/4+n/2)),e/2-e*mercN/(2*Math.PI)}}]),t}();e.default=s}]);