Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

vue3-google-map

Package Overview
Dependencies
Maintainers
2
Versions
43
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

vue3-google-map - npm Package Compare versions

Comparing version 0.19.0 to 0.20.0

dist/index.cjs
dist/index.mjs
dist/themes/index.cjs
dist/themes/index.mjs

8

dist/index.umd.js

@@ -1,2 +0,2 @@

(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(".mapdiv[data-v-6654c05e]{width:100%;height:100%}.custom-control-wrapper[data-v-268ef28d]{display:none}.mapdiv .custom-control-wrapper[data-v-268ef28d]{display:inline-block}.info-window-wrapper[data-v-f929b615]{display:none}.mapdiv .info-window-wrapper[data-v-f929b615]{display:inline-block}.custom-marker-wrapper[data-v-4b2eafc1]{display:none}.mapdiv .custom-marker-wrapper[data-v-4b2eafc1]{display:inline-block}")),document.head.appendChild(e)}}catch(a){console.error("vite-plugin-css-injected-by-js",a)}})();
(function(){"use strict";try{if(typeof document<"u"){var a=document.createElement("style");a.appendChild(document.createTextNode(".mapdiv[data-v-76180f00]{width:100%;height:100%}.custom-control-wrapper[data-v-268ef28d]{display:none}.mapdiv .custom-control-wrapper[data-v-268ef28d]{display:inline-block}.info-window-wrapper[data-v-f929b615]{display:none}.mapdiv .info-window-wrapper[data-v-f929b615]{display:inline-block}.custom-marker-wrapper[data-v-4b2eafc1]{display:none}.mapdiv .custom-marker-wrapper[data-v-4b2eafc1]{display:inline-block}")),document.head.appendChild(a)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
(function(v,l){typeof exports=="object"&&typeof module<"u"?l(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],l):(v=typeof globalThis<"u"?globalThis:v||self,l(v.Vue3GoogleMap={},v.Vue))})(this,function(v,l){"use strict";var ft=Object.defineProperty;var mt=(v,l,b)=>l in v?ft(v,l,{enumerable:!0,configurable:!0,writable:!0,value:b}):v[l]=b;var Q=(v,l,b)=>(mt(v,typeof l!="symbol"?l+"":l,b),b);const b=Symbol("map"),T=Symbol("api"),ee=Symbol("marker"),te=Symbol("markerCluster"),D=Symbol("CustomMarker"),se=Symbol("mapTilesLoaded"),R=["click","dblclick","drag","dragend","dragstart","mousedown","mousemove","mouseout","mouseover","mouseup","rightclick"];/*! *****************************************************************************

@@ -15,3 +15,3 @@ Copyright (c) Microsoft Corporation.

PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */function Ce(n,e,t,s){function r(o){return o instanceof t?o:new t(function(a){a(o)})}return new(t||(t=Promise))(function(o,a){function c(d){try{h(s.next(d))}catch(u){a(u)}}function i(d){try{h(s.throw(d))}catch(u){a(u)}}function h(d){d.done?o(d.value):r(d.value).then(c,i)}h((s=s.apply(n,e||[])).next())})}var be=function n(e,t){if(e===t)return!0;if(e&&t&&typeof e=="object"&&typeof t=="object"){if(e.constructor!==t.constructor)return!1;var s,r,o;if(Array.isArray(e)){if(s=e.length,s!=t.length)return!1;for(r=s;r--!==0;)if(!n(e[r],t[r]))return!1;return!0}if(e.constructor===RegExp)return e.source===t.source&&e.flags===t.flags;if(e.valueOf!==Object.prototype.valueOf)return e.valueOf()===t.valueOf();if(e.toString!==Object.prototype.toString)return e.toString()===t.toString();if(o=Object.keys(e),s=o.length,s!==Object.keys(t).length)return!1;for(r=s;r--!==0;)if(!Object.prototype.hasOwnProperty.call(t,o[r]))return!1;for(r=s;r--!==0;){var a=o[r];if(!n(e[a],t[a]))return!1}return!0}return e!==e&&t!==t};const re="__googleMapsScriptId";var j;(function(n){n[n.INITIALIZED=0]="INITIALIZED",n[n.LOADING=1]="LOADING",n[n.SUCCESS=2]="SUCCESS",n[n.FAILURE=3]="FAILURE"})(j||(j={}));class x{constructor({apiKey:e,authReferrerPolicy:t,channel:s,client:r,id:o=re,language:a,libraries:c=[],mapIds:i,nonce:h,region:d,retries:u=3,url:p="https://maps.googleapis.com/maps/api/js",version:f}){if(this.callbacks=[],this.done=!1,this.loading=!1,this.errors=[],this.apiKey=e,this.authReferrerPolicy=t,this.channel=s,this.client=r,this.id=o||re,this.language=a,this.libraries=c,this.mapIds=i,this.nonce=h,this.region=d,this.retries=u,this.url=p,this.version=f,x.instance){if(!be(this.options,x.instance.options))throw new Error(`Loader must not be called again with different options. ${JSON.stringify(this.options)} !== ${JSON.stringify(x.instance.options)}`);return x.instance}x.instance=this}get options(){return{version:this.version,apiKey:this.apiKey,channel:this.channel,client:this.client,id:this.id,libraries:this.libraries,language:this.language,region:this.region,mapIds:this.mapIds,nonce:this.nonce,url:this.url,authReferrerPolicy:this.authReferrerPolicy}}get status(){return this.errors.length?j.FAILURE:this.done?j.SUCCESS:this.loading?j.LOADING:j.INITIALIZED}get failed(){return this.done&&!this.loading&&this.errors.length>=this.retries+1}createUrl(){let e=this.url;return e+="?callback=__googleMapsCallback",this.apiKey&&(e+=`&key=${this.apiKey}`),this.channel&&(e+=`&channel=${this.channel}`),this.client&&(e+=`&client=${this.client}`),this.libraries.length>0&&(e+=`&libraries=${this.libraries.join(",")}`),this.language&&(e+=`&language=${this.language}`),this.region&&(e+=`&region=${this.region}`),this.version&&(e+=`&v=${this.version}`),this.mapIds&&(e+=`&map_ids=${this.mapIds.join(",")}`),this.authReferrerPolicy&&(e+=`&auth_referrer_policy=${this.authReferrerPolicy}`),e}deleteScript(){const e=document.getElementById(this.id);e&&e.remove()}load(){return this.loadPromise()}loadPromise(){return new Promise((e,t)=>{this.loadCallback(s=>{s?t(s.error):e(window.google)})})}importLibrary(e){return this.execute(),google.maps.importLibrary(e)}loadCallback(e){this.callbacks.push(e),this.execute()}setScript(){var e,t;if(document.getElementById(this.id)){this.callback();return}const s={key:this.apiKey,channel:this.channel,client:this.client,libraries:this.libraries.length&&this.libraries,v:this.version,mapIds:this.mapIds,language:this.language,region:this.region,authReferrerPolicy:this.authReferrerPolicy};Object.keys(s).forEach(o=>!s[o]&&delete s[o]),!((t=(e=window==null?void 0:window.google)===null||e===void 0?void 0:e.maps)===null||t===void 0)&&t.importLibrary||(o=>{let a,c,i,h="The Google Maps JavaScript API",d="google",u="importLibrary",p="__ib__",f=document,g=window;g=g[d]||(g[d]={});const m=g.maps||(g.maps={}),y=new Set,w=new URLSearchParams,_=()=>a||(a=new Promise((C,P)=>Ce(this,void 0,void 0,function*(){var M;yield c=f.createElement("script"),c.id=this.id,w.set("libraries",[...y]+"");for(i in o)w.set(i.replace(/[A-Z]/g,O=>"_"+O[0].toLowerCase()),o[i]);w.set("callback",d+".maps."+p),c.src=this.url+"?"+w,m[p]=C,c.onerror=()=>a=P(Error(h+" could not load.")),c.nonce=this.nonce||((M=f.querySelector("script[nonce]"))===null||M===void 0?void 0:M.nonce)||"",f.head.append(c)})));m[u]?console.warn(h+" only loads once. Ignoring:",o):m[u]=(C,...P)=>y.add(C)&&_().then(()=>m[u](C,...P))})(s);const r=this.libraries.map(o=>this.importLibrary(o));r.length||r.push(this.importLibrary("core")),Promise.all(r).then(()=>this.callback(),o=>{const a=new ErrorEvent("error",{error:o});this.loadErrorCallback(a)})}reset(){this.deleteScript(),this.done=!1,this.loading=!1,this.errors=[],this.onerrorEvent=null}resetIfRetryingFailed(){this.failed&&this.reset()}loadErrorCallback(e){if(this.errors.push(e),this.errors.length<=this.retries){const t=this.errors.length*Math.pow(2,this.errors.length);console.error(`Failed to load Google Maps script, retrying in ${t} ms.`),setTimeout(()=>{this.deleteScript(),this.setScript()},t)}else this.onerrorEvent=e,this.callback()}callback(){this.done=!0,this.loading=!1,this.callbacks.forEach(e=>{e(this.onerrorEvent)}),this.callbacks=[]}execute(){if(this.resetIfRetryingFailed(),this.done)this.callback();else{if(window.google&&window.google.maps&&window.google.maps.version){console.warn("Google Maps already loaded outside @googlemaps/js-api-loader.This may result in undesirable behavior as options and script parameters may not match."),this.callback();return}this.loading||(this.loading=!0,this.setScript())}}}function Me(n){return class extends n.OverlayView{constructor(s){super();Q(this,"element");Q(this,"opts");const{element:r,...o}=s;this.element=r,this.opts=o,this.opts.map&&this.setMap(this.opts.map)}getPosition(){return this.opts.position?this.opts.position instanceof n.LatLng?this.opts.position:new n.LatLng(this.opts.position):null}getVisible(){if(!this.element)return!1;const s=this.element;return s.style.display!=="none"&&s.style.visibility!=="hidden"&&(s.style.opacity===""||Number(s.style.opacity)>.01)}onAdd(){if(!this.element)return;const s=this.getPanes();s&&s.overlayMouseTarget.appendChild(this.element)}draw(){if(!this.element)return;const s=this.getProjection(),r=s==null?void 0:s.fromLatLngToDivPixel(this.getPosition());if(r){this.element.style.position="absolute";const o=this.element.offsetHeight,a=this.element.offsetWidth;let c,i;switch(this.opts.anchorPoint){case"TOP_CENTER":c=r.x-a/2,i=r.y;break;case"BOTTOM_CENTER":c=r.x-a/2,i=r.y-o;break;case"LEFT_CENTER":c=r.x,i=r.y-o/2;break;case"RIGHT_CENTER":c=r.x-a,i=r.y-o/2;break;case"TOP_LEFT":c=r.x,i=r.y;break;case"TOP_RIGHT":c=r.x-a,i=r.y;break;case"BOTTOM_LEFT":c=r.x,i=r.y-o;break;case"BOTTOM_RIGHT":c=r.x-a,i=r.y-o;break;default:c=r.x-a/2,i=r.y-o/2}this.element.style.left=c+"px",this.element.style.top=i+"px",this.element.style.transform=`translateX(${this.opts.offsetX||0}px) translateY(${this.opts.offsetY||0}px)`,this.opts.zIndex&&(this.element.style.zIndex=this.opts.zIndex.toString())}}onRemove(){this.element&&this.element.remove()}setOptions(s){const{element:r,...o}=s;this.element=r,this.opts=o,this.draw()}}}let ne;const oe=["bounds_changed","center_changed","click","contextmenu","dblclick","drag","dragend","dragstart","heading_changed","idle","isfractionalzoomenabled_changed","mapcapabilities_changed","maptypeid_changed","mousemove","mouseout","mouseover","projection_changed","renderingtype_changed","rightclick","tilesloaded","tilt_changed","zoom_changed"],Ee=l.defineComponent({props:{apiPromise:{type:Promise},apiKey:{type:String,default:""},version:{type:String,default:"weekly"},libraries:{type:Array,default:()=>["places"]},region:{type:String,required:!1},language:{type:String,required:!1},backgroundColor:{type:String,required:!1},center:{type:Object,default:()=>({lat:0,lng:0})},clickableIcons:{type:Boolean,required:!1,default:void 0},controlSize:{type:Number,required:!1},disableDefaultUi:{type:Boolean,required:!1,default:void 0},disableDoubleClickZoom:{type:Boolean,required:!1,default:void 0},draggable:{type:Boolean,required:!1,default:void 0},draggableCursor:{type:String,required:!1},draggingCursor:{type:String,required:!1},fullscreenControl:{type:Boolean,required:!1,default:void 0},fullscreenControlPosition:{type:String,required:!1},gestureHandling:{type:String,required:!1},heading:{type:Number,required:!1},isFractionalZoomEnabled:{type:Boolean,required:!1,default:void 0},keyboardShortcuts:{type:Boolean,required:!1,default:void 0},mapTypeControl:{type:Boolean,required:!1,default:void 0},mapTypeControlOptions:{type:Object,required:!1},mapTypeId:{type:[Number,String],required:!1},mapId:{type:String,required:!1},maxZoom:{type:Number,required:!1},minZoom:{type:Number,required:!1},noClear:{type:Boolean,required:!1,default:void 0},panControl:{type:Boolean,required:!1,default:void 0},panControlPosition:{type:String,required:!1},restriction:{type:Object,required:!1},rotateControl:{type:Boolean,required:!1,default:void 0},rotateControlPosition:{type:String,required:!1},scaleControl:{type:Boolean,required:!1,default:void 0},scaleControlStyle:{type:Number,required:!1},scrollwheel:{type:Boolean,required:!1,default:void 0},streetView:{type:Object,required:!1},streetViewControl:{type:Boolean,required:!1,default:void 0},streetViewControlPosition:{type:String,required:!1},styles:{type:Array,required:!1},tilt:{type:Number,required:!1},zoom:{type:Number,required:!1},zoomControl:{type:Boolean,required:!1,default:void 0},zoomControlPosition:{type:String,required:!1}},emits:oe,setup(n,{emit:e}){const t=l.ref(),s=l.ref(!1),r=l.ref(),o=l.ref(),a=l.ref(!1);l.provide(b,r),l.provide(T,o),l.provide(se,a);const c=()=>{const u={...n};Object.keys(u).forEach(m=>{u[m]===void 0&&delete u[m]});const f=m=>{var y;return m?{position:(y=o.value)==null?void 0:y.ControlPosition[m]}:{}},g={scaleControlOptions:n.scaleControlStyle?{style:n.scaleControlStyle}:{},panControlOptions:f(n.panControlPosition),zoomControlOptions:f(n.zoomControlPosition),rotateControlOptions:f(n.rotateControlPosition),streetViewControlOptions:f(n.streetViewControlPosition),fullscreenControlOptions:f(n.fullscreenControlPosition),disableDefaultUI:n.disableDefaultUi};return{...u,...g}},i=l.watch([o,r],([u,p])=>{const f=u,g=p;f&&g&&(f.event.addListenerOnce(g,"tilesloaded",()=>{a.value=!0}),setTimeout(i,0))},{immediate:!0}),h=()=>{try{const{apiKey:u,region:p,version:f,language:g,libraries:m}=n;ne=new x({apiKey:u,region:p,version:f,language:g,libraries:m})}catch(u){console.error(u)}},d=u=>{o.value=l.markRaw(u.maps),r.value=l.markRaw(new u.maps.Map(t.value,c()));const p=Me(o.value);o.value[D]=p,oe.forEach(g=>{var m;(m=r.value)==null||m.addListener(g,y=>e(g,y))}),s.value=!0;const f=Object.keys(n).filter(g=>!["apiPromise","apiKey","version","libraries","region","language","center","zoom"].includes(g)).map(g=>l.toRef(n,g));l.watch([()=>n.center,()=>n.zoom,...f],([g,m],[y,w])=>{var O,E,U;const{center:_,zoom:C,...P}=c();(O=r.value)==null||O.setOptions(P),m!==void 0&&m!==w&&((E=r.value)==null||E.setZoom(m));const M=!y||g.lng!==y.lng||g.lat!==y.lat;g&&M&&((U=r.value)==null||U.panTo(g))})};return l.onMounted(()=>{n.apiPromise&&n.apiPromise instanceof Promise?n.apiPromise.then(d):(h(),ne.load().then(d))}),l.onBeforeUnmount(()=>{var u;a.value=!1,r.value&&((u=o.value)==null||u.event.clearInstanceListeners(r.value))}),{mapRef:t,ready:s,map:r,api:o,mapTilesLoaded:a}}}),gt="",F=(n,e)=>{const t=n.__vccOpts||n;for(const[s,r]of e)t[s]=r;return t},Pe={ref:"mapRef",class:"mapdiv"};function Oe(n,e,t,s,r,o){return l.openBlock(),l.createElementBlock("div",null,[l.createElementVNode("div",Pe,null,512),l.renderSlot(n.$slots,"default",l.normalizeProps(l.guardReactiveProps({ready:n.ready,map:n.map,api:n.api,mapTilesLoaded:n.mapTilesLoaded})),void 0,!0)])}const Se=F(Ee,[["render",Oe],["__scopeId","data-v-6654c05e"]]);function Le(n){return n&&n.__esModule&&Object.prototype.hasOwnProperty.call(n,"default")?n.default:n}var xe=function n(e,t){if(e===t)return!0;if(e&&t&&typeof e=="object"&&typeof t=="object"){if(e.constructor!==t.constructor)return!1;var s,r,o;if(Array.isArray(e)){if(s=e.length,s!=t.length)return!1;for(r=s;r--!==0;)if(!n(e[r],t[r]))return!1;return!0}if(e.constructor===RegExp)return e.source===t.source&&e.flags===t.flags;if(e.valueOf!==Object.prototype.valueOf)return e.valueOf()===t.valueOf();if(e.toString!==Object.prototype.toString)return e.toString()===t.toString();if(o=Object.keys(e),s=o.length,s!==Object.keys(t).length)return!1;for(r=s;r--!==0;)if(!Object.prototype.hasOwnProperty.call(t,o[r]))return!1;for(r=s;r--!==0;){var a=o[r];if(!n(e[a],t[a]))return!1}return!0}return e!==e&&t!==t};const I=Le(xe),Ie=n=>n==="Marker",Ae=n=>n===D,B=(n,e,t,s)=>{const r=l.ref(),o=l.inject(b,l.ref()),a=l.inject(T,l.ref()),c=l.inject(te,l.ref()),i=l.computed(()=>!!(c.value&&a.value&&(r.value instanceof a.value.Marker||r.value instanceof a.value[D])));return l.watch([o,t],(h,[d,u])=>{var f,g,m;const p=!I(t.value,u)||o.value!==d;!o.value||!a.value||!p||(r.value?(r.value.setOptions(t.value),i.value&&((f=c.value)==null||f.removeMarker(r.value),(g=c.value)==null||g.addMarker(r.value))):(Ie(n)?r.value=l.markRaw(new a.value[n](t.value)):Ae(n)?r.value=l.markRaw(new a.value[n](t.value)):r.value=l.markRaw(new a.value[n]({...t.value,map:o.value})),i.value?(m=c.value)==null||m.addMarker(r.value):r.value.setMap(o.value),e.forEach(y=>{var w;(w=r.value)==null||w.addListener(y,_=>s(y,_))})))},{immediate:!0}),l.onBeforeUnmount(()=>{var h,d;r.value&&((h=a.value)==null||h.event.clearInstanceListeners(r.value),i.value?(d=c.value)==null||d.removeMarker(r.value):r.value.setMap(null))}),r},ie=["animation_changed","click","dblclick","rightclick","dragstart","dragend","drag","mouseover","mousedown","mouseout","mouseup","draggable_changed","clickable_changed","contextmenu","cursor_changed","flat_changed","rightclick","zindex_changed","icon_changed","position_changed","shape_changed","title_changed","visible_changed"],Te=l.defineComponent({name:"Marker",props:{options:{type:Object,required:!0}},emits:ie,setup(n,{emit:e,expose:t,slots:s}){const r=l.toRef(n,"options"),o=B("Marker",ie,r,e);return l.provide(ee,o),t({marker:o}),()=>{var a;return(a=s.default)==null?void 0:a.call(s)}}}),Re=l.defineComponent({name:"Polyline",props:{options:{type:Object,required:!0}},emits:R,setup(n,{emit:e}){const t=l.toRef(n,"options");return{polyline:B("Polyline",R,t,e)}},render:()=>null}),je=l.defineComponent({name:"Polygon",props:{options:{type:Object,required:!0}},emits:R,setup(n,{emit:e}){const t=l.toRef(n,"options");return{polygon:B("Polygon",R,t,e)}},render:()=>null}),ae=R.concat(["bounds_changed"]),Be=l.defineComponent({name:"Rectangle",props:{options:{type:Object,required:!0}},emits:ae,setup(n,{emit:e}){const t=l.toRef(n,"options");return{rectangle:B("Rectangle",ae,t,e)}},render:()=>null}),le=R.concat(["center_changed","radius_changed"]),$e=l.defineComponent({name:"Circle",props:{options:{type:Object,required:!0}},emits:le,setup(n,{emit:e}){const t=l.toRef(n,"options");return{circle:B("Circle",le,t,e)}},render:()=>null}),qe=l.defineComponent({props:{position:{type:String,required:!0},index:{type:Number,default:1}},emits:["content:loaded"],setup(n,{emit:e}){const t=l.ref(null),s=l.inject(b,l.ref()),r=l.inject(T,l.ref()),o=l.inject(se,l.ref(!1)),a=l.watch([o,r,t],([h,d,u])=>{d&&h&&u&&(c(n.position),e("content:loaded"),setTimeout(a,0))},{immediate:!0}),c=h=>{if(s.value&&r.value&&t.value){const d=r.value.ControlPosition[h];s.value.controls[d].push(t.value)}},i=h=>{if(s.value&&r.value){let d=null;const u=r.value.ControlPosition[h];s.value.controls[u].forEach((p,f)=>{p===t.value&&(d=f)}),d!==null&&s.value.controls[u].removeAt(d)}};return l.onBeforeUnmount(()=>i(n.position)),l.watch(()=>n.position,(h,d)=>{i(d),c(h)}),l.watch(()=>n.index,h=>{h&&t.value&&(t.value.index=n.index)}),{controlRef:t}}}),yt="",Ne={ref:"controlRef",class:"custom-control-wrapper"};function Ze(n,e,t,s,r,o){return l.openBlock(),l.createElementBlock("div",Ne,[l.renderSlot(n.$slots,"default",{},void 0,!0)],512)}const Ue=F(qe,[["render",Ze],["__scopeId","data-v-268ef28d"]]),ce=["closeclick","content_changed","domready","position_changed","visible","zindex_changed"],De=l.defineComponent({inheritAttrs:!1,props:{options:{type:Object,default:()=>({})},modelValue:{type:Boolean}},emits:[...ce,"update:modelValue"],setup(n,{slots:e,emit:t,expose:s}){const r=l.ref(),o=l.ref(),a=l.inject(b,l.ref()),c=l.inject(T,l.ref()),i=l.inject(ee,l.ref());let h,d=n.modelValue;const u=l.computed(()=>{var m;return(m=e.default)==null?void 0:m.call(e).some(y=>y.type!==l.Comment)}),p=m=>{d=m,t("update:modelValue",m)},f=m=>{r.value&&(r.value.open({map:a.value,anchor:i.value,...m}),p(!0))},g=()=>{r.value&&(r.value.close(),p(!1))};return l.onMounted(()=>{l.watch([a,()=>n.options],([m,y],[w,_])=>{var P;const C=!I(y,_)||a.value!==w;a.value&&c.value&&C&&(r.value?(r.value.setOptions({...y,content:u.value?o.value:y.content}),i.value||f()):(r.value=l.markRaw(new c.value.InfoWindow({...y,content:u.value?o.value:y.content})),i.value&&(h=i.value.addListener("click",()=>{f()})),(!i.value||d)&&f(),ce.forEach(M=>{var O;(O=r.value)==null||O.addListener(M,E=>t(M,E))}),(P=r.value)==null||P.addListener("closeclick",()=>p(!1))))},{immediate:!0}),l.watch(()=>n.modelValue,m=>{m!==d&&(m?f():g())})}),l.onBeforeUnmount(()=>{var m;h&&h.remove(),r.value&&((m=c.value)==null||m.event.clearInstanceListeners(r.value),g())}),s({infoWindow:r,open:f,close:g}),{infoWindow:r,infoWindowRef:o,hasSlotContent:u,open:f,close:g}}}),wt="",Fe={key:0,class:"info-window-wrapper"};function Ve(n,e,t,s,r,o){return n.hasSlotContent?(l.openBlock(),l.createElementBlock("div",Fe,[l.createElementVNode("div",l.mergeProps({ref:"infoWindowRef"},n.$attrs),[l.renderSlot(n.$slots,"default",{},void 0,!0)],16)])):l.createCommentVNode("",!0)}const ze=F(De,[["render",Ve],["__scopeId","data-v-f929b615"]]),ue=[Int8Array,Uint8Array,Uint8ClampedArray,Int16Array,Uint16Array,Int32Array,Uint32Array,Float32Array,Float64Array],G=1,q=8;class H{static from(e){if(!(e instanceof ArrayBuffer))throw new Error("Data must be an instance of ArrayBuffer.");const[t,s]=new Uint8Array(e,0,2);if(t!==219)throw new Error("Data does not appear to be in a KDBush format.");const r=s>>4;if(r!==G)throw new Error(`Got v${r} data when expected v${G}.`);const o=ue[s&15];if(!o)throw new Error("Unrecognized array type.");const[a]=new Uint16Array(e,2,1),[c]=new Uint32Array(e,4,1);return new H(c,a,o,e)}constructor(e,t=64,s=Float64Array,r){if(isNaN(e)||e<0)throw new Error(`Unpexpected numItems value: ${e}.`);this.numItems=+e,this.nodeSize=Math.min(Math.max(+t,2),65535),this.ArrayType=s,this.IndexArrayType=e<65536?Uint16Array:Uint32Array;const o=ue.indexOf(this.ArrayType),a=e*2*this.ArrayType.BYTES_PER_ELEMENT,c=e*this.IndexArrayType.BYTES_PER_ELEMENT,i=(8-c%8)%8;if(o<0)throw new Error(`Unexpected typed array class: ${s}.`);r&&r instanceof ArrayBuffer?(this.data=r,this.ids=new this.IndexArrayType(this.data,q,e),this.coords=new this.ArrayType(this.data,q+c+i,e*2),this._pos=e*2,this._finished=!0):(this.data=new ArrayBuffer(q+a+c+i),this.ids=new this.IndexArrayType(this.data,q,e),this.coords=new this.ArrayType(this.data,q+c+i,e*2),this._pos=0,this._finished=!1,new Uint8Array(this.data,0,2).set([219,(G<<4)+o]),new Uint16Array(this.data,2,1)[0]=t,new Uint32Array(this.data,4,1)[0]=e)}add(e,t){const s=this._pos>>1;return this.ids[s]=s,this.coords[this._pos++]=e,this.coords[this._pos++]=t,s}finish(){const e=this._pos>>1;if(e!==this.numItems)throw new Error(`Added ${e} items when expected ${this.numItems}.`);return W(this.ids,this.coords,this.nodeSize,0,this.numItems-1,0),this._finished=!0,this}range(e,t,s,r){if(!this._finished)throw new Error("Data not yet indexed - call index.finish().");const{ids:o,coords:a,nodeSize:c}=this,i=[0,o.length-1,0],h=[];for(;i.length;){const d=i.pop()||0,u=i.pop()||0,p=i.pop()||0;if(u-p<=c){for(let y=p;y<=u;y++){const w=a[2*y],_=a[2*y+1];w>=e&&w<=s&&_>=t&&_<=r&&h.push(o[y])}continue}const f=p+u>>1,g=a[2*f],m=a[2*f+1];g>=e&&g<=s&&m>=t&&m<=r&&h.push(o[f]),(d===0?e<=g:t<=m)&&(i.push(p),i.push(f-1),i.push(1-d)),(d===0?s>=g:r>=m)&&(i.push(f+1),i.push(u),i.push(1-d))}return h}within(e,t,s){if(!this._finished)throw new Error("Data not yet indexed - call index.finish().");const{ids:r,coords:o,nodeSize:a}=this,c=[0,r.length-1,0],i=[],h=s*s;for(;c.length;){const d=c.pop()||0,u=c.pop()||0,p=c.pop()||0;if(u-p<=a){for(let y=p;y<=u;y++)he(o[2*y],o[2*y+1],e,t)<=h&&i.push(r[y]);continue}const f=p+u>>1,g=o[2*f],m=o[2*f+1];he(g,m,e,t)<=h&&i.push(r[f]),(d===0?e-s<=g:t-s<=m)&&(c.push(p),c.push(f-1),c.push(1-d)),(d===0?e+s>=g:t+s>=m)&&(c.push(f+1),c.push(u),c.push(1-d))}return i}}function W(n,e,t,s,r,o){if(r-s<=t)return;const a=s+r>>1;de(n,e,a,s,r,o),W(n,e,t,s,a-1,1-o),W(n,e,t,a+1,r,1-o)}function de(n,e,t,s,r,o){for(;r>s;){if(r-s>600){const h=r-s+1,d=t-s+1,u=Math.log(h),p=.5*Math.exp(2*u/3),f=.5*Math.sqrt(u*p*(h-p)/h)*(d-h/2<0?-1:1),g=Math.max(s,Math.floor(t-d*p/h+f)),m=Math.min(r,Math.floor(t+(h-d)*p/h+f));de(n,e,t,g,m,o)}const a=e[2*t+o];let c=s,i=r;for(N(n,e,s,t),e[2*r+o]>a&&N(n,e,s,r);c<i;){for(N(n,e,c,i),c++,i--;e[2*c+o]<a;)c++;for(;e[2*i+o]>a;)i--}e[2*s+o]===a?N(n,e,s,i):(i++,N(n,e,i,r)),i<=t&&(s=i+1),t<=i&&(r=i-1)}}function N(n,e,t,s){K(n,t,s),K(e,2*t,2*s),K(e,2*t+1,2*s+1)}function K(n,e,t){const s=n[e];n[e]=n[t],n[t]=s}function he(n,e,t,s){const r=n-t,o=e-s;return r*r+o*o}const Ge={minZoom:0,maxZoom:16,minPoints:2,radius:40,extent:512,nodeSize:64,log:!1,generateId:!1,reduce:null,map:n=>n},pe=Math.fround||(n=>e=>(n[0]=+e,n[0]))(new Float32Array(1)),A=2,S=3,J=4,L=5,fe=6;class me{constructor(e){this.options=Object.assign(Object.create(Ge),e),this.trees=new Array(this.options.maxZoom+1),this.stride=this.options.reduce?7:6,this.clusterProps=[]}load(e){const{log:t,minZoom:s,maxZoom:r}=this.options;t&&console.time("total time");const o=`prepare ${e.length} points`;t&&console.time(o),this.points=e;const a=[];for(let i=0;i<e.length;i++){const h=e[i];if(!h.geometry)continue;const[d,u]=h.geometry.coordinates,p=pe(V(d)),f=pe(z(u));a.push(p,f,1/0,i,-1,1),this.options.reduce&&a.push(0)}let c=this.trees[r+1]=this._createTree(a);t&&console.timeEnd(o);for(let i=r;i>=s;i--){const h=+Date.now();c=this.trees[i]=this._createTree(this._cluster(c,i)),t&&console.log("z%d: %d clusters in %dms",i,c.numItems,+Date.now()-h)}return t&&console.timeEnd("total time"),this}getClusters(e,t){let s=((e[0]+180)%360+360)%360-180;const r=Math.max(-90,Math.min(90,e[1]));let o=e[2]===180?180:((e[2]+180)%360+360)%360-180;const a=Math.max(-90,Math.min(90,e[3]));if(e[2]-e[0]>=360)s=-180,o=180;else if(s>o){const u=this.getClusters([s,r,180,a],t),p=this.getClusters([-180,r,o,a],t);return u.concat(p)}const c=this.trees[this._limitZoom(t)],i=c.range(V(s),z(a),V(o),z(r)),h=c.data,d=[];for(const u of i){const p=this.stride*u;d.push(h[p+L]>1?ge(h,p,this.clusterProps):this.points[h[p+S]])}return d}getChildren(e){const t=this._getOriginId(e),s=this._getOriginZoom(e),r="No cluster with the specified id.",o=this.trees[s];if(!o)throw new Error(r);const a=o.data;if(t*this.stride>=a.length)throw new Error(r);const c=this.options.radius/(this.options.extent*Math.pow(2,s-1)),i=a[t*this.stride],h=a[t*this.stride+1],d=o.within(i,h,c),u=[];for(const p of d){const f=p*this.stride;a[f+J]===e&&u.push(a[f+L]>1?ge(a,f,this.clusterProps):this.points[a[f+S]])}if(u.length===0)throw new Error(r);return u}getLeaves(e,t,s){t=t||10,s=s||0;const r=[];return this._appendLeaves(r,e,t,s,0),r}getTile(e,t,s){const r=this.trees[this._limitZoom(e)],o=Math.pow(2,e),{extent:a,radius:c}=this.options,i=c/a,h=(s-i)/o,d=(s+1+i)/o,u={features:[]};return this._addTileFeatures(r.range((t-i)/o,h,(t+1+i)/o,d),r.data,t,s,o,u),t===0&&this._addTileFeatures(r.range(1-i/o,h,1,d),r.data,o,s,o,u),t===o-1&&this._addTileFeatures(r.range(0,h,i/o,d),r.data,-1,s,o,u),u.features.length?u:null}getClusterExpansionZoom(e){let t=this._getOriginZoom(e)-1;for(;t<=this.options.maxZoom;){const s=this.getChildren(e);if(t++,s.length!==1)break;e=s[0].properties.cluster_id}return t}_appendLeaves(e,t,s,r,o){const a=this.getChildren(t);for(const c of a){const i=c.properties;if(i&&i.cluster?o+i.point_count<=r?o+=i.point_count:o=this._appendLeaves(e,i.cluster_id,s,r,o):o<r?o++:e.push(c),e.length===s)break}return o}_createTree(e){const t=new H(e.length/this.stride|0,this.options.nodeSize,Float32Array);for(let s=0;s<e.length;s+=this.stride)t.add(e[s],e[s+1]);return t.finish(),t.data=e,t}_addTileFeatures(e,t,s,r,o,a){for(const c of e){const i=c*this.stride,h=t[i+L]>1;let d,u,p;if(h)d=ye(t,i,this.clusterProps),u=t[i],p=t[i+1];else{const m=this.points[t[i+S]];d=m.properties;const[y,w]=m.geometry.coordinates;u=V(y),p=z(w)}const f={type:1,geometry:[[Math.round(this.options.extent*(u*o-s)),Math.round(this.options.extent*(p*o-r))]],tags:d};let g;h||this.options.generateId?g=t[i+S]:g=this.points[t[i+S]].id,g!==void 0&&(f.id=g),a.features.push(f)}}_limitZoom(e){return Math.max(this.options.minZoom,Math.min(Math.floor(+e),this.options.maxZoom+1))}_cluster(e,t){const{radius:s,extent:r,reduce:o,minPoints:a}=this.options,c=s/(r*Math.pow(2,t)),i=e.data,h=[],d=this.stride;for(let u=0;u<i.length;u+=d){if(i[u+A]<=t)continue;i[u+A]=t;const p=i[u],f=i[u+1],g=e.within(i[u],i[u+1],c),m=i[u+L];let y=m;for(const w of g){const _=w*d;i[_+A]>t&&(y+=i[_+L])}if(y>m&&y>=a){let w=p*m,_=f*m,C,P=-1;const M=((u/d|0)<<5)+(t+1)+this.points.length;for(const O of g){const E=O*d;if(i[E+A]<=t)continue;i[E+A]=t;const U=i[E+L];w+=i[E]*U,_+=i[E+1]*U,i[E+J]=M,o&&(C||(C=this._map(i,u,!0),P=this.clusterProps.length,this.clusterProps.push(C)),o(C,this._map(i,E)))}i[u+J]=M,h.push(w/y,_/y,1/0,M,-1,y),o&&h.push(P)}else{for(let w=0;w<d;w++)h.push(i[u+w]);if(y>1)for(const w of g){const _=w*d;if(!(i[_+A]<=t)){i[_+A]=t;for(let C=0;C<d;C++)h.push(i[_+C])}}}}return h}_getOriginId(e){return e-this.points.length>>5}_getOriginZoom(e){return(e-this.points.length)%32}_map(e,t,s){if(e[t+L]>1){const a=this.clusterProps[e[t+fe]];return s?Object.assign({},a):a}const r=this.points[e[t+S]].properties,o=this.options.map(r);return s&&o===r?Object.assign({},o):o}}function ge(n,e,t){return{type:"Feature",id:n[e+S],properties:ye(n,e,t),geometry:{type:"Point",coordinates:[He(n[e]),We(n[e+1])]}}}function ye(n,e,t){const s=n[e+L],r=s>=1e4?`${Math.round(s/1e3)}k`:s>=1e3?`${Math.round(s/100)/10}k`:s,o=n[e+fe],a=o===-1?{}:Object.assign({},t[o]);return Object.assign(a,{cluster:!0,cluster_id:n[e+S],point_count:s,point_count_abbreviated:r})}function V(n){return n/360+.5}function z(n){const e=Math.sin(n*Math.PI/180),t=.5-.25*Math.log((1+e)/(1-e))/Math.PI;return t<0?0:t>1?1:t}function He(n){return(n-.5)*360}function We(n){const e=(180-n*360)*Math.PI/180;return 360*Math.atan(Math.exp(e))/Math.PI-90}/*! *****************************************************************************
***************************************************************************** */function Ce(r,e,t,s){function n(o){return o instanceof t?o:new t(function(a){a(o)})}return new(t||(t=Promise))(function(o,a){function c(d){try{h(s.next(d))}catch(u){a(u)}}function i(d){try{h(s.throw(d))}catch(u){a(u)}}function h(d){d.done?o(d.value):n(d.value).then(c,i)}h((s=s.apply(r,e||[])).next())})}var be=function r(e,t){if(e===t)return!0;if(e&&t&&typeof e=="object"&&typeof t=="object"){if(e.constructor!==t.constructor)return!1;var s,n,o;if(Array.isArray(e)){if(s=e.length,s!=t.length)return!1;for(n=s;n--!==0;)if(!r(e[n],t[n]))return!1;return!0}if(e.constructor===RegExp)return e.source===t.source&&e.flags===t.flags;if(e.valueOf!==Object.prototype.valueOf)return e.valueOf()===t.valueOf();if(e.toString!==Object.prototype.toString)return e.toString()===t.toString();if(o=Object.keys(e),s=o.length,s!==Object.keys(t).length)return!1;for(n=s;n--!==0;)if(!Object.prototype.hasOwnProperty.call(t,o[n]))return!1;for(n=s;n--!==0;){var a=o[n];if(!r(e[a],t[a]))return!1}return!0}return e!==e&&t!==t};const ne="__googleMapsScriptId";var j;(function(r){r[r.INITIALIZED=0]="INITIALIZED",r[r.LOADING=1]="LOADING",r[r.SUCCESS=2]="SUCCESS",r[r.FAILURE=3]="FAILURE"})(j||(j={}));class x{constructor({apiKey:e,authReferrerPolicy:t,channel:s,client:n,id:o=ne,language:a,libraries:c=[],mapIds:i,nonce:h,region:d,retries:u=3,url:p="https://maps.googleapis.com/maps/api/js",version:f}){if(this.callbacks=[],this.done=!1,this.loading=!1,this.errors=[],this.apiKey=e,this.authReferrerPolicy=t,this.channel=s,this.client=n,this.id=o||ne,this.language=a,this.libraries=c,this.mapIds=i,this.nonce=h,this.region=d,this.retries=u,this.url=p,this.version=f,x.instance){if(!be(this.options,x.instance.options))throw new Error(`Loader must not be called again with different options. ${JSON.stringify(this.options)} !== ${JSON.stringify(x.instance.options)}`);return x.instance}x.instance=this}get options(){return{version:this.version,apiKey:this.apiKey,channel:this.channel,client:this.client,id:this.id,libraries:this.libraries,language:this.language,region:this.region,mapIds:this.mapIds,nonce:this.nonce,url:this.url,authReferrerPolicy:this.authReferrerPolicy}}get status(){return this.errors.length?j.FAILURE:this.done?j.SUCCESS:this.loading?j.LOADING:j.INITIALIZED}get failed(){return this.done&&!this.loading&&this.errors.length>=this.retries+1}createUrl(){let e=this.url;return e+="?callback=__googleMapsCallback",this.apiKey&&(e+=`&key=${this.apiKey}`),this.channel&&(e+=`&channel=${this.channel}`),this.client&&(e+=`&client=${this.client}`),this.libraries.length>0&&(e+=`&libraries=${this.libraries.join(",")}`),this.language&&(e+=`&language=${this.language}`),this.region&&(e+=`&region=${this.region}`),this.version&&(e+=`&v=${this.version}`),this.mapIds&&(e+=`&map_ids=${this.mapIds.join(",")}`),this.authReferrerPolicy&&(e+=`&auth_referrer_policy=${this.authReferrerPolicy}`),e}deleteScript(){const e=document.getElementById(this.id);e&&e.remove()}load(){return this.loadPromise()}loadPromise(){return new Promise((e,t)=>{this.loadCallback(s=>{s?t(s.error):e(window.google)})})}importLibrary(e){return this.execute(),google.maps.importLibrary(e)}loadCallback(e){this.callbacks.push(e),this.execute()}setScript(){var e,t;if(document.getElementById(this.id)){this.callback();return}const s={key:this.apiKey,channel:this.channel,client:this.client,libraries:this.libraries.length&&this.libraries,v:this.version,mapIds:this.mapIds,language:this.language,region:this.region,authReferrerPolicy:this.authReferrerPolicy};Object.keys(s).forEach(o=>!s[o]&&delete s[o]),!((t=(e=window==null?void 0:window.google)===null||e===void 0?void 0:e.maps)===null||t===void 0)&&t.importLibrary||(o=>{let a,c,i,h="The Google Maps JavaScript API",d="google",u="importLibrary",p="__ib__",f=document,g=window;g=g[d]||(g[d]={});const m=g.maps||(g.maps={}),y=new Set,w=new URLSearchParams,_=()=>a||(a=new Promise((C,P)=>Ce(this,void 0,void 0,function*(){var M;yield c=f.createElement("script"),c.id=this.id,w.set("libraries",[...y]+"");for(i in o)w.set(i.replace(/[A-Z]/g,O=>"_"+O[0].toLowerCase()),o[i]);w.set("callback",d+".maps."+p),c.src=this.url+"?"+w,m[p]=C,c.onerror=()=>a=P(Error(h+" could not load.")),c.nonce=this.nonce||((M=f.querySelector("script[nonce]"))===null||M===void 0?void 0:M.nonce)||"",f.head.append(c)})));m[u]?console.warn(h+" only loads once. Ignoring:",o):m[u]=(C,...P)=>y.add(C)&&_().then(()=>m[u](C,...P))})(s);const n=this.libraries.map(o=>this.importLibrary(o));n.length||n.push(this.importLibrary("core")),Promise.all(n).then(()=>this.callback(),o=>{const a=new ErrorEvent("error",{error:o});this.loadErrorCallback(a)})}reset(){this.deleteScript(),this.done=!1,this.loading=!1,this.errors=[],this.onerrorEvent=null}resetIfRetryingFailed(){this.failed&&this.reset()}loadErrorCallback(e){if(this.errors.push(e),this.errors.length<=this.retries){const t=this.errors.length*Math.pow(2,this.errors.length);console.error(`Failed to load Google Maps script, retrying in ${t} ms.`),setTimeout(()=>{this.deleteScript(),this.setScript()},t)}else this.onerrorEvent=e,this.callback()}callback(){this.done=!0,this.loading=!1,this.callbacks.forEach(e=>{e(this.onerrorEvent)}),this.callbacks=[]}execute(){if(this.resetIfRetryingFailed(),this.done)this.callback();else{if(window.google&&window.google.maps&&window.google.maps.version){console.warn("Google Maps already loaded outside @googlemaps/js-api-loader.This may result in undesirable behavior as options and script parameters may not match."),this.callback();return}this.loading||(this.loading=!0,this.setScript())}}}function Me(r){return class extends r.OverlayView{constructor(s){super();Q(this,"element");Q(this,"opts");const{element:n,...o}=s;this.element=n,this.opts=o,this.opts.map&&this.setMap(this.opts.map)}getPosition(){return this.opts.position?this.opts.position instanceof r.LatLng?this.opts.position:new r.LatLng(this.opts.position):null}getVisible(){if(!this.element)return!1;const s=this.element;return s.style.display!=="none"&&s.style.visibility!=="hidden"&&(s.style.opacity===""||Number(s.style.opacity)>.01)}onAdd(){if(!this.element)return;const s=this.getPanes();s&&s.overlayMouseTarget.appendChild(this.element)}draw(){if(!this.element)return;const s=this.getProjection(),n=s==null?void 0:s.fromLatLngToDivPixel(this.getPosition());if(n){this.element.style.position="absolute";const o=this.element.offsetHeight,a=this.element.offsetWidth;let c,i;switch(this.opts.anchorPoint){case"TOP_CENTER":c=n.x-a/2,i=n.y;break;case"BOTTOM_CENTER":c=n.x-a/2,i=n.y-o;break;case"LEFT_CENTER":c=n.x,i=n.y-o/2;break;case"RIGHT_CENTER":c=n.x-a,i=n.y-o/2;break;case"TOP_LEFT":c=n.x,i=n.y;break;case"TOP_RIGHT":c=n.x-a,i=n.y;break;case"BOTTOM_LEFT":c=n.x,i=n.y-o;break;case"BOTTOM_RIGHT":c=n.x-a,i=n.y-o;break;default:c=n.x-a/2,i=n.y-o/2}this.element.style.left=c+"px",this.element.style.top=i+"px",this.element.style.transform=`translateX(${this.opts.offsetX||0}px) translateY(${this.opts.offsetY||0}px)`,this.opts.zIndex&&(this.element.style.zIndex=this.opts.zIndex.toString())}}onRemove(){this.element&&this.element.remove()}setOptions(s){const{element:n,...o}=s;this.element=n,this.opts=o,this.draw()}}}let re;const oe=["bounds_changed","center_changed","click","contextmenu","dblclick","drag","dragend","dragstart","heading_changed","idle","isfractionalzoomenabled_changed","mapcapabilities_changed","maptypeid_changed","mousemove","mouseout","mouseover","projection_changed","renderingtype_changed","rightclick","tilesloaded","tilt_changed","zoom_changed"],Ee=l.defineComponent({props:{apiPromise:{type:Promise},apiKey:{type:String,default:""},version:{type:String,default:"weekly"},libraries:{type:Array,default:()=>["places"]},region:{type:String,required:!1},language:{type:String,required:!1},backgroundColor:{type:String,required:!1},center:{type:Object,default:()=>({lat:0,lng:0})},clickableIcons:{type:Boolean,required:!1,default:void 0},controlSize:{type:Number,required:!1},disableDefaultUi:{type:Boolean,required:!1,default:void 0},disableDoubleClickZoom:{type:Boolean,required:!1,default:void 0},draggable:{type:Boolean,required:!1,default:void 0},draggableCursor:{type:String,required:!1},draggingCursor:{type:String,required:!1},fullscreenControl:{type:Boolean,required:!1,default:void 0},fullscreenControlPosition:{type:String,required:!1},gestureHandling:{type:String,required:!1},heading:{type:Number,required:!1},isFractionalZoomEnabled:{type:Boolean,required:!1,default:void 0},keyboardShortcuts:{type:Boolean,required:!1,default:void 0},mapTypeControl:{type:Boolean,required:!1,default:void 0},mapTypeControlOptions:{type:Object,required:!1},mapTypeId:{type:[Number,String],required:!1},mapId:{type:String,required:!1},maxZoom:{type:Number,required:!1},minZoom:{type:Number,required:!1},noClear:{type:Boolean,required:!1,default:void 0},panControl:{type:Boolean,required:!1,default:void 0},panControlPosition:{type:String,required:!1},restriction:{type:Object,required:!1},rotateControl:{type:Boolean,required:!1,default:void 0},rotateControlPosition:{type:String,required:!1},scaleControl:{type:Boolean,required:!1,default:void 0},scaleControlStyle:{type:Number,required:!1},scrollwheel:{type:Boolean,required:!1,default:void 0},streetView:{type:Object,required:!1},streetViewControl:{type:Boolean,required:!1,default:void 0},streetViewControlPosition:{type:String,required:!1},styles:{type:Array,required:!1},tilt:{type:Number,required:!1},zoom:{type:Number,required:!1},zoomControl:{type:Boolean,required:!1,default:void 0},zoomControlPosition:{type:String,required:!1},nonce:{type:String,default:""}},emits:oe,setup(r,{emit:e}){const t=l.ref(),s=l.ref(!1),n=l.ref(),o=l.ref(),a=l.ref(!1);l.provide(b,n),l.provide(T,o),l.provide(se,a);const c=()=>{const u={...r};Object.keys(u).forEach(m=>{u[m]===void 0&&delete u[m]});const f=m=>{var y;return m?{position:(y=o.value)==null?void 0:y.ControlPosition[m]}:{}},g={scaleControlOptions:r.scaleControlStyle?{style:r.scaleControlStyle}:{},panControlOptions:f(r.panControlPosition),zoomControlOptions:f(r.zoomControlPosition),rotateControlOptions:f(r.rotateControlPosition),streetViewControlOptions:f(r.streetViewControlPosition),fullscreenControlOptions:f(r.fullscreenControlPosition),disableDefaultUI:r.disableDefaultUi};return{...u,...g}},i=l.watch([o,n],([u,p])=>{const f=u,g=p;f&&g&&(f.event.addListenerOnce(g,"tilesloaded",()=>{a.value=!0}),setTimeout(i,0))},{immediate:!0}),h=()=>{try{const{apiKey:u,region:p,version:f,language:g,libraries:m,nonce:y}=r;re=new x({apiKey:u,region:p,version:f,language:g,libraries:m,nonce:y})}catch(u){console.error(u)}},d=u=>{o.value=l.markRaw(u.maps),n.value=l.markRaw(new u.maps.Map(t.value,c()));const p=Me(o.value);o.value[D]=p,oe.forEach(g=>{var m;(m=n.value)==null||m.addListener(g,y=>e(g,y))}),s.value=!0;const f=Object.keys(r).filter(g=>!["apiPromise","apiKey","version","libraries","region","language","center","zoom","nonce"].includes(g)).map(g=>l.toRef(r,g));l.watch([()=>r.center,()=>r.zoom,...f],([g,m],[y,w])=>{var O,E,U;const{center:_,zoom:C,...P}=c();(O=n.value)==null||O.setOptions(P),m!==void 0&&m!==w&&((E=n.value)==null||E.setZoom(m));const M=!y||g.lng!==y.lng||g.lat!==y.lat;g&&M&&((U=n.value)==null||U.panTo(g))})};return l.onMounted(()=>{r.apiPromise&&r.apiPromise instanceof Promise?r.apiPromise.then(d):(h(),re.load().then(d))}),l.onBeforeUnmount(()=>{var u;a.value=!1,n.value&&((u=o.value)==null||u.event.clearInstanceListeners(n.value))}),{mapRef:t,ready:s,map:n,api:o,mapTilesLoaded:a}}}),gt="",F=(r,e)=>{const t=r.__vccOpts||r;for(const[s,n]of e)t[s]=n;return t},Pe={ref:"mapRef",class:"mapdiv"};function Oe(r,e,t,s,n,o){return l.openBlock(),l.createElementBlock("div",null,[l.createElementVNode("div",Pe,null,512),l.renderSlot(r.$slots,"default",l.normalizeProps(l.guardReactiveProps({ready:r.ready,map:r.map,api:r.api,mapTilesLoaded:r.mapTilesLoaded})),void 0,!0)])}const Se=F(Ee,[["render",Oe],["__scopeId","data-v-76180f00"]]);function Le(r){return r&&r.__esModule&&Object.prototype.hasOwnProperty.call(r,"default")?r.default:r}var xe=function r(e,t){if(e===t)return!0;if(e&&t&&typeof e=="object"&&typeof t=="object"){if(e.constructor!==t.constructor)return!1;var s,n,o;if(Array.isArray(e)){if(s=e.length,s!=t.length)return!1;for(n=s;n--!==0;)if(!r(e[n],t[n]))return!1;return!0}if(e.constructor===RegExp)return e.source===t.source&&e.flags===t.flags;if(e.valueOf!==Object.prototype.valueOf)return e.valueOf()===t.valueOf();if(e.toString!==Object.prototype.toString)return e.toString()===t.toString();if(o=Object.keys(e),s=o.length,s!==Object.keys(t).length)return!1;for(n=s;n--!==0;)if(!Object.prototype.hasOwnProperty.call(t,o[n]))return!1;for(n=s;n--!==0;){var a=o[n];if(!r(e[a],t[a]))return!1}return!0}return e!==e&&t!==t};const I=Le(xe),Ie=r=>r==="Marker",Ae=r=>r===D,B=(r,e,t,s)=>{const n=l.ref(),o=l.inject(b,l.ref()),a=l.inject(T,l.ref()),c=l.inject(te,l.ref()),i=l.computed(()=>!!(c.value&&a.value&&(n.value instanceof a.value.Marker||n.value instanceof a.value[D])));return l.watch([o,t],(h,[d,u])=>{var f,g,m;const p=!I(t.value,u)||o.value!==d;!o.value||!a.value||!p||(n.value?(n.value.setOptions(t.value),i.value&&((f=c.value)==null||f.removeMarker(n.value),(g=c.value)==null||g.addMarker(n.value))):(Ie(r)?n.value=l.markRaw(new a.value[r](t.value)):Ae(r)?n.value=l.markRaw(new a.value[r](t.value)):n.value=l.markRaw(new a.value[r]({...t.value,map:o.value})),i.value?(m=c.value)==null||m.addMarker(n.value):n.value.setMap(o.value),e.forEach(y=>{var w;(w=n.value)==null||w.addListener(y,_=>s(y,_))})))},{immediate:!0}),l.onBeforeUnmount(()=>{var h,d;n.value&&((h=a.value)==null||h.event.clearInstanceListeners(n.value),i.value?(d=c.value)==null||d.removeMarker(n.value):n.value.setMap(null))}),n},ie=["animation_changed","click","dblclick","rightclick","dragstart","dragend","drag","mouseover","mousedown","mouseout","mouseup","draggable_changed","clickable_changed","contextmenu","cursor_changed","flat_changed","rightclick","zindex_changed","icon_changed","position_changed","shape_changed","title_changed","visible_changed"],Te=l.defineComponent({name:"Marker",props:{options:{type:Object,required:!0}},emits:ie,setup(r,{emit:e,expose:t,slots:s}){const n=l.toRef(r,"options"),o=B("Marker",ie,n,e);return l.provide(ee,o),t({marker:o}),()=>{var a;return(a=s.default)==null?void 0:a.call(s)}}}),Re=l.defineComponent({name:"Polyline",props:{options:{type:Object,required:!0}},emits:R,setup(r,{emit:e}){const t=l.toRef(r,"options");return{polyline:B("Polyline",R,t,e)}},render:()=>null}),je=l.defineComponent({name:"Polygon",props:{options:{type:Object,required:!0}},emits:R,setup(r,{emit:e}){const t=l.toRef(r,"options");return{polygon:B("Polygon",R,t,e)}},render:()=>null}),ae=R.concat(["bounds_changed"]),Be=l.defineComponent({name:"Rectangle",props:{options:{type:Object,required:!0}},emits:ae,setup(r,{emit:e}){const t=l.toRef(r,"options");return{rectangle:B("Rectangle",ae,t,e)}},render:()=>null}),le=R.concat(["center_changed","radius_changed"]),$e=l.defineComponent({name:"Circle",props:{options:{type:Object,required:!0}},emits:le,setup(r,{emit:e}){const t=l.toRef(r,"options");return{circle:B("Circle",le,t,e)}},render:()=>null}),qe=l.defineComponent({props:{position:{type:String,required:!0},index:{type:Number,default:1}},emits:["content:loaded"],setup(r,{emit:e}){const t=l.ref(null),s=l.inject(b,l.ref()),n=l.inject(T,l.ref()),o=l.inject(se,l.ref(!1)),a=l.watch([o,n,t],([h,d,u])=>{d&&h&&u&&(c(r.position),e("content:loaded"),setTimeout(a,0))},{immediate:!0}),c=h=>{if(s.value&&n.value&&t.value){const d=n.value.ControlPosition[h];s.value.controls[d].push(t.value)}},i=h=>{if(s.value&&n.value){let d=null;const u=n.value.ControlPosition[h];s.value.controls[u].forEach((p,f)=>{p===t.value&&(d=f)}),d!==null&&s.value.controls[u].removeAt(d)}};return l.onBeforeUnmount(()=>i(r.position)),l.watch(()=>r.position,(h,d)=>{i(d),c(h)}),l.watch(()=>r.index,h=>{h&&t.value&&(t.value.index=r.index)}),{controlRef:t}}}),yt="",Ne={ref:"controlRef",class:"custom-control-wrapper"};function Ze(r,e,t,s,n,o){return l.openBlock(),l.createElementBlock("div",Ne,[l.renderSlot(r.$slots,"default",{},void 0,!0)],512)}const Ue=F(qe,[["render",Ze],["__scopeId","data-v-268ef28d"]]),ce=["closeclick","content_changed","domready","position_changed","visible","zindex_changed"],De=l.defineComponent({inheritAttrs:!1,props:{options:{type:Object,default:()=>({})},modelValue:{type:Boolean}},emits:[...ce,"update:modelValue"],setup(r,{slots:e,emit:t,expose:s}){const n=l.ref(),o=l.ref(),a=l.inject(b,l.ref()),c=l.inject(T,l.ref()),i=l.inject(ee,l.ref());let h,d=r.modelValue;const u=l.computed(()=>{var m;return(m=e.default)==null?void 0:m.call(e).some(y=>y.type!==l.Comment)}),p=m=>{d=m,t("update:modelValue",m)},f=m=>{n.value&&(n.value.open({map:a.value,anchor:i.value,...m}),p(!0))},g=()=>{n.value&&(n.value.close(),p(!1))};return l.onMounted(()=>{l.watch([a,()=>r.options],([m,y],[w,_])=>{var P;const C=!I(y,_)||a.value!==w;a.value&&c.value&&C&&(n.value?(n.value.setOptions({...y,content:u.value?o.value:y.content}),i.value||f()):(n.value=l.markRaw(new c.value.InfoWindow({...y,content:u.value?o.value:y.content})),i.value&&(h=i.value.addListener("click",()=>{f()})),(!i.value||d)&&f(),ce.forEach(M=>{var O;(O=n.value)==null||O.addListener(M,E=>t(M,E))}),(P=n.value)==null||P.addListener("closeclick",()=>p(!1))))},{immediate:!0}),l.watch(()=>r.modelValue,m=>{m!==d&&(m?f():g())})}),l.onBeforeUnmount(()=>{var m;h&&h.remove(),n.value&&((m=c.value)==null||m.event.clearInstanceListeners(n.value),g())}),s({infoWindow:n,open:f,close:g}),{infoWindow:n,infoWindowRef:o,hasSlotContent:u,open:f,close:g}}}),wt="",Fe={key:0,class:"info-window-wrapper"};function Ve(r,e,t,s,n,o){return r.hasSlotContent?(l.openBlock(),l.createElementBlock("div",Fe,[l.createElementVNode("div",l.mergeProps({ref:"infoWindowRef"},r.$attrs),[l.renderSlot(r.$slots,"default",{},void 0,!0)],16)])):l.createCommentVNode("",!0)}const ze=F(De,[["render",Ve],["__scopeId","data-v-f929b615"]]),ue=[Int8Array,Uint8Array,Uint8ClampedArray,Int16Array,Uint16Array,Int32Array,Uint32Array,Float32Array,Float64Array],G=1,q=8;class H{static from(e){if(!(e instanceof ArrayBuffer))throw new Error("Data must be an instance of ArrayBuffer.");const[t,s]=new Uint8Array(e,0,2);if(t!==219)throw new Error("Data does not appear to be in a KDBush format.");const n=s>>4;if(n!==G)throw new Error(`Got v${n} data when expected v${G}.`);const o=ue[s&15];if(!o)throw new Error("Unrecognized array type.");const[a]=new Uint16Array(e,2,1),[c]=new Uint32Array(e,4,1);return new H(c,a,o,e)}constructor(e,t=64,s=Float64Array,n){if(isNaN(e)||e<0)throw new Error(`Unpexpected numItems value: ${e}.`);this.numItems=+e,this.nodeSize=Math.min(Math.max(+t,2),65535),this.ArrayType=s,this.IndexArrayType=e<65536?Uint16Array:Uint32Array;const o=ue.indexOf(this.ArrayType),a=e*2*this.ArrayType.BYTES_PER_ELEMENT,c=e*this.IndexArrayType.BYTES_PER_ELEMENT,i=(8-c%8)%8;if(o<0)throw new Error(`Unexpected typed array class: ${s}.`);n&&n instanceof ArrayBuffer?(this.data=n,this.ids=new this.IndexArrayType(this.data,q,e),this.coords=new this.ArrayType(this.data,q+c+i,e*2),this._pos=e*2,this._finished=!0):(this.data=new ArrayBuffer(q+a+c+i),this.ids=new this.IndexArrayType(this.data,q,e),this.coords=new this.ArrayType(this.data,q+c+i,e*2),this._pos=0,this._finished=!1,new Uint8Array(this.data,0,2).set([219,(G<<4)+o]),new Uint16Array(this.data,2,1)[0]=t,new Uint32Array(this.data,4,1)[0]=e)}add(e,t){const s=this._pos>>1;return this.ids[s]=s,this.coords[this._pos++]=e,this.coords[this._pos++]=t,s}finish(){const e=this._pos>>1;if(e!==this.numItems)throw new Error(`Added ${e} items when expected ${this.numItems}.`);return W(this.ids,this.coords,this.nodeSize,0,this.numItems-1,0),this._finished=!0,this}range(e,t,s,n){if(!this._finished)throw new Error("Data not yet indexed - call index.finish().");const{ids:o,coords:a,nodeSize:c}=this,i=[0,o.length-1,0],h=[];for(;i.length;){const d=i.pop()||0,u=i.pop()||0,p=i.pop()||0;if(u-p<=c){for(let y=p;y<=u;y++){const w=a[2*y],_=a[2*y+1];w>=e&&w<=s&&_>=t&&_<=n&&h.push(o[y])}continue}const f=p+u>>1,g=a[2*f],m=a[2*f+1];g>=e&&g<=s&&m>=t&&m<=n&&h.push(o[f]),(d===0?e<=g:t<=m)&&(i.push(p),i.push(f-1),i.push(1-d)),(d===0?s>=g:n>=m)&&(i.push(f+1),i.push(u),i.push(1-d))}return h}within(e,t,s){if(!this._finished)throw new Error("Data not yet indexed - call index.finish().");const{ids:n,coords:o,nodeSize:a}=this,c=[0,n.length-1,0],i=[],h=s*s;for(;c.length;){const d=c.pop()||0,u=c.pop()||0,p=c.pop()||0;if(u-p<=a){for(let y=p;y<=u;y++)he(o[2*y],o[2*y+1],e,t)<=h&&i.push(n[y]);continue}const f=p+u>>1,g=o[2*f],m=o[2*f+1];he(g,m,e,t)<=h&&i.push(n[f]),(d===0?e-s<=g:t-s<=m)&&(c.push(p),c.push(f-1),c.push(1-d)),(d===0?e+s>=g:t+s>=m)&&(c.push(f+1),c.push(u),c.push(1-d))}return i}}function W(r,e,t,s,n,o){if(n-s<=t)return;const a=s+n>>1;de(r,e,a,s,n,o),W(r,e,t,s,a-1,1-o),W(r,e,t,a+1,n,1-o)}function de(r,e,t,s,n,o){for(;n>s;){if(n-s>600){const h=n-s+1,d=t-s+1,u=Math.log(h),p=.5*Math.exp(2*u/3),f=.5*Math.sqrt(u*p*(h-p)/h)*(d-h/2<0?-1:1),g=Math.max(s,Math.floor(t-d*p/h+f)),m=Math.min(n,Math.floor(t+(h-d)*p/h+f));de(r,e,t,g,m,o)}const a=e[2*t+o];let c=s,i=n;for(N(r,e,s,t),e[2*n+o]>a&&N(r,e,s,n);c<i;){for(N(r,e,c,i),c++,i--;e[2*c+o]<a;)c++;for(;e[2*i+o]>a;)i--}e[2*s+o]===a?N(r,e,s,i):(i++,N(r,e,i,n)),i<=t&&(s=i+1),t<=i&&(n=i-1)}}function N(r,e,t,s){K(r,t,s),K(e,2*t,2*s),K(e,2*t+1,2*s+1)}function K(r,e,t){const s=r[e];r[e]=r[t],r[t]=s}function he(r,e,t,s){const n=r-t,o=e-s;return n*n+o*o}const Ge={minZoom:0,maxZoom:16,minPoints:2,radius:40,extent:512,nodeSize:64,log:!1,generateId:!1,reduce:null,map:r=>r},pe=Math.fround||(r=>e=>(r[0]=+e,r[0]))(new Float32Array(1)),A=2,S=3,J=4,L=5,fe=6;class me{constructor(e){this.options=Object.assign(Object.create(Ge),e),this.trees=new Array(this.options.maxZoom+1),this.stride=this.options.reduce?7:6,this.clusterProps=[]}load(e){const{log:t,minZoom:s,maxZoom:n}=this.options;t&&console.time("total time");const o=`prepare ${e.length} points`;t&&console.time(o),this.points=e;const a=[];for(let i=0;i<e.length;i++){const h=e[i];if(!h.geometry)continue;const[d,u]=h.geometry.coordinates,p=pe(V(d)),f=pe(z(u));a.push(p,f,1/0,i,-1,1),this.options.reduce&&a.push(0)}let c=this.trees[n+1]=this._createTree(a);t&&console.timeEnd(o);for(let i=n;i>=s;i--){const h=+Date.now();c=this.trees[i]=this._createTree(this._cluster(c,i)),t&&console.log("z%d: %d clusters in %dms",i,c.numItems,+Date.now()-h)}return t&&console.timeEnd("total time"),this}getClusters(e,t){let s=((e[0]+180)%360+360)%360-180;const n=Math.max(-90,Math.min(90,e[1]));let o=e[2]===180?180:((e[2]+180)%360+360)%360-180;const a=Math.max(-90,Math.min(90,e[3]));if(e[2]-e[0]>=360)s=-180,o=180;else if(s>o){const u=this.getClusters([s,n,180,a],t),p=this.getClusters([-180,n,o,a],t);return u.concat(p)}const c=this.trees[this._limitZoom(t)],i=c.range(V(s),z(a),V(o),z(n)),h=c.data,d=[];for(const u of i){const p=this.stride*u;d.push(h[p+L]>1?ge(h,p,this.clusterProps):this.points[h[p+S]])}return d}getChildren(e){const t=this._getOriginId(e),s=this._getOriginZoom(e),n="No cluster with the specified id.",o=this.trees[s];if(!o)throw new Error(n);const a=o.data;if(t*this.stride>=a.length)throw new Error(n);const c=this.options.radius/(this.options.extent*Math.pow(2,s-1)),i=a[t*this.stride],h=a[t*this.stride+1],d=o.within(i,h,c),u=[];for(const p of d){const f=p*this.stride;a[f+J]===e&&u.push(a[f+L]>1?ge(a,f,this.clusterProps):this.points[a[f+S]])}if(u.length===0)throw new Error(n);return u}getLeaves(e,t,s){t=t||10,s=s||0;const n=[];return this._appendLeaves(n,e,t,s,0),n}getTile(e,t,s){const n=this.trees[this._limitZoom(e)],o=Math.pow(2,e),{extent:a,radius:c}=this.options,i=c/a,h=(s-i)/o,d=(s+1+i)/o,u={features:[]};return this._addTileFeatures(n.range((t-i)/o,h,(t+1+i)/o,d),n.data,t,s,o,u),t===0&&this._addTileFeatures(n.range(1-i/o,h,1,d),n.data,o,s,o,u),t===o-1&&this._addTileFeatures(n.range(0,h,i/o,d),n.data,-1,s,o,u),u.features.length?u:null}getClusterExpansionZoom(e){let t=this._getOriginZoom(e)-1;for(;t<=this.options.maxZoom;){const s=this.getChildren(e);if(t++,s.length!==1)break;e=s[0].properties.cluster_id}return t}_appendLeaves(e,t,s,n,o){const a=this.getChildren(t);for(const c of a){const i=c.properties;if(i&&i.cluster?o+i.point_count<=n?o+=i.point_count:o=this._appendLeaves(e,i.cluster_id,s,n,o):o<n?o++:e.push(c),e.length===s)break}return o}_createTree(e){const t=new H(e.length/this.stride|0,this.options.nodeSize,Float32Array);for(let s=0;s<e.length;s+=this.stride)t.add(e[s],e[s+1]);return t.finish(),t.data=e,t}_addTileFeatures(e,t,s,n,o,a){for(const c of e){const i=c*this.stride,h=t[i+L]>1;let d,u,p;if(h)d=ye(t,i,this.clusterProps),u=t[i],p=t[i+1];else{const m=this.points[t[i+S]];d=m.properties;const[y,w]=m.geometry.coordinates;u=V(y),p=z(w)}const f={type:1,geometry:[[Math.round(this.options.extent*(u*o-s)),Math.round(this.options.extent*(p*o-n))]],tags:d};let g;h||this.options.generateId?g=t[i+S]:g=this.points[t[i+S]].id,g!==void 0&&(f.id=g),a.features.push(f)}}_limitZoom(e){return Math.max(this.options.minZoom,Math.min(Math.floor(+e),this.options.maxZoom+1))}_cluster(e,t){const{radius:s,extent:n,reduce:o,minPoints:a}=this.options,c=s/(n*Math.pow(2,t)),i=e.data,h=[],d=this.stride;for(let u=0;u<i.length;u+=d){if(i[u+A]<=t)continue;i[u+A]=t;const p=i[u],f=i[u+1],g=e.within(i[u],i[u+1],c),m=i[u+L];let y=m;for(const w of g){const _=w*d;i[_+A]>t&&(y+=i[_+L])}if(y>m&&y>=a){let w=p*m,_=f*m,C,P=-1;const M=((u/d|0)<<5)+(t+1)+this.points.length;for(const O of g){const E=O*d;if(i[E+A]<=t)continue;i[E+A]=t;const U=i[E+L];w+=i[E]*U,_+=i[E+1]*U,i[E+J]=M,o&&(C||(C=this._map(i,u,!0),P=this.clusterProps.length,this.clusterProps.push(C)),o(C,this._map(i,E)))}i[u+J]=M,h.push(w/y,_/y,1/0,M,-1,y),o&&h.push(P)}else{for(let w=0;w<d;w++)h.push(i[u+w]);if(y>1)for(const w of g){const _=w*d;if(!(i[_+A]<=t)){i[_+A]=t;for(let C=0;C<d;C++)h.push(i[_+C])}}}}return h}_getOriginId(e){return e-this.points.length>>5}_getOriginZoom(e){return(e-this.points.length)%32}_map(e,t,s){if(e[t+L]>1){const a=this.clusterProps[e[t+fe]];return s?Object.assign({},a):a}const n=this.points[e[t+S]].properties,o=this.options.map(n);return s&&o===n?Object.assign({},o):o}}function ge(r,e,t){return{type:"Feature",id:r[e+S],properties:ye(r,e,t),geometry:{type:"Point",coordinates:[He(r[e]),We(r[e+1])]}}}function ye(r,e,t){const s=r[e+L],n=s>=1e4?`${Math.round(s/1e3)}k`:s>=1e3?`${Math.round(s/100)/10}k`:s,o=r[e+fe],a=o===-1?{}:Object.assign({},t[o]);return Object.assign(a,{cluster:!0,cluster_id:r[e+S],point_count:s,point_count_abbreviated:n})}function V(r){return r/360+.5}function z(r){const e=Math.sin(r*Math.PI/180),t=.5-.25*Math.log((1+e)/(1-e))/Math.PI;return t<0?0:t>1?1:t}function He(r){return(r-.5)*360}function We(r){const e=(180-r*360)*Math.PI/180;return 360*Math.atan(Math.exp(e))/Math.PI-90}/*! *****************************************************************************
Copyright (c) Microsoft Corporation.

@@ -29,3 +29,3 @@

PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */function Y(n,e){var t={};for(var s in n)Object.prototype.hasOwnProperty.call(n,s)&&e.indexOf(s)<0&&(t[s]=n[s]);if(n!=null&&typeof Object.getOwnPropertySymbols=="function")for(var r=0,s=Object.getOwnPropertySymbols(n);r<s.length;r++)e.indexOf(s[r])<0&&Object.prototype.propertyIsEnumerable.call(n,s[r])&&(t[s[r]]=n[s[r]]);return t}class k{static isAdvancedMarkerAvailable(e){return google.maps.marker&&e.getMapCapabilities().isAdvancedMarkersAvailable===!0}static isAdvancedMarker(e){return google.maps.marker&&e instanceof google.maps.marker.AdvancedMarkerElement}static setMap(e,t){this.isAdvancedMarker(e)?e.map=t:e.setMap(t)}static getPosition(e){if(this.isAdvancedMarker(e)){if(e.position){if(e.position instanceof google.maps.LatLng)return e.position;if(e.position.lat&&e.position.lng)return new google.maps.LatLng(e.position.lat,e.position.lng)}return new google.maps.LatLng(null)}return e.getPosition()}static getVisible(e){return this.isAdvancedMarker(e)?!0:e.getVisible()}}class Z{constructor({markers:e,position:t}){this.markers=e,t&&(t instanceof google.maps.LatLng?this._position=t:this._position=new google.maps.LatLng(t))}get bounds(){if(this.markers.length===0&&!this._position)return;const e=new google.maps.LatLngBounds(this._position,this._position);for(const t of this.markers)e.extend(k.getPosition(t));return e}get position(){return this._position||this.bounds.getCenter()}get count(){return this.markers.filter(e=>k.getVisible(e)).length}push(e){this.markers.push(e)}delete(){this.marker&&(k.setMap(this.marker,null),this.marker=void 0),this.markers.length=0}}const Ke=(n,e,t,s)=>{const r=we(n.getBounds(),e,s);return t.filter(o=>r.contains(k.getPosition(o)))},we=(n,e,t)=>{const{northEast:s,southWest:r}=Je(n,e),o=Ye({northEast:s,southWest:r},t);return Xe(o,e)},ve=(n,e,t)=>{const s=we(n,e,t),r=s.getNorthEast(),o=s.getSouthWest();return[o.lng(),o.lat(),r.lng(),r.lat()]},Je=(n,e)=>({northEast:e.fromLatLngToDivPixel(n.getNorthEast()),southWest:e.fromLatLngToDivPixel(n.getSouthWest())}),Ye=({northEast:n,southWest:e},t)=>(n.x+=t,n.y-=t,e.x-=t,e.y+=t,{northEast:n,southWest:e}),Xe=({northEast:n,southWest:e},t)=>{const s=t.fromDivPixelToLatLng(e),r=t.fromDivPixelToLatLng(n);return new google.maps.LatLngBounds(s,r)};class _e{constructor({maxZoom:e=16}){this.maxZoom=e}noop({markers:e}){return et(e)}}class Qe extends _e{constructor(e){var{viewportPadding:t=60}=e,s=Y(e,["viewportPadding"]);super(s),this.viewportPadding=60,this.viewportPadding=t}calculate({markers:e,map:t,mapCanvasProjection:s}){return t.getZoom()>=this.maxZoom?{clusters:this.noop({markers:e}),changed:!1}:{clusters:this.cluster({markers:Ke(t,s,e,this.viewportPadding),map:t,mapCanvasProjection:s})}}}const et=n=>n.map(t=>new Z({position:k.getPosition(t),markers:[t]}));class tt extends _e{constructor(e){var{maxZoom:t,radius:s=60}=e,r=Y(e,["maxZoom","radius"]);super({maxZoom:t}),this.state={zoom:-1},this.superCluster=new me(Object.assign({maxZoom:this.maxZoom,radius:s},r))}calculate(e){let t=!1;const s={zoom:e.map.getZoom()};if(!I(e.markers,this.markers)){t=!0,this.markers=[...e.markers];const r=this.markers.map(o=>{const a=k.getPosition(o);return{type:"Feature",geometry:{type:"Point",coordinates:[a.lng(),a.lat()]},properties:{marker:o}}});this.superCluster.load(r)}return t||(this.state.zoom<=this.maxZoom||s.zoom<=this.maxZoom)&&(t=!I(this.state,s)),this.state=s,t&&(this.clusters=this.cluster(e)),{clusters:this.clusters,changed:t}}cluster({map:e}){return this.superCluster.getClusters([-180,-90,180,90],Math.round(e.getZoom())).map(t=>this.transformCluster(t))}transformCluster({geometry:{coordinates:[e,t]},properties:s}){if(s.cluster)return new Z({markers:this.superCluster.getLeaves(s.cluster_id,1/0).map(o=>o.properties.marker),position:{lat:t,lng:e}});const r=s.marker;return new Z({markers:[r],position:k.getPosition(r)})}}class st extends Qe{constructor(e){var{maxZoom:t,radius:s=60,viewportPadding:r=60}=e,o=Y(e,["maxZoom","radius","viewportPadding"]);super({maxZoom:t,viewportPadding:r}),this.superCluster=new me(Object.assign({maxZoom:this.maxZoom,radius:s},o)),this.state={zoom:-1,view:[0,0,0,0]}}calculate(e){const t={zoom:Math.round(e.map.getZoom()),view:ve(e.map.getBounds(),e.mapCanvasProjection,this.viewportPadding)};let s=!I(this.state,t);if(!I(e.markers,this.markers)){s=!0,this.markers=[...e.markers];const r=this.markers.map(o=>{const a=k.getPosition(o);return{type:"Feature",geometry:{type:"Point",coordinates:[a.lng(),a.lat()]},properties:{marker:o}}});this.superCluster.load(r)}return s&&(this.clusters=this.cluster(e),this.state=t),{clusters:this.clusters,changed:s}}cluster({map:e,mapCanvasProjection:t}){const s={zoom:Math.round(e.getZoom()),view:ve(e.getBounds(),t,this.viewportPadding)};return this.superCluster.getClusters(s.view,s.zoom).map(r=>this.transformCluster(r))}transformCluster({geometry:{coordinates:[e,t]},properties:s}){if(s.cluster)return new Z({markers:this.superCluster.getLeaves(s.cluster_id,1/0).map(o=>o.properties.marker),position:{lat:t,lng:e}});const r=s.marker;return new Z({markers:[r],position:k.getPosition(r)})}}class rt{constructor(e,t){this.markers={sum:e.length};const s=t.map(o=>o.count),r=s.reduce((o,a)=>o+a,0);this.clusters={count:t.length,markers:{mean:r/t.length,sum:r,min:Math.min(...s),max:Math.max(...s)}}}}class nt{render({count:e,position:t},s,r){const a=`<svg fill="${e>Math.max(10,s.clusters.markers.mean)?"#ff0000":"#0000ff"}" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 240 240" width="50" height="50">
***************************************************************************** */function Y(r,e){var t={};for(var s in r)Object.prototype.hasOwnProperty.call(r,s)&&e.indexOf(s)<0&&(t[s]=r[s]);if(r!=null&&typeof Object.getOwnPropertySymbols=="function")for(var n=0,s=Object.getOwnPropertySymbols(r);n<s.length;n++)e.indexOf(s[n])<0&&Object.prototype.propertyIsEnumerable.call(r,s[n])&&(t[s[n]]=r[s[n]]);return t}class k{static isAdvancedMarkerAvailable(e){return google.maps.marker&&e.getMapCapabilities().isAdvancedMarkersAvailable===!0}static isAdvancedMarker(e){return google.maps.marker&&e instanceof google.maps.marker.AdvancedMarkerElement}static setMap(e,t){this.isAdvancedMarker(e)?e.map=t:e.setMap(t)}static getPosition(e){if(this.isAdvancedMarker(e)){if(e.position){if(e.position instanceof google.maps.LatLng)return e.position;if(e.position.lat&&e.position.lng)return new google.maps.LatLng(e.position.lat,e.position.lng)}return new google.maps.LatLng(null)}return e.getPosition()}static getVisible(e){return this.isAdvancedMarker(e)?!0:e.getVisible()}}class Z{constructor({markers:e,position:t}){this.markers=e,t&&(t instanceof google.maps.LatLng?this._position=t:this._position=new google.maps.LatLng(t))}get bounds(){if(this.markers.length===0&&!this._position)return;const e=new google.maps.LatLngBounds(this._position,this._position);for(const t of this.markers)e.extend(k.getPosition(t));return e}get position(){return this._position||this.bounds.getCenter()}get count(){return this.markers.filter(e=>k.getVisible(e)).length}push(e){this.markers.push(e)}delete(){this.marker&&(k.setMap(this.marker,null),this.marker=void 0),this.markers.length=0}}const Ke=(r,e,t,s)=>{const n=we(r.getBounds(),e,s);return t.filter(o=>n.contains(k.getPosition(o)))},we=(r,e,t)=>{const{northEast:s,southWest:n}=Je(r,e),o=Ye({northEast:s,southWest:n},t);return Xe(o,e)},ve=(r,e,t)=>{const s=we(r,e,t),n=s.getNorthEast(),o=s.getSouthWest();return[o.lng(),o.lat(),n.lng(),n.lat()]},Je=(r,e)=>({northEast:e.fromLatLngToDivPixel(r.getNorthEast()),southWest:e.fromLatLngToDivPixel(r.getSouthWest())}),Ye=({northEast:r,southWest:e},t)=>(r.x+=t,r.y-=t,e.x-=t,e.y+=t,{northEast:r,southWest:e}),Xe=({northEast:r,southWest:e},t)=>{const s=t.fromDivPixelToLatLng(e),n=t.fromDivPixelToLatLng(r);return new google.maps.LatLngBounds(s,n)};class _e{constructor({maxZoom:e=16}){this.maxZoom=e}noop({markers:e}){return et(e)}}class Qe extends _e{constructor(e){var{viewportPadding:t=60}=e,s=Y(e,["viewportPadding"]);super(s),this.viewportPadding=60,this.viewportPadding=t}calculate({markers:e,map:t,mapCanvasProjection:s}){return t.getZoom()>=this.maxZoom?{clusters:this.noop({markers:e}),changed:!1}:{clusters:this.cluster({markers:Ke(t,s,e,this.viewportPadding),map:t,mapCanvasProjection:s})}}}const et=r=>r.map(t=>new Z({position:k.getPosition(t),markers:[t]}));class tt extends _e{constructor(e){var{maxZoom:t,radius:s=60}=e,n=Y(e,["maxZoom","radius"]);super({maxZoom:t}),this.state={zoom:-1},this.superCluster=new me(Object.assign({maxZoom:this.maxZoom,radius:s},n))}calculate(e){let t=!1;const s={zoom:e.map.getZoom()};if(!I(e.markers,this.markers)){t=!0,this.markers=[...e.markers];const n=this.markers.map(o=>{const a=k.getPosition(o);return{type:"Feature",geometry:{type:"Point",coordinates:[a.lng(),a.lat()]},properties:{marker:o}}});this.superCluster.load(n)}return t||(this.state.zoom<=this.maxZoom||s.zoom<=this.maxZoom)&&(t=!I(this.state,s)),this.state=s,t&&(this.clusters=this.cluster(e)),{clusters:this.clusters,changed:t}}cluster({map:e}){return this.superCluster.getClusters([-180,-90,180,90],Math.round(e.getZoom())).map(t=>this.transformCluster(t))}transformCluster({geometry:{coordinates:[e,t]},properties:s}){if(s.cluster)return new Z({markers:this.superCluster.getLeaves(s.cluster_id,1/0).map(o=>o.properties.marker),position:{lat:t,lng:e}});const n=s.marker;return new Z({markers:[n],position:k.getPosition(n)})}}class st extends Qe{constructor(e){var{maxZoom:t,radius:s=60,viewportPadding:n=60}=e,o=Y(e,["maxZoom","radius","viewportPadding"]);super({maxZoom:t,viewportPadding:n}),this.superCluster=new me(Object.assign({maxZoom:this.maxZoom,radius:s},o)),this.state={zoom:-1,view:[0,0,0,0]}}calculate(e){const t={zoom:Math.round(e.map.getZoom()),view:ve(e.map.getBounds(),e.mapCanvasProjection,this.viewportPadding)};let s=!I(this.state,t);if(!I(e.markers,this.markers)){s=!0,this.markers=[...e.markers];const n=this.markers.map(o=>{const a=k.getPosition(o);return{type:"Feature",geometry:{type:"Point",coordinates:[a.lng(),a.lat()]},properties:{marker:o}}});this.superCluster.load(n)}return s&&(this.clusters=this.cluster(e),this.state=t),{clusters:this.clusters,changed:s}}cluster({map:e,mapCanvasProjection:t}){const s={zoom:Math.round(e.getZoom()),view:ve(e.getBounds(),t,this.viewportPadding)};return this.superCluster.getClusters(s.view,s.zoom).map(n=>this.transformCluster(n))}transformCluster({geometry:{coordinates:[e,t]},properties:s}){if(s.cluster)return new Z({markers:this.superCluster.getLeaves(s.cluster_id,1/0).map(o=>o.properties.marker),position:{lat:t,lng:e}});const n=s.marker;return new Z({markers:[n],position:k.getPosition(n)})}}class nt{constructor(e,t){this.markers={sum:e.length};const s=t.map(o=>o.count),n=s.reduce((o,a)=>o+a,0);this.clusters={count:t.length,markers:{mean:n/t.length,sum:n,min:Math.min(...s),max:Math.max(...s)}}}}class rt{render({count:e,position:t},s,n){const a=`<svg fill="${e>Math.max(10,s.clusters.markers.mean)?"#ff0000":"#0000ff"}" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 240 240" width="50" height="50">
<circle cx="120" cy="120" opacity=".6" r="70" />

@@ -35,2 +35,2 @@ <circle cx="120" cy="120" opacity=".3" r="90" />

<text x="50%" y="50%" style="fill:#fff" text-anchor="middle" font-size="50" dominant-baseline="middle" font-family="roboto,arial,sans-serif">${e}</text>
</svg>`,c=`Cluster of ${e} markers`,i=Number(google.maps.Marker.MAX_ZINDEX)+e;if(k.isAdvancedMarkerAvailable(r)){const d=document.createElement("div");d.innerHTML=a;const u=d.firstElementChild;u.setAttribute("transform","translate(0 25)");const p={map:r,position:t,zIndex:i,title:c,content:u};return new google.maps.marker.AdvancedMarkerElement(p)}const h={position:t,zIndex:i,title:c,icon:{url:`data:image/svg+xml;base64,${btoa(a)}`,anchor:new google.maps.Point(25,25)}};return new google.maps.Marker(h)}}function ot(n,e){for(let t in e.prototype)n.prototype[t]=e.prototype[t]}class X{constructor(){ot(X,google.maps.OverlayView)}}var $;(function(n){n.CLUSTERING_BEGIN="clusteringbegin",n.CLUSTERING_END="clusteringend",n.CLUSTER_CLICK="click"})($||($={}));const it=(n,e,t)=>{t.fitBounds(e.bounds)};class at extends X{constructor({map:e,markers:t=[],algorithmOptions:s={},algorithm:r=new tt(s),renderer:o=new nt,onClusterClick:a=it}){super(),this.markers=[...t],this.clusters=[],this.algorithm=r,this.renderer=o,this.onClusterClick=a,e&&this.setMap(e)}addMarker(e,t){this.markers.includes(e)||(this.markers.push(e),t||this.render())}addMarkers(e,t){e.forEach(s=>{this.addMarker(s,!0)}),t||this.render()}removeMarker(e,t){const s=this.markers.indexOf(e);return s===-1?!1:(k.setMap(e,null),this.markers.splice(s,1),t||this.render(),!0)}removeMarkers(e,t){let s=!1;return e.forEach(r=>{s=this.removeMarker(r,!0)||s}),s&&!t&&this.render(),s}clearMarkers(e){this.markers.length=0,e||this.render()}render(){const e=this.getMap();if(e instanceof google.maps.Map&&e.getProjection()){google.maps.event.trigger(this,$.CLUSTERING_BEGIN,this);const{clusters:t,changed:s}=this.algorithm.calculate({markers:this.markers,map:e,mapCanvasProjection:this.getProjection()});if(s||s==null){const r=new Set;for(const a of t)a.markers.length==1&&r.add(a.markers[0]);const o=[];for(const a of this.clusters)a.marker!=null&&(a.markers.length==1?r.has(a.marker)||k.setMap(a.marker,null):o.push(a.marker));this.clusters=t,this.renderClusters(),requestAnimationFrame(()=>o.forEach(a=>k.setMap(a,null)))}google.maps.event.trigger(this,$.CLUSTERING_END,this)}}onAdd(){this.idleListener=this.getMap().addListener("idle",this.render.bind(this)),this.render()}onRemove(){google.maps.event.removeListener(this.idleListener),this.reset()}reset(){this.markers.forEach(e=>k.setMap(e,null)),this.clusters.forEach(e=>e.delete()),this.clusters=[]}renderClusters(){const e=new rt(this.markers,this.clusters),t=this.getMap();this.clusters.forEach(s=>{s.markers.length===1?s.marker=s.markers[0]:(s.marker=this.renderer.render(s,e,t),s.markers.forEach(r=>k.setMap(r,null)),this.onClusterClick&&s.marker.addListener("click",r=>{google.maps.event.trigger(this,$.CLUSTER_CLICK,s),this.onClusterClick(r,s,t)})),k.setMap(s.marker,t)})}}const ke=Object.values($),lt=l.defineComponent({name:"MarkerCluster",props:{options:{type:Object,default:()=>({})}},emits:ke,setup(n,{emit:e,expose:t,slots:s}){const r=l.ref(),o=l.inject(b,l.ref()),a=l.inject(T,l.ref());return l.provide(te,r),l.watch(o,()=>{o.value&&(r.value=l.markRaw(new at({map:o.value,algorithm:new st(n.options.algorithmOptions??{}),...n.options})),ke.forEach(c=>{var i;(i=r.value)==null||i.addListener(c,h=>e(c,h))}))},{immediate:!0}),l.onBeforeUnmount(()=>{var c;r.value&&((c=a.value)==null||c.event.clearInstanceListeners(r.value),r.value.clearMarkers(),r.value.setMap(null))}),t({markerCluster:r}),()=>{var c;return(c=s.default)==null?void 0:c.call(s)}}}),ct=l.defineComponent({inheritAttrs:!1,props:{options:{type:Object,required:!0}},setup(n,{slots:e,emit:t,expose:s}){const r=l.ref(),o=l.computed(()=>{var i;return(i=e.default)==null?void 0:i.call(e).some(h=>h.type!==l.Comment)}),a=l.computed(()=>({...n.options,element:r.value})),c=B(D,[],a,t);return s({customMarker:c}),{customMarkerRef:r,customMarker:c,hasSlotContent:o}}}),vt="",ut={key:0,class:"custom-marker-wrapper"};function dt(n,e,t,s,r,o){return n.hasSlotContent?(l.openBlock(),l.createElementBlock("div",ut,[l.createElementVNode("div",l.mergeProps({ref:"customMarkerRef",style:{cursor:n.$attrs.onClick?"pointer":void 0}},n.$attrs),[l.renderSlot(n.$slots,"default",{},void 0,!0)],16)])):l.createCommentVNode("",!0)}const ht=F(ct,[["render",dt],["__scopeId","data-v-4b2eafc1"]]),pt=l.defineComponent({name:"HeatmapLayer",props:{options:{type:Object,default:()=>({})}},setup(n){const e=l.ref(),t=l.inject(b,l.ref()),s=l.inject(T,l.ref());return l.watch([t,()=>n.options],([r,o],[a,c])=>{var h;const i=!I(o,c)||t.value!==a;if(t.value&&s.value&&i){const d=structuredClone(o);if(d.data&&!(d.data instanceof s.value.MVCArray)){const u=s.value.LatLng;d.data=(h=d.data)==null?void 0:h.map(p=>p instanceof u||"location"in p&&(p.location instanceof u||p.location===null)?p:"location"in p?{...p,location:new u(p.location)}:new u(p))}e.value?e.value.setOptions(d):e.value=l.markRaw(new s.value.visualization.HeatmapLayer({...d,map:t.value}))}},{immediate:!0}),l.onBeforeUnmount(()=>{e.value&&e.value.setMap(null)}),{heatmapLayer:e}},render:()=>null});v.Circle=$e,v.CustomControl=Ue,v.CustomMarker=ht,v.GoogleMap=Se,v.HeatmapLayer=pt,v.InfoWindow=ze,v.Marker=Te,v.MarkerCluster=lt,v.Polygon=je,v.Polyline=Re,v.Rectangle=Be,Object.defineProperty(v,Symbol.toStringTag,{value:"Module"})});
</svg>`,c=`Cluster of ${e} markers`,i=Number(google.maps.Marker.MAX_ZINDEX)+e;if(k.isAdvancedMarkerAvailable(n)){const d=document.createElement("div");d.innerHTML=a;const u=d.firstElementChild;u.setAttribute("transform","translate(0 25)");const p={map:n,position:t,zIndex:i,title:c,content:u};return new google.maps.marker.AdvancedMarkerElement(p)}const h={position:t,zIndex:i,title:c,icon:{url:`data:image/svg+xml;base64,${btoa(a)}`,anchor:new google.maps.Point(25,25)}};return new google.maps.Marker(h)}}function ot(r,e){for(let t in e.prototype)r.prototype[t]=e.prototype[t]}class X{constructor(){ot(X,google.maps.OverlayView)}}var $;(function(r){r.CLUSTERING_BEGIN="clusteringbegin",r.CLUSTERING_END="clusteringend",r.CLUSTER_CLICK="click"})($||($={}));const it=(r,e,t)=>{t.fitBounds(e.bounds)};class at extends X{constructor({map:e,markers:t=[],algorithmOptions:s={},algorithm:n=new tt(s),renderer:o=new rt,onClusterClick:a=it}){super(),this.markers=[...t],this.clusters=[],this.algorithm=n,this.renderer=o,this.onClusterClick=a,e&&this.setMap(e)}addMarker(e,t){this.markers.includes(e)||(this.markers.push(e),t||this.render())}addMarkers(e,t){e.forEach(s=>{this.addMarker(s,!0)}),t||this.render()}removeMarker(e,t){const s=this.markers.indexOf(e);return s===-1?!1:(k.setMap(e,null),this.markers.splice(s,1),t||this.render(),!0)}removeMarkers(e,t){let s=!1;return e.forEach(n=>{s=this.removeMarker(n,!0)||s}),s&&!t&&this.render(),s}clearMarkers(e){this.markers.length=0,e||this.render()}render(){const e=this.getMap();if(e instanceof google.maps.Map&&e.getProjection()){google.maps.event.trigger(this,$.CLUSTERING_BEGIN,this);const{clusters:t,changed:s}=this.algorithm.calculate({markers:this.markers,map:e,mapCanvasProjection:this.getProjection()});if(s||s==null){const n=new Set;for(const a of t)a.markers.length==1&&n.add(a.markers[0]);const o=[];for(const a of this.clusters)a.marker!=null&&(a.markers.length==1?n.has(a.marker)||k.setMap(a.marker,null):o.push(a.marker));this.clusters=t,this.renderClusters(),requestAnimationFrame(()=>o.forEach(a=>k.setMap(a,null)))}google.maps.event.trigger(this,$.CLUSTERING_END,this)}}onAdd(){this.idleListener=this.getMap().addListener("idle",this.render.bind(this)),this.render()}onRemove(){google.maps.event.removeListener(this.idleListener),this.reset()}reset(){this.markers.forEach(e=>k.setMap(e,null)),this.clusters.forEach(e=>e.delete()),this.clusters=[]}renderClusters(){const e=new nt(this.markers,this.clusters),t=this.getMap();this.clusters.forEach(s=>{s.markers.length===1?s.marker=s.markers[0]:(s.marker=this.renderer.render(s,e,t),s.markers.forEach(n=>k.setMap(n,null)),this.onClusterClick&&s.marker.addListener("click",n=>{google.maps.event.trigger(this,$.CLUSTER_CLICK,s),this.onClusterClick(n,s,t)})),k.setMap(s.marker,t)})}}const ke=Object.values($),lt=l.defineComponent({name:"MarkerCluster",props:{options:{type:Object,default:()=>({})}},emits:ke,setup(r,{emit:e,expose:t,slots:s}){const n=l.ref(),o=l.inject(b,l.ref()),a=l.inject(T,l.ref());return l.provide(te,n),l.watch(o,()=>{o.value&&(n.value=l.markRaw(new at({map:o.value,algorithm:new st(r.options.algorithmOptions??{}),...r.options})),ke.forEach(c=>{var i;(i=n.value)==null||i.addListener(c,h=>e(c,h))}))},{immediate:!0}),l.onBeforeUnmount(()=>{var c;n.value&&((c=a.value)==null||c.event.clearInstanceListeners(n.value),n.value.clearMarkers(),n.value.setMap(null))}),t({markerCluster:n}),()=>{var c;return(c=s.default)==null?void 0:c.call(s)}}}),ct=l.defineComponent({inheritAttrs:!1,props:{options:{type:Object,required:!0}},setup(r,{slots:e,emit:t,expose:s}){const n=l.ref(),o=l.computed(()=>{var i;return(i=e.default)==null?void 0:i.call(e).some(h=>h.type!==l.Comment)}),a=l.computed(()=>({...r.options,element:n.value})),c=B(D,[],a,t);return s({customMarker:c}),{customMarkerRef:n,customMarker:c,hasSlotContent:o}}}),vt="",ut={key:0,class:"custom-marker-wrapper"};function dt(r,e,t,s,n,o){return r.hasSlotContent?(l.openBlock(),l.createElementBlock("div",ut,[l.createElementVNode("div",l.mergeProps({ref:"customMarkerRef",style:{cursor:r.$attrs.onClick?"pointer":void 0}},r.$attrs),[l.renderSlot(r.$slots,"default",{},void 0,!0)],16)])):l.createCommentVNode("",!0)}const ht=F(ct,[["render",dt],["__scopeId","data-v-4b2eafc1"]]),pt=l.defineComponent({name:"HeatmapLayer",props:{options:{type:Object,default:()=>({})}},setup(r){const e=l.ref(),t=l.inject(b,l.ref()),s=l.inject(T,l.ref());return l.watch([t,()=>r.options],([n,o],[a,c])=>{var h;const i=!I(o,c)||t.value!==a;if(t.value&&s.value&&i){const d=structuredClone(o);if(d.data&&!(d.data instanceof s.value.MVCArray)){const u=s.value.LatLng;d.data=(h=d.data)==null?void 0:h.map(p=>p instanceof u||"location"in p&&(p.location instanceof u||p.location===null)?p:"location"in p?{...p,location:new u(p.location)}:new u(p))}e.value?e.value.setOptions(d):e.value=l.markRaw(new s.value.visualization.HeatmapLayer({...d,map:t.value}))}},{immediate:!0}),l.onBeforeUnmount(()=>{e.value&&e.value.setMap(null)}),{heatmapLayer:e}},render:()=>null});v.Circle=$e,v.CustomControl=Ue,v.CustomMarker=ht,v.GoogleMap=Se,v.HeatmapLayer=pt,v.InfoWindow=ze,v.Marker=Te,v.MarkerCluster=lt,v.Polygon=je,v.Polyline=Re,v.Rectangle=Be,Object.defineProperty(v,Symbol.toStringTag,{value:"Module"})});

9

dist/types/components/GoogleMap.vue.d.ts

@@ -197,2 +197,6 @@ /// <reference types="google.maps" />

};
nonce: {
type: StringConstructor;
default: string;
};
}, {

@@ -398,2 +402,6 @@ mapRef: import("vue").Ref<HTMLElement | undefined>;

};
nonce: {
type: StringConstructor;
default: string;
};
}>> & {

@@ -421,3 +429,4 @@ [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;

zoomControl: boolean;
nonce: string;
}, {}>;
export default _default;

21

package.json
{
"name": "vue3-google-map",
"version": "0.19.0",
"version": "0.20.0",
"license": "MIT",

@@ -9,8 +9,8 @@ "repository": {

},
"homepage": "https://vue3-google-map.netlify.app",
"homepage": "https://vue3-google-map.com",
"description": "A set of composable components for easy use of Google Maps in your Vue 3 projects.",
"unpkg": "dist/index.umd.js",
"jsdelivr": "dist/index.umd.js",
"main": "dist/index.cjs.js",
"module": "dist/index.es.js",
"main": "dist/index.cjs",
"module": "dist/index.mjs",
"files": [

@@ -21,12 +21,11 @@ "dist"

".": {
"import": "./dist/index.es.js",
"require": "./dist/index.cjs.js",
"import": "./dist/index.mjs",
"require": "./dist/index.cjs",
"types": "./dist/types/index.d.ts"
},
"./themes": {
"import": "./dist/themes/index.es.js",
"require": "./dist/themes/index.cjs.js",
"import": "./dist/themes/index.mjs",
"require": "./dist/themes/index.cjs",
"types": "./dist/types/themes/index.d.ts"
},
"./package.json": "./package.json"
}
},

@@ -79,3 +78,3 @@ "typesVersions": {

"vite-plugin-css-injected-by-js": "^3.2.1",
"vitepress": "^1.0.0-rc.4",
"vitepress": "^1.0.0-rc.40",
"vue": "^3.3.4",

@@ -82,0 +81,0 @@ "vue-tsc": "^1.8.8"

804

README.md
# vue3-google-map
![Build Status](https://github.com/inocan-group/vue3-google-map/actions/workflows/build.yml/badge.svg)

@@ -9,3 +10,3 @@ [![License](https://img.shields.io/github/license/inocan-group/vue3-google-map)](https://github.com/inocan-group/vue3-google-map/blob/develop/LICENSE)

Note: Please refer to the [documentation site](https://vue3-google-map.netlify.app/) for rendered examples.
Note: Please refer to the [documentation site](https://vue3-google-map.com/) for rendered examples.

@@ -58,25 +59,22 @@ ## Table of Contents

To construct a map using `vue3-google-map` you'll need to use the base `GoogleMap` component which receives your [Google Maps API key](https://developers.google.com/maps/documentation/javascript/get-api-key), styles (e.g. setting width and height), and any [MapOptions](https://developers.google.com/maps/documentation/javascript/reference/map#MapOptions) to configure your map ([see this](https://github.com/inocan-group/vue3-google-map/blob/develop/src/components/GoogleMap.vue#L57-L218) for all the supported `MapOptions`).
To construct a map using `vue3-google-map` you'll need to use the base `GoogleMap` component which receives your [Google Maps API key](https://developers.google.com/maps/documentation/javascript/get-api-key), styles (e.g. setting width and height), and any [MapOptions](https://developers.google.com/maps/documentation/javascript/reference/map#MapOptions) to configure your map ([see this](https://github.com/inocan-group/vue3-google-map/blob/develop/src/components/GoogleMap.vue#L36-L230) for all the supported `MapOptions`).
Other map features can be added to your map by passing map subcomponents ([Marker](#marker), [Polyline](#polyline), [Polygon](#polygon), [Rectangle](#rectangle), [Circle](#circle), [InfoWindow](#info-window), [CustomMarker](#custom-marker), [CustomControl](#custom-control), or [MarkerCluster](#marker-cluster)) to the default slot of the `GoogleMap` component.
```vue
<script setup>
import { GoogleMap, Marker } from 'vue3-google-map'
const center = { lat: 40.689247, lng: -74.044502 }
</script>
<template>
<GoogleMap api-key="YOUR_GOOGLE_MAPS_API_KEY" style="width: 100%; height: 500px" :center="center" :zoom="15">
<GoogleMap
api-key="YOUR_GOOGLE_MAPS_API_KEY"
style="width: 100%; height: 500px"
:center="center"
:zoom="15"
>
<Marker :options="{ position: center }" />
</GoogleMap>
</template>
<script>
import { defineComponent } from "vue";
import { GoogleMap, Marker } from "vue3-google-map";
export default defineComponent({
components: { GoogleMap, Marker },
setup() {
const center = { lat: 40.689247, lng: -74.044502 };
return { center };
},
});
</script>
```

@@ -86,3 +84,3 @@

This library is intended to be used in a _composable_ fashion and therefore you will find yourself using nested components to build your map rather than just a complicated _inline_ format.
This library is intended to be used in a composable fashion. Therefore you will find yourself using nested components to build your map rather than just a complicated inline format.

@@ -110,22 +108,19 @@ The main mapping component is `GoogleMap`, however the following components are available at your disposal:

```vue
<script setup>
import { GoogleMap, Marker } from 'vue3-google-map'
const center = { lat: 40.689247, lng: -74.044502 }
const markerOptions = { position: center, label: 'L', title: 'LADY LIBERTY' }
</script>
<template>
<GoogleMap api-key="YOUR_GOOGLE_MAPS_API_KEY" style="width: 100%; height: 500px" :center="center" :zoom="15">
<GoogleMap
api-key="YOUR_GOOGLE_MAPS_API_KEY"
style="width: 100%; height: 500px"
:center="center"
:zoom="15"
>
<Marker :options="markerOptions" />
</GoogleMap>
</template>
<script>
import { defineComponent } from "vue";
import { GoogleMap, Marker } from "vue3-google-map";
export default defineComponent({
components: { GoogleMap, Marker },
setup() {
const center = { lat: 40.689247, lng: -74.044502 };
const markerOptions = { position: center, label: "L", title: "LADY LIBERTY" };
return { center, markerOptions };
},
});
</script>
```

@@ -146,34 +141,31 @@

```vue
<script setup>
import { GoogleMap, Polyline } from 'vue3-google-map'
const center = { lat: 0, lng: -180 }
const flightPlanCoordinates = [
{ lat: 37.772, lng: -122.214 },
{ lat: 21.291, lng: -157.821 },
{ lat: -18.142, lng: 178.431 },
{ lat: -27.467, lng: 153.027 },
]
const flightPath = {
path: flightPlanCoordinates,
geodesic: true,
strokeColor: '#FF0000',
strokeOpacity: 1.0,
strokeWeight: 2,
}
</script>
<template>
<GoogleMap api-key="YOUR_GOOGLE_MAPS_API_KEY" style="width: 100%; height: 500px" :center="center" :zoom="3">
<GoogleMap
api-key="YOUR_GOOGLE_MAPS_API_KEY"
style="width: 100%; height: 500px"
:center="center"
:zoom="3"
>
<Polyline :options="flightPath" />
</GoogleMap>
</template>
<script>
import { defineComponent } from "vue";
import { GoogleMap, Polyline } from "vue3-google-map";
export default defineComponent({
components: { GoogleMap, Polyline },
setup() {
const center = { lat: 0, lng: -180 };
const flightPlanCoordinates = [
{ lat: 37.772, lng: -122.214 },
{ lat: 21.291, lng: -157.821 },
{ lat: -18.142, lng: 178.431 },
{ lat: -27.467, lng: 153.027 },
];
const flightPath = {
path: flightPlanCoordinates,
geodesic: true,
strokeColor: "#FF0000",
strokeOpacity: 1.0,
strokeWeight: 2,
};
return { center, flightPath };
},
});
</script>
```

@@ -194,35 +186,32 @@

```vue
<script setup>
import { GoogleMap, Polygon } from 'vue3-google-map'
const center = { lat: 24.886, lng: -70.268 }
const triangleCoords = [
{ lat: 25.774, lng: -80.19 },
{ lat: 18.466, lng: -66.118 },
{ lat: 32.321, lng: -64.757 },
{ lat: 25.774, lng: -80.19 },
]
const bermudaTriangle = {
paths: triangleCoords,
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35,
}
</script>
<template>
<GoogleMap api-key="YOUR_GOOGLE_MAPS_API_KEY" style="width: 100%; height: 500px" :center="center" :zoom="5">
<GoogleMap
api-key="YOUR_GOOGLE_MAPS_API_KEY"
style="width: 100%; height: 500px"
:center="center"
:zoom="5"
>
<Polygon :options="bermudaTriangle" />
</GoogleMap>
</template>
<script>
import { defineComponent } from "vue";
import { GoogleMap, Polygon } from "vue3-google-map";
export default defineComponent({
components: { GoogleMap, Polygon },
setup() {
const center = { lat: 24.886, lng: -70.268 };
const triangleCoords = [
{ lat: 25.774, lng: -80.19 },
{ lat: 18.466, lng: -66.118 },
{ lat: 32.321, lng: -64.757 },
{ lat: 25.774, lng: -80.19 },
];
const bermudaTriangle = {
paths: triangleCoords,
strokeColor: "#FF0000",
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: "#FF0000",
fillOpacity: 0.35,
};
return { center, bermudaTriangle };
},
});
</script>
```

@@ -243,2 +232,21 @@

```vue
<script setup>
import { GoogleMap, Rectangle } from 'vue3-google-map'
const center = { lat: 33.678, lng: -116.243 }
const rectangle = {
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35,
bounds: {
north: 33.685,
south: 33.671,
east: -116.234,
west: -116.251,
},
}
</script>
<template>

@@ -255,29 +263,2 @@ <GoogleMap

</template>
<script>
import { defineComponent } from "vue";
import { GoogleMap, Marker } from "vue3-google-map";
export default defineComponent({
components: { GoogleMap, Marker },
setup() {
const center = { lat: 33.678, lng: -116.243 };
const rectangle = {
strokeColor: "#FF0000",
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: "#FF0000",
fillOpacity: 0.35,
bounds: {
north: 33.685,
south: 33.671,
east: -116.234,
west: -116.251,
},
};
return { center, rectangle };
},
});
</script>
```

@@ -298,2 +279,40 @@

```vue
<script setup>
import { GoogleMap, Circle } from 'vue3-google-map'
const center = { lat: 37.09, lng: -95.712 }
const cities = {
chicago: {
center: { lat: 41.878, lng: -87.629 },
population: 2714856,
},
newyork: {
center: { lat: 40.714, lng: -74.005 },
population: 8405837,
},
losangeles: {
center: { lat: 34.052, lng: -118.243 },
population: 3857799,
},
vancouver: {
center: { lat: 49.25, lng: -123.1 },
population: 603502,
},
}
const circles = {}
for (const key in cities) {
circles[key] = {
center: cities[key].center,
radius: Math.sqrt(cities[key].population) * 100,
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35,
}
}
</script>
<template>

@@ -310,48 +329,2 @@ <GoogleMap

</template>
<script>
import { defineComponent } from "vue";
import { GoogleMap, Circle } from "vue3-google-map";
export default defineComponent({
components: { GoogleMap, Circle },
setup() {
const center = { lat: 37.09, lng: -95.712 };
const cities = {
chicago: {
center: { lat: 41.878, lng: -87.629 },
population: 2714856,
},
newyork: {
center: { lat: 40.714, lng: -74.005 },
population: 8405837,
},
losangeles: {
center: { lat: 34.052, lng: -118.243 },
population: 3857799,
},
vancouver: {
center: { lat: 49.25, lng: -123.1 },
population: 603502,
},
};
const circles = {};
for (const key in cities) {
circles[key] = {
center: cities[key].center,
radius: Math.sqrt(cities[key].population) * 100,
strokeColor: "#FF0000",
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: "#FF0000",
fillOpacity: 0.35,
};
}
return { center, circles };
},
});
</script>
```

@@ -372,22 +345,21 @@

```vue
<script setup>
import { GoogleMap, InfoWindow } from 'vue3-google-map'
const center = { lat: -33.9, lng: 151.1 }
</script>
<template>
<GoogleMap api-key="YOUR_GOOGLE_MAPS_API_KEY" style="width: 100%; height: 500px" :center="center" :zoom="10">
<GoogleMap
api-key="YOUR_GOOGLE_MAPS_API_KEY"
style="width: 100%; height: 500px"
:center="center"
:zoom="10"
>
<InfoWindow :options="{ position: center, content: 'Hello World!' }" />
<InfoWindow :options="{ position: { lat: center.lat, lng: 150.8 } }"> Content passed through slot </InfoWindow>
<InfoWindow :options="{ position: { lat: center.lat, lng: 150.8 } }">
Content passed through slot
</InfoWindow>
</GoogleMap>
</template>
<script>
import { defineComponent } from "vue";
import { GoogleMap, InfoWindow } from "vue3-google-map";
export default defineComponent({
components: { GoogleMap, InfoWindow },
setup() {
const center = { lat: -33.9, lng: 151.1 };
return { center };
},
});
</script>
```

@@ -400,4 +372,15 @@

```vue
<script setup>
import { GoogleMap, Marker, InfoWindow } from 'vue3-google-map'
const center = { lat: -25.363, lng: 131.044 }
</script>
<template>
<GoogleMap api-key="YOUR_GOOGLE_MAPS_API_KEY" style="width: 100%; height: 500px" :center="center" :zoom="4">
<GoogleMap
api-key="YOUR_GOOGLE_MAPS_API_KEY"
style="width: 100%; height: 500px"
:center="center"
:zoom="4"
>
<Marker :options="{ position: center }">

@@ -409,17 +392,15 @@ <InfoWindow>

<div id="bodyContent">
<p>
<b>Uluru</b>, also referred to as <b>Ayers Rock</b>, is a large sandstone rock formation in the southern
part of the Northern Territory, central Australia. It lies 335&#160;km (208&#160;mi) south west of the
nearest large town, Alice Springs; 450&#160;km (280&#160;mi) by road. Kata Tjuta and Uluru are the two
major features of the Uluru - Kata Tjuta National Park. Uluru is sacred to the Pitjantjatjara and
Yankunytjatjara, the Aboriginal people of the area. It has many springs, waterholes, rock caves and
ancient paintings. Uluru is listed as a World Heritage Site.
</p>
<p>
Attribution: Uluru,
<a href="https://en.wikipedia.org/w/index.php?title=Uluru&oldid=297882194">
https://en.wikipedia.org/w/index.php?title=Uluru</a
>
(last visited June 22, 2009).
</p>
<p><b>Uluru</b>, also referred to as <b>Ayers Rock</b>, is a large
sandstone rock formation in the southern part of the
Northern Territory, central Australia. It lies 335&#160;km (208&#160;mi)
south west of the nearest large town, Alice Springs; 450&#160;km
(280&#160;mi) by road. Kata Tjuta and Uluru are the two major
features of the Uluru - Kata Tjuta National Park. Uluru is
sacred to the Pitjantjatjara and Yankunytjatjara, the
Aboriginal people of the area. It has many springs, waterholes,
rock caves and ancient paintings. Uluru is listed as a World
Heritage Site.</p>
<p>Attribution: Uluru, <a href="https://en.wikipedia.org/w/index.php?title=Uluru&oldid=297882194">
https://en.wikipedia.org/w/index.php?title=Uluru</a>
(last visited June 22, 2009).</p>
</div>

@@ -431,16 +412,2 @@ </div>

</template>
<script>
import { defineComponent } from "vue";
import { GoogleMap, Marker, InfoWindow } from "vue3-google-map";
export default defineComponent({
components: { GoogleMap, Marker, InfoWindow },
setup() {
const center = { lat: -25.363, lng: 131.044 };
return { center };
},
});
</script>
```

@@ -453,9 +420,24 @@

```vue
<script setup>
import { ref, watch } from 'vue';
import { GoogleMap, Marker, InfoWindow } from 'vue3-google-map';
const center = { lat: -25.363, lng: 131.044 };
const infowindow = ref(true); // Will be open when mounted
watch(infowindow, (v) => {
alert('infowindow has been ' + (v ? 'opened' : 'closed'));
});
</script>
<template>
<GoogleMap api-key="YOUR_GOOGLE_MAPS_API_KEY" style="width: 100%; height: 500px" :center="center" :zoom="4">
<GoogleMap
api-key="YOUR_GOOGLE_MAPS_API_KEY"
style="width: 100%; height: 500px"
:center="center"
:zoom="4"
>
<Marker :options="{ position: center }">
<InfoWindow v-model="infowindow">
<div id="content">
This is the infowindow content
</div>
<div id="content">This is the infowindow content</div>
</InfoWindow>

@@ -465,22 +447,2 @@ </Marker>

</template>
<script>
import { defineComponent } from "vue";
import { GoogleMap, Marker, InfoWindow } from "vue3-google-map";
export default defineComponent({
components: { GoogleMap, Marker, InfoWindow },
setup() {
const center = { lat: -25.363, lng: 131.044 };
const infowindow = ref(true); // Will be opened when mounted
return { center, infowindow };
},
watch: {
infowindow(v) {
alert('infowindow has been ' + (v ? 'opened' : 'closed'))
}
}
});
</script>
```

@@ -506,4 +468,9 @@

```vue
<script setup>
import { GoogleMap, CustomMarker } from 'vue3-google-map'
```vue
const center = { lat: 52.36834, lng: 4.88635 }
</script>
<template>

@@ -524,16 +491,2 @@ <GoogleMap

</template>
<script>
import { defineComponent } from 'vue'
import { GoogleMap, CustomMarker } from 'vue3-google-map'
export default defineComponent({
components: { GoogleMap, CustomMarker },
setup() {
const center = { lat: 52.36834, lng: 4.88635 }
return { center }
},
})
</script>
```

@@ -555,4 +508,16 @@

```vue
<script setup>
import { GoogleMap, CustomControl } from 'vue3-google-map'
const center = { lat: 35, lng: -95 }
const sayHi = () => alert('Hi!')
</script>
<template>
<GoogleMap api-key="YOUR_GOOGLE_MAPS_API_KEY" style="width: 100%; height: 500px" :center="center" :zoom="13">
<GoogleMap
api-key="YOUR_GOOGLE_MAPS_API_KEY"
style="width: 100%; height: 500px"
:center="center"
:zoom="13"
>
<CustomControl position="BOTTOM_CENTER">

@@ -564,17 +529,2 @@ <button class="custom-btn" @click="sayHi">👋</button>

<script>
import { defineComponent } from "vue";
import { GoogleMap, CustomControl } from "vue3-google-map";
export default defineComponent({
components: { GoogleMap, CustomControl },
setup() {
const center = { lat: 35, lng: -95 };
const sayHi = () => alert("Hi!");
return { center, sayHi };
},
});
</script>
<style scoped>

@@ -610,2 +560,34 @@ .custom-btn {

```vue
<script setup>
import { GoogleMap, Marker, MarkerCluster } from 'vue3-google-map'
const center = { lat: -28.024, lng: 140.887 }
const locations = [
{ lat: -31.56391, lng: 147.154312 },
{ lat: -33.718234, lng: 150.363181 },
{ lat: -33.727111, lng: 150.371124 },
{ lat: -33.848588, lng: 151.209834 },
{ lat: -33.851702, lng: 151.216968 },
{ lat: -34.671264, lng: 150.863657 },
{ lat: -35.304724, lng: 148.662905 },
{ lat: -36.817685, lng: 175.699196 },
{ lat: -36.828611, lng: 175.790222 },
{ lat: -37.75, lng: 145.116667 },
{ lat: -37.759859, lng: 145.128708 },
{ lat: -37.765015, lng: 145.133858 },
{ lat: -37.770104, lng: 145.143299 },
{ lat: -37.7737, lng: 145.145187 },
{ lat: -37.774785, lng: 145.137978 },
{ lat: -37.819616, lng: 144.968119 },
{ lat: -38.330766, lng: 144.695692 },
{ lat: -39.927193, lng: 175.053218 },
{ lat: -41.330162, lng: 174.865694 },
{ lat: -42.734358, lng: 147.439506 },
{ lat: -42.734358, lng: 147.501315 },
{ lat: -42.735258, lng: 147.438 },
{ lat: -43.999792, lng: 170.463352 },
]
</script>
<template>

@@ -619,46 +601,10 @@ <GoogleMap

<MarkerCluster>
<Marker v-for="(location, i) in locations" :options="{ position: location }" :key="i" />
<Marker
v-for="(location, i) in locations"
:key="i"
:options="{ position: location }"
/>
</MarkerCluster>
</GoogleMap>
</template>
<script>
import { defineComponent } from 'vue'
import { GoogleMap, Marker, MarkerCluster } from 'vue3-google-map'
export default defineComponent({
components: { GoogleMap, Marker, MarkerCluster },
setup() {
const center = { lat: -28.024, lng: 140.887 }
const locations = [
{ lat: -31.56391, lng: 147.154312 },
{ lat: -33.718234, lng: 150.363181 },
{ lat: -33.727111, lng: 150.371124 },
{ lat: -33.848588, lng: 151.209834 },
{ lat: -33.851702, lng: 151.216968 },
{ lat: -34.671264, lng: 150.863657 },
{ lat: -35.304724, lng: 148.662905 },
{ lat: -36.817685, lng: 175.699196 },
{ lat: -36.828611, lng: 175.790222 },
{ lat: -37.75, lng: 145.116667 },
{ lat: -37.759859, lng: 145.128708 },
{ lat: -37.765015, lng: 145.133858 },
{ lat: -37.770104, lng: 145.143299 },
{ lat: -37.7737, lng: 145.145187 },
{ lat: -37.774785, lng: 145.137978 },
{ lat: -37.819616, lng: 144.968119 },
{ lat: -38.330766, lng: 144.695692 },
{ lat: -39.927193, lng: 175.053218 },
{ lat: -41.330162, lng: 174.865694 },
{ lat: -42.734358, lng: 147.439506 },
{ lat: -42.734358, lng: 147.501315 },
{ lat: -42.735258, lng: 147.438 },
{ lat: -43.999792, lng: 170.463352 },
]
return { center, locations }
},
})
</script>
```

@@ -683,2 +629,26 @@

```vue
<script setup>
import { GoogleMap, HeatmapLayer } from 'vue3-google-map'
const sanFrancisco = { lat: 37.774546, lng: -122.433523 }
const heatmapData = [
{ location: { lat: 37.782, lng: -122.447 }, weight: 0.5 },
{ lat: 37.782, lng: -122.445 },
{ location: { lat: 37.782, lng: -122.443 }, weight: 2 },
{ location: { lat: 37.782, lng: -122.441 }, weight: 3 },
{ location: { lat: 37.782, lng: -122.439 }, weight: 2 },
{ lat: 37.782, lng: -122.437 },
{ location: { lat: 37.782, lng: -122.435 }, weight: 0.5 },
{ location: { lat: 37.785, lng: -122.447 }, weight: 3 },
{ location: { lat: 37.785, lng: -122.445 }, weight: 2 },
{ lat: 37.785, lng: -122.443 },
{ location: { lat: 37.785, lng: -122.441 }, weight: 0.5 },
{ lat: 37.785, lng: -122.439 },
{ location: { lat: 37.785, lng: -122.437 }, weight: 2 },
{ location: { lat: 37.785, lng: -122.435 }, weight: 3 },
]
</script>
<template>

@@ -695,37 +665,2 @@ <GoogleMap

</template>
<script>
import { defineComponent } from "vue";
import { GoogleMap, HeatmapLayer } from "vue3-google-map";
export default defineComponent({
components: { GoogleMap, HeatmapLayer },
setup() {
const sanFrancisco = { lat: 37.774546, lng: -122.433523 }
const heatmapData = [
{ location: { lat: 37.782, lng: -122.447 }, weight: 0.5 },
{ lat: 37.782, lng: -122.445 },
{ location: { lat: 37.782, lng: -122.443 }, weight: 2 },
{ location: { lat: 37.782, lng: -122.441 }, weight: 3 },
{ location: { lat: 37.782, lng: -122.439 }, weight: 2 },
{ lat: 37.782, lng: -122.437 },
{ location: { lat: 37.782, lng: -122.435 }, weight: 0.5 },
{ location: { lat: 37.785, lng: -122.447 }, weight: 3 },
{ location: { lat: 37.785, lng: -122.445 }, weight: 2 },
{ lat: 37.785, lng: -122.443 },
{ location: { lat: 37.785, lng: -122.441 }, weight: 0.5 },
{ lat: 37.785, lng: -122.439 },
{ location: { lat: 37.785, lng: -122.437 }, weight: 2 },
{ location: { lat: 37.785, lng: -122.435 }, weight: 3 },
];
return {
sanFrancisco,
heatmapData,
}
},
});
</script>
```

@@ -735,3 +670,3 @@

The basic components that `vue3-google-map` provides are fully reactive and will get you pretty far. Should you need to access the Google Maps API, however, the `GoogleMaps` component exposes the following:
The basic components that `vue3-google-map` provides are fully reactive and will get you pretty far. Should you need to access the Google Maps API, however, the `GoogleMap` component exposes the following:

@@ -743,9 +678,43 @@ - `ready`: A boolean indicating when the Google Maps script has been loaded. By this point the map instance has been created, the API is ready for use and event listeners have been set up on the map.

Some usage patterns:
In addition, most of the subcomponents expose their instance should you need it:
- `Marker` exposes `marker` (a [Marker](https://developers.google.com/maps/documentation/javascript/reference/marker#Marker) class instance).
- `Polyline` exposes `polyline` (a [Polyline](https://developers.google.com/maps/documentation/javascript/reference/polygon#Polyline) class instance).
- `Polygon` exposes `polygon` (a [Polygon](https://developers.google.com/maps/documentation/javascript/reference/polygon#Polygon) class instance).
- `Rectangle` exposes `rectangle` (a [Rectangle](https://developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle) class instance).
- `Circle` exposes `circle` (a [Circle](https://developers.google.com/maps/documentation/javascript/reference/polygon#Circle) class instance).
- `InfoWindow` exposes `infoWindow` (an [InfoWindow](https://developers.google.com/maps/documentation/javascript/reference/info-window#InfoWindow) class instance).
- `MarkerCluster` exposes `markerCluster` (a [MarkerClusterer](https://googlemaps.github.io/js-markerclusterer/classes/MarkerClusterer.html) class instance).
- `HeatmapLayer` exposes `heatmapLayer` (a [HeatmapLayer](https://developers.google.com/maps/documentation/javascript/reference/visualization#HeatmapLayer) class instance).
### Usage Patterns
```vue
<script setup>
import { ref, computed, watch } from 'vue'
import { GoogleMap } from 'vue3-google-map'
const mapRef = ref(null)
// First pattern: compute some value using the API or map instance when "ready"
const markerIcon = computed(() => mapRef.value?.ready
? {
url: /* icon image url */,
scaledSize: new mapRef.value.api.Size(20, 20)
}
: null)
// Second pattern: watch for "ready" then do something with the API or map instance
watch(() => mapRef.value?.ready, (ready) => {
if (!ready) return
// do something with the api using `mapRef.value.api`
// or with the map instance using `mapRef.value.map`
})
</script>
<template>
<GoogleMap ref="mapRef">
<template #default="{ ready, api, map, mapTilesLoaded }">
<!-- First pattern: Here you have access to the API and map instance.
<!-- Third pattern: Here you have access to the API and map instance.
"ready" is a boolean that indicates when the Google Maps script

@@ -756,39 +725,46 @@ has been loaded and the api and map instance are ready to be used -->

</template>
```
<script>
import { defineComponent, ref, computed, watch } from 'vue'
Example:
```vue
<script setup>
import { ref, computed, watch } from 'vue'
import { GoogleMap } from 'vue3-google-map'
export default defineComponent({
components: { GoogleMap },
setup() {
const mapRef = ref(null)
const mapRef = ref(null)
const center = { lat: 0, lng: 0 }
// Second pattern: compute some value using the API or map instance when "ready"
const markerIcon = computed(() => mapRef.value?.ready
? {
url: /* icon image url */,
scaledSize: new mapRef.value.api.Size(20, 20)
}
: null)
const _lng = ref(0)
const lng = computed({
get: () => _lng.value,
set: v => {
if (!Number.isFinite(v)) {
_lng.value = 0
} else if (v > 180) {
_lng.value = 180
} else if (v < -180) {
_lng.value = -180
} else {
_lng.value = v
}
},
})
// Third pattern: watch for "ready" then do something with the API or map instance
watch(() => mapRef.value?.ready, (ready) => {
if (!ready) return
watch([() => mapRef.value?.ready, lng], ([ready, lng]) => {
if (!ready)
return
// do something with the api using `mapRef.value.api`
// or with the map instance using `mapRef.value.map`
})
return { mapRef }
},
mapRef.value.map.panTo({ lat: 0, lng })
})
</script>
```
Example:
```vue
<template>
<GoogleMap ref="mapRef" api-key="YOUR_GOOGLE_MAPS_API_KEY" class="map" :center="center" :zoom="2" />
<GoogleMap
ref="mapRef"
api-key="YOUR_GOOGLE_MAPS_API_KEY"
class="map"
:center="center"
:zoom="2"
/>
<label for="lng">Longitude</label>

@@ -798,39 +774,2 @@ <input v-model.number="lng" id="lng" type="number" min="-180" max="180" step="10" />

<script>
import { defineComponent, ref, computed, watch } from "vue";
import { GoogleMap } from "vue3-google-map";
export default defineComponent({
components: { GoogleMap },
setup() {
const mapRef = ref(null);
const center = { lat: 0, lng: 0 };
const _lng = ref(0);
const lng = computed({
get: () => _lng.value,
set: (v) => {
if (!Number.isFinite(v)) {
_lng.value = 0;
} else if (v > 180) {
_lng.value = 180;
} else if (v < -180) {
_lng.value = -180;
} else {
_lng.value = v;
}
},
});
watch(lng, () => {
if (mapRef.value?.ready) {
mapRef.value.map.panTo({ lat: 0, lng: lng.value });
}
});
return { mapRef, center, lng };
},
});
</script>
<style scoped>

@@ -845,3 +784,3 @@ .map {

position: absolute;
content: "";
content: '';
width: 1px;

@@ -854,6 +793,11 @@ height: 100%;

input[type="number"] {
width: 200px;
label {
font-weight: 500;
}
input[type='number'] {
margin-top: 20px;
margin-left: 10px;
outline: 1px solid #ccc;
border-radius: 4px;
}

@@ -863,12 +807,34 @@ </style>

In addition, most of the subcomponents expose their instance should you need it:
### Loading the Google Maps API script externally
- `Marker` exposes `marker` (a [Marker](https://developers.google.com/maps/documentation/javascript/reference/marker#Marker) class instance).
- `Polyline` exposes `polyline` (a [Polyline](https://developers.google.com/maps/documentation/javascript/reference/polygon#Polyline) class instance).
- `Polygon` exposes `polygon` (a [Polygon](https://developers.google.com/maps/documentation/javascript/reference/polygon#Polygon) class instance).
- `Rectangle` exposes `rectangle` (a [Rectangle](https://developers.google.com/maps/documentation/javascript/reference/polygon#Rectangle) class instance).
- `Circle` exposes `circle` (a [Circle](https://developers.google.com/maps/documentation/javascript/reference/polygon#Circle) class instance).
- `InfoWindow` exposes `infoWindow` (an [InfoWindow](https://developers.google.com/maps/documentation/javascript/reference/info-window#InfoWindow) class instance).
- `MarkerCluster` exposes `markerCluster` (a [MarkerClusterer](https://googlemaps.github.io/js-markerclusterer/classes/MarkerClusterer.html) class instance).
By default you would pass your API key as a prop to the `GoogleMap` component and it handles the loading of the Google Maps API script for you. There are cases, however, where you might want to load the script yourself. For example, you might be using other Google Maps components or your Vue app might be a part of a larger app that uses the Google Maps API elsewhere. In these cases you can use the `apiPromise` prop to pass a promise that resolves to the Google Maps API global `google` object.
```vue
<script setup>
import { GoogleMap, Marker } from 'vue3-google-map';
import { Loader } from '@googlemaps/js-api-loader';
const loader = new Loader({
apiKey: '',
version: 'weekly',
libraries: ['places'],
});
const apiPromise = loader.load();
const center = { lat: 40.689247, lng: -74.044502 };
</script>
<template>
<GoogleMap
:api-promise="apiPromise"
style="width: 100%; height: 500px"
:center="center"
:zoom="15"
>
<Marker :options="{ position: center }" />
</GoogleMap>
</template>
```
## Contribution

@@ -875,0 +841,0 @@ 

dist/index.cjs.js
dist/index.es.js
dist/themes/index.cjs.js
dist/themes/index.es.js
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc