2019-03-12 05:08:53 +08:00
|
|
|
L.BoatIcon=L.Icon.extend({options:{iconSize:new L.Point(150,150),className:"leaflet-boat-icon",course:0,speed:0,color:"#8ED6FF",labelAnchor:[23,0],wind:!1,windDirection:0,windSpeed:0,idleCircle:!1},x:66,y:85,x_fac:.18,y_fac:.18,ctx:null,lastHeading:0,lastWindDirection:0,createIcon:function(){var a=document.createElement("canvas");this._setIconStyles(a,"icon");var b=this.options.iconSize;return a.width=b.x,a.height=b.y,this.lastHeading=0,this.ctx=a.getContext("2d"),this.draw(this.ctx,b.x,b.y),a},draw:function(a,b,c){if(a){var d=this.x,e=this.y,f=this.x_fac,g=this.y_fac;if(a.clearRect(0,0,b,c),a.translate(b/2,c/2),a.rotate(this.options.course*Math.PI/180),a.translate(-b/2,-c/2),a.beginPath(),this.options.idleCircle===!0&&0===this.options.speed?a.arc(d+50*f,e-50*g,50*f,0,2*Math.PI):(a.moveTo(d,e),a.bezierCurveTo(d,e+80*g,d+100*f,e+80*g,d+100*f,e),a.quadraticCurveTo(d+100*f,e-100*g,d+50*f,e-200*g),a.quadraticCurveTo(d,e-100*g,d,e)),a.fillStyle=this.options.color,a.fill(),a.stroke(),a.closePath(),1==this.options.wind){a.translate(b/2,c/2),a.rotate(this.options.windDirection*Math.PI/180),a.translate(-b/2,-c/2),a.beginPath(),a.moveTo(b/2,e-45),a.lineTo(b/2,e-70);for(var h=b/2,i=5*Math.round(this.options.windSpeed/5),j=Math.floor(i/10),k=i%10>0,l=70,m=0;m<j;m++)a.moveTo(h,e-l),a.lineTo(h+8,e-l-8),l-=5;k&&(0==j&&(l-=5),a.moveTo(h,e-l),a.lineTo(h+5,e-l-5)),a.stroke()}}},setHeadingWind:function(a,b,c){this.options.wind=!0,this.options.course=a%360-this.lastHeading,this.lastHeading=a%360,this.options.windDirection=c%360-a%360,this.lastHeading+=this.options.windDirection,this.options.windSpeed=b;var d=this.options.iconSize;this.draw(this.ctx,d.x,d.y)},setHeading:function(a){this.options.course=a%360-this.lastHeading,this.lastHeading=a%360;var b=this.options.iconSize;this.draw(this.ctx,b.x,b.y)},setSpeed:function(a){this.options.speed=a;var b=this.options.iconSize;this.draw(this.ctx,b.x,b.y)}}),L.BoatMarker=L.Marker.extend({setHeadingWind:function(a,b,c){this.options.icon.setHeadingWind(a,b,c)},setHeading:function(a){this.options.icon.setHeading(a)},setSpeed:function(a){this.options.icon.setSpeed(a)}}),L.boatMarker=function(a,b){var c="color"in b?b.color:"#f1c40f",d="idleCircle"in b&&b.idleCircle;return b.icon=new L.BoatIcon({color:c,idleCircle:d}),new L.BoatMarker(a,b)};
|
