openlayer路线箭头

// 用于设置线串所在的矢量图层样式的函数
	var styleFunction = function(feature,res){
        //轨迹线图形
       var trackLine= feature.getGeometry();
       var styles = [
          new ol.style.Style({
            stroke: new ol.style.Stroke({
              color: '#2E8B57',
              width: 10
            })
          })
        ];
        //对segments建立btree索引
        let tree= Mapbox.rbush();//路段数
        trackLine.forEachSegment(function(start, end) {
            var dx = end[0] - start[0];
            var dy = end[1] - start[1];
            //计算每个segment的方向，即箭头旋转方向
            let rotation = Math.atan2(dy, dx);
            let geom=new ol.geom.LineString([start,end]);
            let extent=geom.getExtent();
            var item = {
              minX: extent[0],
              minY: extent[1],
              maxX: extent[2],
              maxY: extent[3],
              geom: geom,
              rotation:rotation
            };
            tree.insert(item);
        });
        //轨迹地理长度
        let length=trackLine.getLength();
        //像素间隔步长
        let stpes=40;//像素步长间隔
        //将像素步长转实际地理距离步长
        let geo_steps=stpes*res;
        //箭头总数
        let arrowsNum=parseInt(length/geo_steps);
        for(let i=1;i<arrowsNum;i++){
            let arraw_coor=trackLine.getCoordinateAt(i*1.0/arrowsNum);
            let tol=0.0001;//查询设置的点的容差，测试地图单位是米。如果是4326坐标系单位为度的话，改成0.0001.
            let arraw_coor_buffer=[arraw_coor[0]-tol,arraw_coor[1]-tol,arraw_coor[0]+tol,arraw_coor[1]+tol];
            //进行btree查询
            var treeSearch = tree.search({
              minX: arraw_coor_buffer[0],
              minY: arraw_coor_buffer[1],
              maxX: arraw_coor_buffer[2],
              maxY: arraw_coor_buffer[3]
            });
            let arrow_rotation;
            //只查询一个，那么肯定是它了，直接返回
            if(treeSearch.length==1)
              arrow_rotation=treeSearch[0].rotation;
            else if(treeSearch.length>1){
                let results=treeSearch.filter(function(item){
                  //箭头点与segment相交，返回结果。该方法实测不是很准，可能是计算中间结果
                  //保存到小数精度导致查询有点问题
                  // if(item.geom.intersectsCoordinate(arraw_coor))
                  //   return true;

                  //换一种方案，设置一个稍小的容差，消除精度问题
                  let _tol=1;//消除精度误差的容差
                  if(item.geom.intersectsExtent([arraw_coor[0]-_tol,arraw_coor[1]-_tol,arraw_coor[0]+_tol,arraw_coor[1]+_tol]))
                    return true;
                })
                if(results.length>0)
                  arrow_rotation=results[0].rotation;
            }
            styles.push(new ol.style.Style({
                geometry: new ol.geom.Point(arraw_coor),
                image: new ol.style.Icon({
                  src: 'img/jiantou2.png',
                  anchor: [0.75, 0.5],
                  rotateWithView: true,
                  rotation: -arrow_rotation
                })
            }));
        }
        return styles;
      }

　　

 

 引入算法库插件代码为：

!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.Mapbox=e():t.Mapbox=e()}(window,function(){return function(t){var e={};function i(n){if(e[n])return e[n].exports;var o=e[n]={i:n,l:!1,exports:{}};return t[n].call(o.exports,o,o.exports,i),o.l=!0,o.exports}return i.m=t,i.c=e,i.d=function(t,e,n){i.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:n})},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,e){if(1&e&&(t=i(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(i.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)i.d(n,o,function(e){return t[e]}.bind(null,o));return n},i.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return i.d(e,"a",e),e},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},i.p="",i(i.s=0)}([function(t,e,i){t.exports=i(3)},function(t,e,i){"use strict";t.exports=o,t.exports.default=o;var n=i(2);function o(t,e){if(!(this instanceof o))return new o(t,e);this._maxEntries=Math.max(4,t||9),this._minEntries=Math.max(2,Math.ceil(.4*this._maxEntries)),e&&this._initFormat(e),this.clear()}function r(t,e,i){if(!i)return e.indexOf(t);for(var n=0;n<e.length;n++)if(i(t,e[n]))return n;return-1}function a(t,e){h(t,0,t.children.length,e,t)}function h(t,e,i,n,o){o||(o=g(null)),o.minX=1/0,o.minY=1/0,o.maxX=-1/0,o.maxY=-1/0;for(var r,a=e;a<i;a++)r=t.children[a],l(o,t.leaf?n(r):r);return o}function l(t,e){return t.minX=Math.min(t.minX,e.minX),t.minY=Math.min(t.minY,e.minY),t.maxX=Math.max(t.maxX,e.maxX),t.maxY=Math.max(t.maxY,e.maxY),t}function s(t,e){return t.minX-e.minX}function c(t,e){return t.minY-e.minY}function u(t){return(t.maxX-t.minX)*(t.maxY-t.minY)}function p(t){return t.maxX-t.minX+(t.maxY-t.minY)}function f(t,e){return(Math.max(e.maxX,t.maxX)-Math.min(e.minX,t.minX))*(Math.max(e.maxY,t.maxY)-Math.min(e.minY,t.minY))}function d(t,e){var i=Math.max(t.minX,e.minX),n=Math.max(t.minY,e.minY),o=Math.min(t.maxX,e.maxX),r=Math.min(t.maxY,e.maxY);return Math.max(0,o-i)*Math.max(0,r-n)}function y(t,e){return t.minX<=e.minX&&t.minY<=e.minY&&e.maxX<=t.maxX&&e.maxY<=t.maxY}function x(t,e){return e.minX<=t.maxX&&e.minY<=t.maxY&&e.maxX>=t.minX&&e.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 m(t,e,i,o,r){for(var a,h=[e,i];h.length;)(i=h.pop())-(e=h.pop())<=o||(a=e+Math.ceil((i-e)/o/2)*o,n(t,a,e,i,r),h.push(e,a,a,i))}o.prototype={all:function(){return this._all(this.data,[])},search:function(t){var e=this.data,i=[],n=this.toBBox;if(!x(t,e))return i;for(var o,r,a,h,l=[];e;){for(o=0,r=e.children.length;o<r;o++)a=e.children[o],x(t,h=e.leaf?n(a):a)&&(e.leaf?i.push(a):y(t,h)?this._all(a,i):l.push(a));e=l.pop()}return i},collides:function(t){var e=this.data,i=this.toBBox;if(!x(t,e))return!1;for(var n,o,r,a,h=[];e;){for(n=0,o=e.children.length;n<o;n++)if(r=e.children[n],x(t,a=e.leaf?i(r):r)){if(e.leaf||y(t,a))return!0;h.push(r)}e=h.pop()}return!1},load:function(t){if(!t||!t.length)return this;if(t.length<this._minEntries){for(var e=0,i=t.length;e<i;e++)this.insert(t[e]);return this}var n=this._build(t.slice(),0,t.length-1,0);if(this.data.children.length)if(this.data.height===n.height)this._splitRoot(this.data,n);else{if(this.data.height<n.height){var o=this.data;this.data=n,n=o}this._insert(n,this.data.height-n.height-1,!0)}else this.data=n;return this},insert:function(t){return t&&this._insert(t,this.data.height-1),this},clear:function(){return this.data=g([]),this},remove:function(t,e){if(!t)return this;for(var i,n,o,a,h=this.data,l=this.toBBox(t),s=[],c=[];h||s.length;){if(h||(h=s.pop(),n=s[s.length-1],i=c.pop(),a=!0),h.leaf&&-1!==(o=r(t,h.children,e)))return h.children.splice(o,1),s.push(h),this._condense(s),this;a||h.leaf||!y(h,l)?n?(i++,h=n.children[i],a=!1):h=null:(s.push(h),c.push(i),i=0,n=h,h=h.children[0])}return this},toBBox:function(t){return t},compareMinX:s,compareMinY:c,toJSON:function(){return this.data},fromJSON:function(t){return this.data=t,this},_all:function(t,e){for(var i=[];t;)t.leaf?e.push.apply(e,t.children):i.push.apply(i,t.children),t=i.pop();return e},_build:function(t,e,i,n){var o,r=i-e+1,h=this._maxEntries;if(r<=h)return a(o=g(t.slice(e,i+1)),this.toBBox),o;n||(n=Math.ceil(Math.log(r)/Math.log(h)),h=Math.ceil(r/Math.pow(h,n-1))),(o=g([])).leaf=!1,o.height=n;var l,s,c,u,p=Math.ceil(r/h),f=p*Math.ceil(Math.sqrt(h));for(m(t,e,i,f,this.compareMinX),l=e;l<=i;l+=f)for(m(t,l,c=Math.min(l+f-1,i),p,this.compareMinY),s=l;s<=c;s+=p)u=Math.min(s+p-1,c),o.children.push(this._build(t,s,u,n-1));return a(o,this.toBBox),o},_chooseSubtree:function(t,e,i,n){for(var o,r,a,h,l,s,c,p;n.push(e),!e.leaf&&n.length-1!==i;){for(c=p=1/0,o=0,r=e.children.length;o<r;o++)l=u(a=e.children[o]),(s=f(t,a)-l)<p?(p=s,c=l<c?l:c,h=a):s===p&&l<c&&(c=l,h=a);e=h||e.children[0]}return e},_insert:function(t,e,i){var n=this.toBBox,o=i?t:n(t),r=[],a=this._chooseSubtree(o,this.data,e,r);for(a.children.push(t),l(a,o);e>=0&&r[e].children.length>this._maxEntries;)this._split(r,e),e--;this._adjustParentBBoxes(o,r,e)},_split:function(t,e){var i=t[e],n=i.children.length,o=this._minEntries;this._chooseSplitAxis(i,o,n);var r=this._chooseSplitIndex(i,o,n),h=g(i.children.splice(r,i.children.length-r));h.height=i.height,h.leaf=i.leaf,a(i,this.toBBox),a(h,this.toBBox),e?t[e-1].children.push(h):this._splitRoot(i,h)},_splitRoot:function(t,e){this.data=g([t,e]),this.data.height=t.height+1,this.data.leaf=!1,a(this.data,this.toBBox)},_chooseSplitIndex:function(t,e,i){var n,o,r,a,l,s,c,p;for(s=c=1/0,n=e;n<=i-e;n++)a=d(o=h(t,0,n,this.toBBox),r=h(t,n,i,this.toBBox)),l=u(o)+u(r),a<s?(s=a,p=n,c=l<c?l:c):a===s&&l<c&&(c=l,p=n);return p},_chooseSplitAxis:function(t,e,i){var n=t.leaf?this.compareMinX:s,o=t.leaf?this.compareMinY:c;this._allDistMargin(t,e,i,n)<this._allDistMargin(t,e,i,o)&&t.children.sort(n)},_allDistMargin:function(t,e,i,n){t.children.sort(n);var o,r,a=this.toBBox,s=h(t,0,e,a),c=h(t,i-e,i,a),u=p(s)+p(c);for(o=e;o<i-e;o++)r=t.children[o],l(s,t.leaf?a(r):r),u+=p(s);for(o=i-e-1;o>=e;o--)r=t.children[o],l(c,t.leaf?a(r):r),u+=p(c);return u},_adjustParentBBoxes:function(t,e,i){for(var n=i;n>=0;n--)l(e[n],t)},_condense:function(t){for(var e,i=t.length-1;i>=0;i--)0===t[i].children.length?i>0?(e=t[i-1].children).splice(e.indexOf(t[i]),1):this.clear():a(t[i],this.toBBox)},_initFormat:function(t){var e=["return a"," - b",";"];this.compareMinX=new Function("a","b",e.join(t[0])),this.compareMinY=new Function("a","b",e.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,e,i){"use strict";function n(t,e,i){var n=t[e];t[e]=t[i],t[i]=n}function o(t,e){return t<e?-1:t>e?1:0}t.exports=function t(e,i,r,a,h){r=r||0;a=a||e.length-1;h=h||o;for(;a>r;){if(a-r>600){var l=a-r+1,s=i-r+1,c=Math.log(l),u=.5*Math.exp(2*c/3),p=.5*Math.sqrt(c*u*(l-u)/l)*(s-l/2<0?-1:1),f=Math.max(r,Math.floor(i-s*u/l+p)),d=Math.min(a,Math.floor(i+(l-s)*u/l+p));t(e,i,f,d,h)}var y=e[i],x=r,g=a;for(n(e,r,i),h(e[a],y)>0&&n(e,r,a);x<g;){for(n(e,x,g),x++,g--;h(e[x],y)<0;)x++;for(;h(e[g],y)>0;)g--}0===h(e[r],y)?n(e,r,g):n(e,++g,a),g<=i&&(r=g+1),i<=g&&(a=g-1)}}},function(t,e,i){"use strict";i.r(e);var n={};i.r(n),i.d(n,"tk",function(){return at}),i.d(n,"basicStyle",function(){return ht}),i.d(n,"lightStyle",function(){return lt}),i.d(n,"darkStyle",function(){return st}),i.d(n,"emptyStyle",function(){return ct});var o=function t(){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t)};o.DroneParam={MAXSPEED:15,FIRINGTIME:800,LIFE:10,RANGE:.2},o.Images={Plane:"../assets/plane"},o.FileType={png:"IMG",jpg:"IMG",gif:"IMG",mp4:"VIDEO"},o.SpritesUrl="https://alex2wong.github.io/mapbox-plugins/assets/sprite",o.Sprites={"airfield-15":{width:21,height:21,x:0,y:0,pixelRatio:1},"airport-15":{width:21,height:21,x:21,y:0,pixelRatio:1},"alcohol-shop-15":{width:21,height:21,x:0,y:21,pixelRatio:1},"amusement-park-15":{width:21,height:21,x:21,y:21,pixelRatio:1},"aquarium-15":{width:21,height:21,x:42,y:0,pixelRatio:1},"art-gallery-15":{width:21,height:21,x:63,y:0,pixelRatio:1},"attraction-15":{width:21,height:21,x:42,y:21,pixelRatio:1},"bakery-15":{width:21,height:21,x:63,y:21,pixelRatio:1},"bank-15":{width:21,height:21,x:0,y:42,pixelRatio:1},"bar-15":{width:21,height:21,x:21,y:42,pixelRatio:1},"beer-15":{width:21,height:21,x:42,y:42,pixelRatio:1},"bicycle-15":{width:21,height:21,x:63,y:42,pixelRatio:1},"bicycle-share-15":{width:21,height:21,x:0,y:63,pixelRatio:1},"bus-15":{width:21,height:21,x:21,y:63,pixelRatio:1},"cafe-15":{width:21,height:21,x:42,y:63,pixelRatio:1},"campsite-15":{width:21,height:21,x:63,y:63,pixelRatio:1},"car-15":{width:21,height:21,x:84,y:0,pixelRatio:1},"castle-15":{width:21,height:21,x:105,y:0,pixelRatio:1},"cemetery-15":{width:21,height:21,x:126,y:0,pixelRatio:1},"cinema-15":{width:21,height:21,x:147,y:0,pixelRatio:1},"circle-15":{width:21,height:21,x:84,y:21,pixelRatio:1},"circle-stroked-15":{width:21,height:21,x:105,y:21,pixelRatio:1},"clothing-store-15":{width:21,height:21,x:126,y:21,pixelRatio:1},"college-15":{width:21,height:21,x:147,y:21,pixelRatio:1},"dentist-15":{width:21,height:21,x:84,y:42,pixelRatio:1},"doctor-15":{width:21,height:21,x:105,y:42,pixelRatio:1},"dog-park-15":{width:21,height:21,x:126,y:42,pixelRatio:1},"drinking-water-15":{width:21,height:21,x:147,y:42,pixelRatio:1},"embassy-15":{width:21,height:21,x:84,y:63,pixelRatio:1},"entrance-15":{width:21,height:21,x:105,y:63,pixelRatio:1},"fast-food-15":{width:21,height:21,x:126,y:63,pixelRatio:1},"ferry-15":{width:21,height:21,x:147,y:63,pixelRatio:1},"fire-station-15":{width:21,height:21,x:0,y:84,pixelRatio:1},"fuel-15":{width:21,height:21,x:21,y:84,pixelRatio:1},"garden-15":{width:21,height:21,x:42,y:84,pixelRatio:1},"golf-15":{width:21,height:21,x:63,y:84,pixelRatio:1},"grocery-15":{width:21,height:21,x:84,y:84,pixelRatio:1},"harbor-15":{width:21,height:21,x:105,y:84,pixelRatio:1},"heliport-15":{width:21,height:21,x:126,y:84,pixelRatio:1},"hospital-15":{width:21,height:21,x:147,y:84,pixelRatio:1},"ice-cream-15":{width:21,height:21,x:0,y:105,pixelRatio:1},"information-15":{width:21,height:21,x:21,y:105,pixelRatio:1},"laundry-15":{width:21,height:21,x:42,y:105,pixelRatio:1},"library-15":{width:21,height:21,x:63,y:105,pixelRatio:1},"lodging-15":{width:21,height:21,x:84,y:105,pixelRatio:1},"marker-15":{width:21,height:21,x:105,y:105,pixelRatio:1},"monument-15":{width:21,height:21,x:126,y:105,pixelRatio:1},"mountain-15":{width:21,height:21,x:147,y:105,pixelRatio:1},"museum-15":{width:21,height:21,x:0,y:126,pixelRatio:1},"music-15":{width:21,height:21,x:21,y:126,pixelRatio:1},"park-15":{width:21,height:21,x:42,y:126,pixelRatio:1},"pharmacy-15":{width:21,height:21,x:63,y:126,pixelRatio:1},"picnic-site-15":{width:21,height:21,x:84,y:126,pixelRatio:1},"place-of-worship-15":{width:21,height:21,x:105,y:126,pixelRatio:1},"playground-15":{width:21,height:21,x:126,y:126,pixelRatio:1},"police-15":{width:21,height:21,x:147,y:126,pixelRatio:1},"post-15":{width:21,height:21,x:0,y:147,pixelRatio:1},"prison-15":{width:21,height:21,x:21,y:147,pixelRatio:1},"rail-15":{width:21,height:21,x:42,y:147,pixelRatio:1},"rail-light-15":{width:21,height:21,x:63,y:147,pixelRatio:1},"rail-metro-15":{width:21,height:21,x:84,y:147,pixelRatio:1},"religious-christian-15":{width:21,height:21,x:105,y:147,pixelRatio:1},"religious-jewish-15":{width:21,height:21,x:126,y:147,pixelRatio:1},"religious-muslim-15":{width:21,height:21,x:147,y:147,pixelRatio:1},"restaurant-15":{width:21,height:21,x:168,y:0,pixelRatio:1},"rocket-15":{width:21,height:21,x:189,y:0,pixelRatio:1},"school-15":{width:21,height:21,x:210,y:0,pixelRatio:1},"shop-15":{width:21,height:21,x:231,y:0,pixelRatio:1},"stadium-15":{width:21,height:21,x:252,y:0,pixelRatio:1},"star-15":{width:21,height:21,x:273,y:0,pixelRatio:1},"suitcase-15":{width:21,height:21,x:294,y:0,pixelRatio:1},"swimming-15":{width:21,height:21,x:315,y:0,pixelRatio:1},"theatre-15":{width:21,height:21,x:168,y:21,pixelRatio:1},"toilet-15":{width:21,height:21,x:189,y:21,pixelRatio:1},"town-hall-15":{width:21,height:21,x:210,y:21,pixelRatio:1},"triangle-15":{width:21,height:21,x:231,y:21,pixelRatio:1},"triangle-stroked-15":{width:21,height:21,x:252,y:21,pixelRatio:1},"veterinary-15":{width:21,height:21,x:273,y:21,pixelRatio:1},"volcano-15":{width:21,height:21,x:294,y:21,pixelRatio:1},"zoo-15":{width:21,height:21,x:315,y:21,pixelRatio:1},"airfield-11":{width:17,height:17,x:168,y:42,pixelRatio:1},"airport-11":{width:17,height:17,x:185,y:42,pixelRatio:1},"alcohol-shop-11":{width:17,height:17,x:202,y:42,pixelRatio:1},"amusement-park-11":{width:17,height:17,x:219,y:42,pixelRatio:1},"aquarium-11":{width:17,height:17,x:236,y:42,pixelRatio:1},"art-gallery-11":{width:17,height:17,x:253,y:42,pixelRatio:1},"attraction-11":{width:17,height:17,x:270,y:42,pixelRatio:1},"bakery-11":{width:17,height:17,x:287,y:42,pixelRatio:1},"bank-11":{width:17,height:17,x:304,y:42,pixelRatio:1},"bar-11":{width:17,height:17,x:168,y:63,pixelRatio:1},"beer-11":{width:17,height:17,x:185,y:63,pixelRatio:1},"bicycle-11":{width:17,height:17,x:202,y:63,pixelRatio:1},"bicycle-share-11":{width:17,height:17,x:219,y:63,pixelRatio:1},"bus-11":{width:17,height:17,x:236,y:63,pixelRatio:1},"cafe-11":{width:17,height:17,x:253,y:63,pixelRatio:1},"campsite-11":{width:17,height:17,x:270,y:63,pixelRatio:1},"car-11":{width:17,height:17,x:287,y:63,pixelRatio:1},"castle-11":{width:17,height:17,x:304,y:63,pixelRatio:1},"cemetery-11":{width:17,height:17,x:168,y:84,pixelRatio:1},"cinema-11":{width:17,height:17,x:185,y:84,pixelRatio:1},"circle-11":{width:17,height:17,x:202,y:84,pixelRatio:1},"circle-stroked-11":{width:17,height:17,x:219,y:84,pixelRatio:1},"clothing-store-11":{width:17,height:17,x:236,y:84,pixelRatio:1},"college-11":{width:17,height:17,x:253,y:84,pixelRatio:1},"dentist-11":{width:17,height:17,x:270,y:84,pixelRatio:1},"doctor-11":{width:17,height:17,x:287,y:84,pixelRatio:1},"dog-park-11":{width:17,height:17,x:304,y:84,pixelRatio:1},"drinking-water-11":{width:17,height:17,x:168,y:105,pixelRatio:1},"embassy-11":{width:17,height:17,x:185,y:105,pixelRatio:1},"entrance-11":{width:17,height:17,x:202,y:105,pixelRatio:1},"fast-food-11":{width:17,height:17,x:219,y:105,pixelRatio:1},"ferry-11":{width:17,height:17,x:236,y:105,pixelRatio:1},"fire-station-11":{width:17,height:17,x:253,y:105,pixelRatio:1},"fuel-11":{width:17,height:17,x:270,y:105,pixelRatio:1},"garden-11":{width:17,height:17,x:287,y:105,pixelRatio:1},"golf-11":{width:17,height:17,x:304,y:105,pixelRatio:1},"grocery-11":{width:17,height:17,x:168,y:126,pixelRatio:1},"harbor-11":{width:17,height:17,x:185,y:126,pixelRatio:1},"heliport-11":{width:17,height:17,x:202,y:126,pixelRatio:1},"hospital-11":{width:17,height:17,x:219,y:126,pixelRatio:1},"ice-cream-11":{width:17,height:17,x:236,y:126,pixelRatio:1},"information-11":{width:17,height:17,x:253,y:126,pixelRatio:1},"laundry-11":{width:17,height:17,x:270,y:126,pixelRatio:1},"library-11":{width:17,height:17,x:287,y:126,pixelRatio:1},"lodging-11":{width:17,height:17,x:304,y:126,pixelRatio:1},"marker-11":{width:17,height:17,x:168,y:147,pixelRatio:1},"monument-11":{width:17,height:17,x:185,y:147,pixelRatio:1},"mountain-11":{width:17,height:17,x:202,y:147,pixelRatio:1},"museum-11":{width:17,height:17,x:219,y:147,pixelRatio:1},"music-11":{width:17,height:17,x:236,y:147,pixelRatio:1},"park-11":{width:17,height:17,x:253,y:147,pixelRatio:1},"pharmacy-11":{width:17,height:17,x:270,y:147,pixelRatio:1},"picnic-site-11":{width:17,height:17,x:287,y:147,pixelRatio:1},"place-of-worship-11":{width:17,height:17,x:304,y:147,pixelRatio:1},"playground-11":{width:17,height:17,x:0,y:168,pixelRatio:1},"police-11":{width:17,height:17,x:17,y:168,pixelRatio:1},"post-11":{width:17,height:17,x:34,y:168,pixelRatio:1},"prison-11":{width:17,height:17,x:51,y:168,pixelRatio:1},"rail-11":{width:17,height:17,x:68,y:168,pixelRatio:1},"rail-light-11":{width:17,height:17,x:85,y:168,pixelRatio:1},"rail-metro-11":{width:17,height:17,x:102,y:168,pixelRatio:1},"religious-christian-11":{width:17,height:17,x:119,y:168,pixelRatio:1},"religious-jewish-11":{width:17,height:17,x:136,y:168,pixelRatio:1},"religious-muslim-11":{width:17,height:17,x:153,y:168,pixelRatio:1},"restaurant-11":{width:17,height:17,x:170,y:168,pixelRatio:1},"rocket-11":{width:17,height:17,x:187,y:168,pixelRatio:1},"school-11":{width:17,height:17,x:204,y:168,pixelRatio:1},"shop-11":{width:17,height:17,x:221,y:168,pixelRatio:1},"stadium-11":{width:17,height:17,x:238,y:168,pixelRatio:1},"star-11":{width:17,height:17,x:255,y:168,pixelRatio:1},"suitcase-11":{width:17,height:17,x:272,y:168,pixelRatio:1},"swimming-11":{width:17,height:17,x:289,y:168,pixelRatio:1},"theatre-11":{width:17,height:17,x:306,y:168,pixelRatio:1},"toilet-11":{width:17,height:17,x:0,y:185,pixelRatio:1},"town-hall-11":{width:17,height:17,x:17,y:185,pixelRatio:1},"triangle-11":{width:17,height:17,x:34,y:185,pixelRatio:1},"triangle-stroked-11":{width:17,height:17,x:51,y:185,pixelRatio:1},"veterinary-11":{width:17,height:17,x:68,y:185,pixelRatio:1},"volcano-11":{width:17,height:17,x:85,y:185,pixelRatio:1},"zoo-11":{width:17,height:17,x:102,y:185,pixelRatio:1},"dot-11":{width:11,height:11,x:323,y:168,pixelRatio:1},"dot-10":{width:10,height:10,x:119,y:185,pixelRatio:1}},o.PK="pk.eyJ1IjoiaHVhbmd5aXhpdSIsImEiOiI2WjVWR1hFIn0.1P90Q-tkbHS38BvnrhTI6w";var r=function t(e){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.id,this.direciton=e.direction?e.direction:0,this.spoint={type:"Point",coordinates:[0,0]},this.spoint.coordinates[0]=e.lon,this.spoint.coordinates[1]=e.lat};function a(t){return(a="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function h(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}var l=function(){function t(){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t)}return function(t,e,i){e&&h(t.prototype,e),i&&h(t,i)}(t,null,[{key:"getAnimationFrame",value:function(){}},{key:"getJSON",value:function(t,e,i){return new Promise(function(e,i){var n=new XMLHttpRequest;n.open("GET",t),n.onreadystatechange=function(){if(4!==this.readyState)return;200===this.status?e(this.response):i(new Error(this.statusText))},n.responseType="json",n.setRequestHeader("Accept","application/json"),n.send()})}},{key:"deepClone",value:function(t){var e=this,i={};if("object"!==a(t))return null;for(var n in t)t.hasOwnProperty(n)&&"object"!==a(t[n])?i[n]=t[n]:t[n].constructor.toString().indexOf("Object")>0?i[n]=this.deepClone(t[n]):Array.isArray(t[n])&&(i[n]=t[n].map(function(t){return"object"!==a(t)?t:e.deepClone(t)}));return i}},{key:"isChanged",value:function(t,e){return JSON.stringify(t)!=JSON.stringify(e)&&(console.warn("chartData changed.."),!0)}},{key:"setIconDiv",value:function(t,e){var i=o.Sprites;if(e&&i[e]){var n=i[e],r=document.createElement("div");r.style.width=n.width+"px",r.style.height=n.height+"px",r.style.overflow="hidden";var a=document.createElement("img");a.src=o.SpritesUrl+".png",a.style.marginLeft="-"+n.x+"px",a.style.marginTop="-"+n.y+"px",r.appendChild(a),t.appendChild(r)}}},{key:"setResource",value:function(t,e){if(e instanceof Array)for(var i=0;i<e.length;i++){var n=this.getFiletype(e[i]);if(""!==n){var o=document.createElement(n);o.style.width=o.style.height=t.style.width=t.style.height="60px",o.style.borderRadius="50%",o.src=e[i],t.style.borderRadius="50%",t.appendChild(o)}"video"==n&&ele.setAttribute("autoplay",!0)}}},{key:"getFiletype",value:function(t){var e=!!t.match(/\.(jpg)|(png)|(gif)/g),i=!!t.match(/\.mp4\?+/g);return e?"img":i?"video":(console.log("filetype of ".concat(t," is not supported")),"")}},{key:"setChart",value:function(t,e,i,n){if(void 0!=Chart){var o=document.createElement("canvas"),r=o.getContext("2d");new Chart(r,{type:i,data:e,options:{legend:{display:!1}}});o.height=n,o.style.height=o.height+"px",o.width=n,o.style.width=o.width+"px",t.appendChild(o)}else console.warn("Chart module ".concat(Chart.toString()," not defined or data invalid: ").concat(e.toString()))}},{key:"rdObjs",value:function(t,e){var i=[];if(!e)return i;for(var n=0;n<t;n++)i.push({name:"line"+n.toString(),lon:parseInt((8*Math.random()+e[0]-4).toFixed(2)),lat:parseInt((4*Math.random()+e[1]-2).toFixed(2)),color:"rgba(10,200,"+(251*Math.random()).toFixed(0)+",0.7)"});return i.push({name:"circle1",lon:e[0],lat:e[1],radius:parseInt(10*Math.random()),color:"rgba(251,200,20,0.6)"}),i}},{key:"loadImageAsync",value:function(t,e,i){return new Promise(function(e,i){var n=new Image;n.onload=e,n.onerror=i,n.src=t})}},{key:"readonly",value:function(t,e,i){return i.writable=!1,i}},{key:"log",value:function(t,e,i){var n=i.value;i.value=function(){return console.log('Calling "'.concat(e,'" with'),arguments),n.apply(null,arguments)}}},{key:"debounce",value:function(t,e){var i;return function(){var n=this,o=arguments;clearTimeout(i),i=setTimeout(function(){t.apply(n,o)},e)}}}]),t}();function s(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}var c=function(){function t(e){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t);var i=e||{};this.id=(1e6*Math.random()).toString(16),this.speed=i.speed||1,this.direction=i.direction||0,this.name=i.name||function(){var t=1e4*Math.random();return"Player ".concat(t.toFixed(0))}(),this.lon=i.lon||120,this.lat=i.lat||30,this.iconUrl=i.icon,this.icon=null,this._init()}return function(t,e,i){e&&s(t.prototype,e),i&&s(t,i)}(t,[{key:"_init",value:function(){var t=this,e=new Image;this.iconUrl&&(e.src=this.iconUrl,e.onload=function(){t.icon=e})}},{key:"accelerate",value:function(){}},{key:"turnLeft",value:function(){this&&(this.direction-=2)}},{key:"turnRight",value:function(){this.direction+=2}},{key:"brake",value:function(){this.speed>0&&(this.speed-=1)}}]),t}();function u(t){return(u="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function p(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}function f(t,e){return!e||"object"!==u(e)&&"function"!=typeof e?function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t):e}function d(t){return(d=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function y(t,e){return(y=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}var x=function(t){function e(t){var i;return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),(i=f(this,d(e).call(this,t))).life=o.DroneParam.LIFE,i.bullets=[],i.firing=!1,i.bulletNum=2,i.icon=o.Images.Plane,i.manual=!1,i}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&y(t,e)}(e,c),function(t,e,i){e&&p(t.prototype,e),i&&p(t,i)}(e,[{key:"updateStatus",value:function(){var t=Math.cos(this.direction*Math.PI/180)*this.speed*.001,e=this.lat+t;(e>84||e<-84)&&(t=-t,this.direction+=180,console.warn("latitude out of bbox, turn back..")),this.lon+=Math.sin(this.direction*Math.PI/180)*this.speed*.001,this.lat+=t}},{key:"accelerate",value:function(){this.speed<o.DroneParam.MAXSPEED&&(this.speed+=1)}},{key:"fire",value:function(){if(this.bullets instanceof Array&&this.bullets.length>0&&!this.firing){var t=this;setTimeout(function(){t.firing=!1},o.DroneParam.FIRINGTIME),this.firing=!0}else if(!this.firing){for(var e=0;e<this.bulletNum;e++)this.bullets.push(new r(this));var i=this;setTimeout(function(){i.firing=!1},o.DroneParam.FIRINGTIME),this.firing=!0}}}]),e}();function g(t){return(g="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function m(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}function v(t,e){return!e||"object"!==g(e)&&"function"!=typeof e?function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t):e}function w(t){return(w=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function b(t,e){return(b=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}var R=function(t){function e(t,i){var n;!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),n=v(this,w(e).call(this,i));return n.map=i.map,v(n,n.genMarker(t,i))}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&b(t,e)}(e,c),function(t,e,i){e&&m(t.prototype,e),i&&m(t,i)}(e,[{key:"genMarker",value:function(t,e){if(t instanceof Object&&void 0!==t.properties){var i=document.createElement("div");i.className="marker",t.properties.iconSize||(t.properties.iconSize=[32,32]),i.style.width=t.properties.iconSize[0]+"px",i.style.height=t.properties.iconSize[1]+"px";var n=document.createElement("div");if(n.className="marker__inner",n.style.backgroundColor="".concat(e.backgroundColor||"rgb(255, 0, 87)"),n.style.backgroundImage="url(".concat(e.icon||"../../assets/arrow2x.png",")"),i.appendChild(n),e.map instanceof mapboxgl.Map){var o=new mapboxgl.Marker(i).setLngLat(t.geometry.coordinates).addTo(e.map);return k(o,e),e.map.on("rotate",function(){k(o,e)}),o}}else console.warn("".concat(t," is not invalid GeoJson instance.."))}}]),e}();function k(t,e){var i=e.map.getPitch(),n=e.map.getBearing(),o=t.getElement().children[0],r=-n+(e.iconRotateOffset||0);o.style.transform="rotateX(".concat(i,"deg) rotateZ(").concat(r,"deg)")}function M(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}var C=function(){function t(){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t)}return function(t,e,i){e&&M(t.prototype,e),i&&M(t,i)}(t,null,[{key:"init",value:function(e){e instanceof HTMLCanvasElement?(t.canv=e,t.height=e.height,t.width=e.width,t.ctx=e.getContext("2d"),t.ctx.strokeStyle="rgba(0,0,0,0.9)",t.ctx.fillStyle="rgba(10,200,240,0.4)",t.ctx.strokeWidth=1,t.animate=!1,t.img=new Image):console.error("ele is not instanceof CANVAS")}},{key:"setStroke",value:function(e){t.ctx&&(t.ctx.strokeStyle=e)}},{key:"setFill",value:function(e){t.ctx&&(t.ctx.fillStyle=e)}},{key:"setWidth",value:function(e){t.ctx&&(t.ctx.lineWidth=e,t.ctx.strokeWidth=e)}},{key:"drawPoint",value:function(e,i,n,o,r,a){var h,l;if(t.setFill("#EEE"),t.setStroke("#EE1"),e instanceof Array&&2==e.length){if(t.ctx.beginPath(),o){t.img.src=o,i?(h=i,l=i):(h=t.img.width,l=t.img.height);var s=t.height-e[1];return r&&t.rotateCtx(e,r),t.ctx.drawImage(t.img,parseInt(e[0]),parseInt(s),h,l),void(r&&t.restore(e))}var c=t.height-e[1];if(t.ctx.arc(parseInt(e[0]),parseInt(c),i,0,2*Math.PI),"number"==typeof r){var u=r%(2*Math.PI)-Math.PI/2;t.ctx.arc(parseInt(e[0]),parseInt(c),i+2,u-Math.PI/4,u+Math.PI/4)}a&&t.ctx.fillText(a,e[0],parseInt(c)-4),n?t.ctx.fill():t.ctx.stroke()}}},{key:"restore",value:function(e){var i=t.height-e[1];t.ctx.translate(parseInt(-e[0]),parseInt(-i)),t.ctx.restore()}},{key:"rotateCtx",value:function(e,i){t.ctx.save();var n=t.height-e[1];t.ctx.translate(parseInt(e[0]),parseInt(n)),t.ctx.rotate(i)}},{key:"drawBar",value:function(e,i,n,o){var r=t.height-n;o?t.ctx.fillRect(e,r,i,n):t.ctx.strokeRect(e,r,i,n)}},{key:"drawRect",value:function(e){var i=arguments.length>1&&void 0!==arguments[1]&&arguments[1],n=new function(t){var e=t||{};this.minX=e.minX,this.minY=e.minY,this.maxX=e.maxX,this.maxY=e.maxY}(e),o=n.maxX-n.minX,r=n.maxY-n.minY;i?t.ctx.fillRect(n.minX,n.minY,o,r):t.ctx.strokeRect(n.minX,n.minY,o,r)}},{key:"drawLine",value:function(e,i,n,o){if(e instanceof Array&&e.length>0){t.ctx.strokeStyle="#FF0000",t.ctx.lineWidth=i||2,t.ctx.beginPath(),o&&t.ctx.moveTo(-100,t.height);for(var r=0;r<e.length;r++)if(e[r]instanceof Array&&2==e[r].length){var a=t.height-e[r][1];t.ctx.lineTo(e[r][0],a)}o?(t.ctx.lineTo(e[e.length-1][0],t.height),t.ctx.closePath(),t.ctx.fill()):t.ctx.stroke()}}},{key:"drawBars",value:function(e,i){t.clearCanv(),t.ctx.strokeStyle="#000",t.setWidth(2);var n=10;if(e instanceof Array)for(var o=(t.width-20)/e.length,r=.7*o,a=0;a<e.length;a++)t.drawBar(n,r,e[a]),n+=o;else console.error("pls Input Array Data");console.warn("Bars rendered complete..")}},{key:"clearCanv",value:function(){t.ctx.clearRect(0,0,t.width,t.height)}}]),t}();function S(t){return(S="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function _(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}var O=function(){function t(e){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.ele=e.ele?e.ele:null,this.data=e.data?e.data:[],this.type=e.type?e.type:null,this.maxValue=0,this.rotate=e.rotate?e.rotate:0,this.url=e.url?e.url:null}return function(t,e,i){e&&_(t.prototype,e),i&&_(t,i)}(t,[{key:"updateData",value:function(){}},{key:"setData",value:function(t){return this.data=t.coords,this.rotate=t.rotate,this.dataName=t.name,C.clearCanv(),this.render(),this}},{key:"render",value:function(){this.data instanceof Array&&this.data.length>0&&this.data[0]instanceof Array?C.drawLine(this.data,null,null):this.data instanceof Array&&this.data.length>0&&(this.url?C.drawPoint(this.data,20,null,this.url,this.rotate,this.dataName):C.drawPoint(this.data,2,null,null,this.rotate,this.dataName))}},{key:"statMax",value:function(){var t=this;return S(this.data)==Array&&this.data.length>0&&this.data.forEach(function(e){t.maxValue<e&&(t.maxValue=e)}),this}},{key:"generateSinLine",value:function(t,e,i,n){for(var o=[],r=0,a=i||20,h=n||0,l=0;l<e;l++)"sin"==t?r=parseInt(50*Math.sin(l/a)):"cos"==t?r=parseInt(50*Math.cos(l/a)):"tan"==t&&(r=parseInt(50*Math.tan(l/a))),o.push([l-h,r+50]);return o}}]),t}();function j(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}var I=function(){function t(e){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),e&&e.map&&(this.map=e.map||void 0)}return function(t,e,i){e&&j(t.prototype,e),i&&j(t,i)}(t,[{key:"_init",value:function(){}},{key:"setMap",value:function(t){return this.map=t,this}},{key:"lnglat2pix",value:function(t,e){if(void 0!=this.map&&this.map.project instanceof Function){var i=this.map.project(new mapboxgl.LngLat(t,e));return[Math.round(i.x),Math.round(i.y)]}return[t,e]}}]),t}();function P(t){return(P="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function T(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}function E(t){return(E=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function X(t,e){return(X=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}function A(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}var B=function(t){function e(t){var i;!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e);var n=t||{};return(i=function(t,e){return!e||"object"!==P(e)&&"function"!=typeof e?A(t):e}(this,E(e).call(this,n))).canvas=i._init(),i.redraw=n.render?n.render:function(t){var e=this;if(this.canvas){var i=this.canvas.getContext("2d"),n=t||this.data;if(!Array.isArray(n))return;this.shadow?(!function(t){var e=t.globalCompositeOperation;t.globalCompositeOperation="destination-in",t.globalAlpha=.95,t.fillRect(0,0,t.canvas.width,t.canvas.height),t.globalCompositeOperation=e}(i),i.save()):i.clearRect(0,0,this.canvas.width,this.canvas.height),F(i,this.blurWidth,"rgba(255,255,255,.4");for(var o=function(t){var o=n[t][e.xfield],r=n[t][e.yfield],a=n[t].radius||3,h=n[t].icon,l=n[t].name,s=n[t].direction||0;a=Math.abs(a);var c=e.lnglat2pix(o,r);if(null==c)return"continue";if(i.fillStyle=n[t].color||"rgba(255,240,4,.9)",i.beginPath(),void 0!==l&&l.startsWith("Play")&&(a=.75*Y),void 0!==h){i.save(),i.translate(c[0],c[1]),i.rotate(s*Math.PI/180);var u=h.height>h.width?h.width:h.height;try{i.drawImage(h,0,0,u,u,-Y/2,-Y/2,Y,Y)}catch(t){console.warn("ctx.drawImage.. error.")}i.restore()}else i.arc(c[0],c[1],a,0,2*Math.PI),i.fill();e.keepTrack&&0==e.tracks.length?(e.initTrackCtx(),e.trackCtx.moveTo(c[0],c[1]),e.tracks.push([o,r])):e.trackCtx&&(e.trackCtx.lineTo(c[0],c[1]),e.tracks.push([o,r]),setTimeout(function(){e.trackCtx.stroke(),e.trackCtx.beginPath(),e.trackCtx.moveTo(c[0],c[1])},0)),void 0!==l&&e.labelOn&&i.strokeText(l,c[0],c[1])},r=0;r<n.length;r++)o(r);this.shadow&&i.restore()}}.bind(A(A(i))),i.data=n.data?n.data:null,i.labelOn=n.labelOn||!1,i.xfield=n.xfield||"lon",i.yfield=n.yfield||"lat",i.shadow=void 0!=n.shadow&&n.shadow,i.lineColor=n.lineColor,i.blurWidth=void 0!=n.blurWidth?n.blurWidth:4,i.keepTrack=void 0!=n.keepTrack&&n.keepTrack,i.keepTrack&&(i.trackLayer=i._init(),i._initTrackCtx()),i.tracks=[],i.initTrackCtx=i._initTrackCtx.bind(A(A(i))),n&&n.map&&(i.setMap(n.map),console.warn("register map moveend rerender handler.."),n.map.on("move",function(){i.redraw(),i.redrawTrack()})),i.redraw(),i}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&X(t,e)}(e,I),function(t,e,i){e&&T(t.prototype,e),i&&T(t,i)}(e,[{key:"_init",value:function(){arguments.length>0&&void 0!==arguments[0]&&arguments[0],arguments.length>1&&void 0!==arguments[1]&&arguments[1];var t=this.map._canvasContainer,e=this.map._canvas,i=document.createElement("canvas");return i.style.position="absolute",i.className="overlay-canvas",i.width=parseInt(e.style.width),i.height=parseInt(e.style.height),t.appendChild(i),i}},{key:"_transformLnglat",value:function(){var t=this;if(Array.isArray(this.data))return console.warn("transformed lnglat data to pix.."),this.data.map(function(e){return t.lnglat2pix(e[0],e[1])})}},{key:"_initTrackCtx",value:function(){this.trackLayer&&(this.trackCtx=this.trackLayer.getContext("2d"),this.movedTo=!1,F(this.trackCtx,this.blurWidth,"rgba(255,255,255,.4"),this.trackCtx.lineWidth=this.lineWidth||3,this.trackCtx.strokeStyle=this.lineColor||"rgba(255,255,20,.6)",this.trackCtx.beginPath())}},{key:"setTracks",value:function(t){if(Array.isArray(t))return this.tracks=t,this}},{key:"getTracks",value:function(){return this.tracks}},{key:"redrawTrack",value:function(){if(this.trackCtx&&this.tracks&&this.tracks.length>0){var t=[0,0];this.trackCtx.clearRect(0,0,this.trackLayer.width,this.trackLayer.height),this.trackCtx.beginPath(),t=this.lnglat2pix(this.tracks[0][0],this.tracks[0][1]),this.trackCtx.moveTo(t[0],t[1]);for(var e=1;e<this.tracks.length;e++)t=this.lnglat2pix(this.tracks[e][0],this.tracks[e][1]),this.trackCtx.lineTo(t[0],t[1]);this.trackCtx.stroke()}}}]),e}();var Y=32;function F(t,e){var i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"rgba(255,255,255,.8)";void 0!==t&&(t.linecap="round",t.shadowBlur=e,t.shadowColor=i,t.strokeStyle="rgba(255,255,255,.9)",t.fillStyle="rgba(255,240,91,.8)")}function D(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}var L=function(){function t(){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t)}return function(t,e,i){e&&D(t.prototype,e),i&&D(t,i)}(t,null,[{key:"gameControl",value:function(t){if(t instanceof x==!0){t.u=t.r=t.d=t.l=0,onkeydown=function(t){return e(t,1)},onkeyup=function(t){return e(t)};var e=function(e,i,n,o){for(o in n={u:[38,90,87],r:[39,68],d:[40,83],l:[37,65,81]})n[o].includes(e.keyCode)&&(t[o]=i)};setInterval(function(){t.u&&t.accelerate(),t.d&&t.brake(),t.r&&t.turnRight(),t.l&&t.turnLeft()},25),console.log("gameControl register success.")}else console.error("gameControl must bind with a drone instance.")}},{key:"pickupControl",value:function(t){if(t instanceof B)t.lnglat2pix(t.source[0].lon,t.source[1].lat)}},{key:"bulletCalculator",value:function(t){if(Array.isArray(t))for(var e=0;e<t.length;e++){var i=drone[e];i.bullets;i.firing}}},{key:"addRobots",value:function(t){return new x({})}},{key:"dashBoard",value:function(t,e){if(t instanceof x==!0){try{setInterval(function(){e.innerHTML=t.name+"<br> coords: "+t.lon.toFixed(1)+", "+t.lat.toFixed(1)+"<br>speed: "+t.speed+"<br>direction: "+(t.direction%360).toFixed(1)},200)}catch(t){console.error(t)}console.log("dashBoard register success.")}else console.error("dashBoard must bind with a drone instance.")}},{key:"featureList",value:function(t){if(void 0==t||"string"!=typeof t)return console.warn("invalid containerId.."),null}}]),t}();function N(t){return(N="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}var W={fps:30,objs:null,get:function(t){return this.objs=t,this},to:function(t,e,i){if(this.lastAniParams=[t,e],void 0!=t&&void 0!=e&&null!=W.objs){var n=function(){var t=!1,e=!1;if(a>=r)if(W.loop){a=0;for(var n=0;n<W.objs.length;n++)W.objs[n]=Object.assign([],W.objs[n],h[n]);console.warn("animation reset ...")}else W.paused=!0,clearInterval(W.timer),W.timerOn=!1,console.warn("animation end !!!");else if(0==a?t=!0:a==r-1&&(e=!0),W.speed,!W.paused){for(n=0;n<W.objs.length;n++)for(var o in l[n])W.objs[n][o]+=l[n][o];i&&i instanceof Function&&i(W.objs,e,t),a+=1}},o=1e3/W.fps,r=e/1e3*W.fps,a=0,h=[],l=[];console.log("animation params init complete...");for(var s=0;s<W.objs.length;s++)for(var c in t[s])"number"==typeof t[s][c]&&("object"!=N(h[s])&&(h[s]={}),"object"!=N(l[s])&&(l[s]={}),h[s][c]=W.objs[s][c],l[s][c]=parseFloat(((t[s][c]-W.objs[s][c])*(1/r)).toFixed(3)));return new Promise(function(t,i){W.timer=setInterval(n,o),W.timerOn=!0,W.paused=!1,setTimeout(t,e)})}},loop:!1,speed:1,timerOn:!1,timer:null,paused:!1,wait:function(t,e){e=e||0;return new Promise(function(i,n){setTimeout(function(){t instanceof Object?W.objs=Object.assign(W.objs,t):t instanceof Function&&console.log("execute Func await.."),t.call(this),i()},e)})},toggleAni:function(t){if(void 0==t)this.paused=!this.paused;else{this.paused=t}},toggleLoop:function(t){this.loop=void 0==t?!this.loop:t},lastAniParams:[void 0,void 0]};function z(t){return(z="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function H(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}function G(t){return(G=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function J(t,e){return(J=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}function V(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}var q=function(t){function e(t){var i;return function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e),(i=function(t,e){return!e||"object"!==z(e)&&"function"!=typeof e?V(t):e}(this,G(e).call(this,t))).domContainer=i._init(),i.redraw=function(){var t=this.domOpts;if(t&&Array.isArray(t))for(var e=0;e<t.length;e++){var i=t[e];if(void 0!=z(i)){var n=i.lon,o=i.lat,r=this.lnglat2pix(n,o);if(null!=r){var a=i.icon,h=i.resources,s=i.style?i.style+" animated":"bounceIn animated",c=i.data,u=i.type,p=this.doms[3*e]||document.createElement("div"),f=this.doms[3*e+1]||document.createElement("div"),d=this.doms[3*e+2]||document.createElement("div");Z(f,d,p,r,u||h);var y,x=l.deepClone(c);if(void 0!=h?(p.title=i.content||"",p.hasChildNodes()&&p.firstChild.src===h[0]||l.setResource(p,h)):void 0!=a?(p.innerHTML=(i.content||"")+"</br>",l.setIconDiv(p,a)):void 0!=c&&void 0!=u?l.isChanged(this.lastData[e],c)&&(l.setChart(p,x,u,2*K),this.lastData[e]=c):p.innerHTML=(i.content||"")+"</br>",void 0!=u&&$(p),f.className="dom-ele",d.className="dom-ele",f.style.left=r[0]+"px",f.style.top=r[1]-(U-10)+"px",d.style.left=r[0]-Q+"px",d.style.top=r[1]-Q+"px",void 0==this.doms[3*e])p.className="dom-popup ".concat(s),f.className=d.className="dom-ele ".concat(s),console.warn("add ".concat(s," css to dom.")),this.domContainer.appendChild(p),this.domContainer.appendChild(f),this.domContainer.appendChild(d),(y=this.doms).push.apply(y,[p,f,d])}}}}.bind(V(V(i))),i.domOpts=t.doms,t&&t.map&&(i.setMap(t.map),t.map.on("move",i.redraw)),i.doms=[],i.lastData=[],i.redraw(),console.log("Dom overlayer add to Map..."),i}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&J(t,e)}(e,I),function(t,e,i){e&&H(t.prototype,e),i&&H(t,i)}(e,[{key:"_init",value:function(){var t=this.map._canvasContainer,e=this.map._canvas,i=document.createElement("div");return i.style.position="absolute",i.className="overlay-dom",i.style.width=e.style.width,i.style.height="0",t.parentElement.appendChild(i),i}},{key:"setDoms",value:function(t){Array.isArray(t)&&(this.domOpts=t,this.clearDoms(),this.redraw())}},{key:"findDom",value:function(t){for(var e=0;e<this.doms.length;e++)try{if(this.doms[e]===t)return this.doms[e]}catch(t){}}},{key:"clearDoms",value:function(){for(var t=0;t<this.doms.length;t++)this.domContainer.removeChild(this.doms[t]);this.doms=[]}}]),e}(),U=60,Q=4,K=60;function Z(t,e,i,n,o){var r=Array.isArray(o);t.style.height=U-10+"px",t.style.width="1px",t.style.position="absolute",e.style.borderRadius="50%",e.style.width=e.style.height=2*Q+"px",e.style.position="absolute",i.style.position="absolute",o||(i.style.minWidth="100px"),i.style.background="#fff",i.style.textAlign="center",i.style.padding="3px",i.style.left=n[0]-(r?K/2:K)+"px",i.style.top=n[1]-U-(o?K:20)+"px"}function $(t){t.style.borderWidth="0",t.style.zIndex=9999,t.style.backgroundColor="rgba(0,0,0,0.0)"}function tt(t){return(tt="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function et(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}function it(t,e){return!e||"object"!==tt(e)&&"function"!=typeof e?function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t):e}function nt(t){return(nt=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function ot(t,e){return(ot=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}var rt=function(t){function e(t){var i;!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e);var n=t||{};return(i=it(this,nt(e).call(this,n))).windImage=n.image||new Image,i.radius=n.radius||2,i}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&ot(t,e)}(e,B),function(t,e,i){e&&et(t.prototype,e),i&&et(t,i)}(e,[{key:"updateWind",value:function(t,e,i){this.canvas,this.canvas.getContext("2d");void 0==this.particles&&(console.log("generating particles..."),this.particles=function(t,e,i,n){var o=t||this.windImage,r=document.createElement("canvas"),a=r.getContext("2d"),h=[],l=[];e&&(h={type:"FeatureCollection",name:"particles",features:l});r.width=o.width,r.height=o.height,a.drawImage(o,0,0);var s=a.getImageData(0,0,r.width,r.height);s.data.byteLength;(void 0==i||void 0!==i&&i<1)&&(console.warn("Input compressRatio invalid, use default 1."),i=1);i=parseInt(Number(i));for(var c=1;c<r.height-1;c+=i)for(var u=0;u<r.width;u+=i){var p={lon:-180+u,lat:-90+c},f=4*(360*c+u),d=f+1,y=s.data[f],x=s.data[d],g=Math.pow(y,2)+Math.pow(x,2),m=Number(Math.atan(x/y).toFixed(2)),v="rgba("+(g/255).toFixed(0)+", 255, 100, 0.7)";e?(p={type:"Feature",properties:{angle:m,color:v},geometry:{type:"Point",coordinates:[-180+u,-90+c]}},l.push(p)):(p.color=v,p.angle=m,p.radius=n,h.push(p))}return h}(t,e,i,this.radius)),e?console.log("generating particles complete! num: "+this.particles.features.length+" in geojson."):(console.log("generating particles complete! num: "+this.particles.length),this.redraw(this.particles))}}]),e}();var at="pk.eyJ1IjoiaHVhbmd5aXhpdSIsImEiOiI2WjVWR1hFIn0.1P90Q-tkbHS38BvnrhTI6w",ht={version:8,sprite:"https://alex2wong.github.io/mapbox-plugins/assets/sprite",glyphs:"https://alex2wong.github.io/mapbox-plugins/{fontstack}/{range}.pbf",sources:{"custom-tms":{type:"raster",tiles:["http://www.google.cn/maps/vt?lyrs=s@702&gl=cn&x={x}&y={y}&z={z}"],tileSize:256}},layers:[{id:"custom-tms",type:"raster",source:"custom-tms",paint:{}}]},lt={version:8,sprite:"https://alex2wong.github.io/mapbox-plugins/assets/sprite",glyphs:"https://alex2wong.github.io/mapbox-plugins/{fontstack}/{range}.pbf",sources:{"custom-tms":{type:"raster",tiles:["https://cartodb-basemaps-1.global.ssl.fastly.net/light_all/{z}/{x}/{y}.png"],tileSize:256}},layers:[{id:"custom-tms",type:"raster",source:"custom-tms",paint:{}}]},st={version:8,sprite:"https://alex2wong.github.io/mapbox-plugins/assets/sprite",glyphs:"https://alex2wong.github.io/mapbox-plugins/{fontstack}/{range}.pbf",sources:{"custom-tms":{type:"raster",tiles:["https://cartodb-basemaps-2.global.ssl.fastly.net/dark_all/{z}/{x}/{y}.png"],tileSize:256}},layers:[{id:"custom-tms",type:"raster",source:"custom-tms",paint:{}}]},ct={version:8,sprite:"https://alex2wong.github.io/mapbox-plugins/assets/sprite",glyphs:"https://alex2wong.github.io/mapbox-plugins/{fontstack}/{range}.pbf",sources:{},layers:[{id:"background",type:"background",paint:{}}]};var ut=function(){};function pt(){var t,e=this;arguments.length>0&&void 0!==arguments[0]&&arguments[0],arguments.length>1&&arguments[1];if(this.canvas&&(t=this.canvas.getContext("2d")),t instanceof CanvasRenderingContext2D){t.clearRect(0,0,this.canvas.width,this.canvas.height),function(t){var e=arguments.length>1&&void 0!==arguments[1]&&arguments[1];t.strokeStyle="green",t.setLineDash([]),t.globalAlpha=.95,t.globalCompositeOperation="source-over",e?(console.warn("enabling line shadowBlur"),t.shadowBlur=4,t.shadowColor="#0f0"):t.shadowBlur=0;t.lineCap="round",t.lineJoin="round",t.lineWidth=12}(t);var i=[0,0];if(!Array.isArray(this.data))return;i=this.data.map(function(t){return e.lnglat2pix(t[0],t[1])}),t.beginPath(),t.moveTo(i[0][0],i[0][1]);for(var n=1;n<i.length;n+=1)t.lineTo(i[n][0],i[n][1]);t.stroke(),t.closePath(),ut(t,i)}}function ft(t,e,i,n){var o=new Image;o.src="../../assets/arrowright.png",o.onload=function(){!function(t,e){var i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:30,n=arguments.length>3?arguments[3]:void 0,o=arguments.length>4&&void 0!==arguments[4]?arguments[4]:.5,r=arguments.length>5?arguments[5]:void 0,a=Math.atan((e[1]-t[1])/(e[0]-t[0]));e[0]-t[0]<0&&(a+=Math.PI);for(var h=[],l=function(t,e){return Math.sqrt(Math.pow(e[1]-t[1],2)+Math.pow(e[0]-t[0],2))}(t,e)/i,s=function(t,e){r&&n&&(n.save(),n.translate(t,e),n.rotate(a),n.drawImage(r,-r.width/2,-r.width/2),n.restore())},c=o;c<=l;c+=1){var u=Math.round(t[0]+c*i*Math.cos(a)),p=Math.round(t[1]+c*i*Math.sin(a));h.push([u,p]),s(u,p)}}(e,i,30,t,n,o)}}l&&(ut=l.debounce(function t(e,i){var n=arguments.length>2&&void 0!==arguments[2]&&arguments[2],o=.5;o=o<1?o+.01:.5;for(var r=1;r<i.length;r+=1)ft(e,i[r-1],i[r],o);n&&requestAnimationFrame(t)},100)),i.d(e,"rbush",function(){return dt}),i.d(e,"Drone",function(){return x}),i.d(e,"Canvas",function(){return C}),i.d(e,"Chart",function(){return O}),i.d(e,"Util",function(){return l}),i.d(e,"Controllers",function(){return L}),i.d(e,"myTween",function(){return W}),i.d(e,"CanvasOverlayer",function(){return B}),i.d(e,"DomOverlayer",function(){return q}),i.d(e,"WindLayer",function(){return rt}),i.d(e,"Config",function(){return n}),i.d(e,"drawArrowLine",function(){return pt}),i.d(e,"xMarker",function(){return R});var dt=i(1);"undefined"!=typeof mapboxgl&&(mapboxgl.accessToken=at)}])});