@arenarium/maps-integration-google 1.0.16 → 1.0.18

package/dist/main.d.ts

@@ -1,4 +1,4 @@
-import { IMapProvider, IMapProviderMarker, MapProviderEvent } from "@arenarium/maps-core/declarations/interfaces";
+import { IMapProvider, IMapProviderMarker, IMapProviderMarkerCircleOptions, IMapProviderMarkerOptions, MapProviderEvent } from "@arenarium/maps-core/declarations/interfaces";
 import { MapBounds, MapCoordinates, MapParameters, MapViewport } from "@arenarium/maps-core/declarations/types";
 interface GoogleMapsClass {
 	new (container: HTMLElement, options: google.maps.MapOptions): google.maps.Map;
@@ -14,6 +14,7 @@ declare class GoogleMapsProvider implements IMapProvider {
 	private MapMarkerClass;
 	private map;
 	private options;
+	private circles;
 	private listeners;
 	private attributionObserver;
 	private attributionElement;
@@ -28,7 +29,9 @@ declare class GoogleMapsProvider implements IMapProvider {
 	getBounds(): MapBounds;
 	getViewport(): MapViewport;
 	panBy(x: number, y: number): void;
-	createMarker(element: HTMLElement, lat: number, lng: number, zIndex: number): IMapProviderMarker;
+	moveTo(lat: number, lng: number, zoom: number): void;
+	createMarker(options: IMapProviderMarkerOptions): IMapProviderMarker;
+	updateCircles(options: IMapProviderMarkerCircleOptions[], depth: number): void;
 	subscribe(event: MapProviderEvent, callback: () => void): void;
 	unsubscribe(event: MapProviderEvent, callback: () => void): void;
 }

package/dist/main.js

@@ -1 +1 @@
-import*as M from"@arenarium/maps-core/map/attribution";class S{MapClass;MapMarkerClass;map;options;listeners=new Set;attributionObserver;attributionElement;constructor(g,y,s,f){if(this.MapClass=g,this.MapMarkerClass=y,this.options=f,this.map=new this.MapClass(s,{...f,tilt:0,tiltInteractionEnabled:!1,heading:0,headingInteractionEnabled:!1,rotateControl:!1,scaleControl:!1,clickableIcons:!1}),f.attribution==!0||f.attribution==null)this.map.addListener("idle",()=>{if(this.attributionObserver)return;this.attributionObserver=new MutationObserver((T,G)=>{if(this.insertAttributionElement(),this.attributionElement==null)return;this.updateAttributionElement(),G.disconnect()}),this.attributionObserver.observe(s,{childList:!0,subtree:!0})}),this.map.addListener("bounds_changed",()=>{this.updateAttributionElement()})}insertAttributionElement(){let g=this.map.getDiv();if(g==null)return;let y=g.getElementsByClassName("gmnoprint")[0];if(y==null)return;if(y.parentElement==null)return;let s=y.cloneNode(!0),f=s.childNodes.item(0)?.childNodes.item(1)?.childNodes.item(0);if(f==null)return;f.title="",f.innerHTML=M.getHtml(),y.parentElement.insertBefore(s,y),this.attributionElement=f}updateAttributionElement(){let g=this.map.getDiv();if(g==null)return;let y=this.attributionElement?.childNodes.item(0);if(y){y.style.height="14px",y.style.display="inline-flex",y.style.alignItems="center",y.style.gap="1px";let s=y.childNodes.item(0);if(s)s.style.height="12px",s.style.width="auto";let f=y.childNodes.item(1);if(f)f.style.display=g.clientWidth>500?"initial":"none",f.style.color=this.options.colorScheme==google.maps.ColorScheme.DARK?"#fff":"#000"}}getParameters(){return{size:256,zoom:{min:this.options.minZoom??0,max:this.options.maxZoom??24,scale:10}}}getMap(){return this.map}getContainer(){return this.map.getDiv()}getZoom(){return this.map.getZoom()??NaN}getCenter(){let g=this.map.getCenter();if(g==null)return{lat:NaN,lng:NaN};return{lat:g.lat(),lng:g.lng()}}getBounds(){let g=this.map.getBounds();if(g==null)return{sw:{lat:NaN,lng:NaN},ne:{lat:NaN,lng:NaN}};let y=g.getSouthWest(),s=g.getNorthEast();return{sw:{lat:y.lat(),lng:y.lng()},ne:{lat:s.lat(),lng:s.lng()}}}getViewport(){return{bounds:this.getBounds(),center:this.getCenter(),zoom:this.getZoom()}}panBy(g,y){this.map.panBy(g,y)}createMarker(g,y,s,f){let T=new this.MapMarkerClass({position:{lat:y,lng:s},content:g,zIndex:f});return{inserted:()=>T.map!=null&&T.map==this.map,insert:()=>T.map=this.map,remove:()=>T.map=void 0,update:(G)=>T.zIndex=G}}subscribe(g,y){let s=google.maps.event.addListener(this.map,g,y);this.listeners.add({id:s,event:g,callback:y})}unsubscribe(g,y){let s=this.listeners.values().find((f)=>f.event===g&&f.callback===y);if(s==null)return;google.maps.event.removeListener(s.id),this.listeners.delete(s)}}var D=[{elementType:"labels.icon",stylers:[{visibility:"off"}]},{stylers:[{saturation:-100},{lightness:-10}]},{featureType:"landscape",stylers:[{lightness:30}]},{featureType:"road",elementType:"geometry",stylers:[{saturation:-100}]}],P=[{elementType:"labels.icon",stylers:[{visibility:"off"}]},{stylers:[{saturation:-100}]},{elementType:"geometry",stylers:[{lightness:-45}]},{elementType:"labels.text.fill",stylers:[{lightness:-100}]},{elementType:"labels.text.stroke",stylers:[{lightness:-15}]},{featureType:"water",elementType:"geometry",stylers:[{lightness:-50}]}];export{S as GoogleMapsProvider,D as GoogleMapLightStyle,P as GoogleMapDarkStyle};
+function L(){class G extends google.maps.OverlayView{parameters;canvas;context;listeners=[];circles=[];animationFrameId=null;animationDirty=!1;constructor(y,T){super();this.parameters=T,this.canvas=document.createElement("canvas"),this.canvas.style.position="absolute",this.canvas.style.top="0px",this.canvas.style.left="0px",this.canvas.style.transform="translate(-50%, -50%)",this.canvas.style.pointerEvents="none";let f=this.canvas.getContext("2d");if(f==null)throw Error("Failed to get canvas context");this.context=f,this.setMap(y)}onAdd(){this.getPanes().markerLayer.appendChild(this.canvas);let y=this.getMap();this.listeners.push(y.addListener("bounds_changed",()=>this.quedraw())),this.listeners.push(y.addListener("zoom_changed",()=>this.quedraw())),new ResizeObserver(this.resize.bind(this)).observe(y.getDiv()),this.resize()}onRemove(){if(this.canvas.parentNode?.removeChild(this.canvas),this.listeners.forEach((y)=>y.remove()),this.listeners=[],this.animationFrameId!==null)cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null}draw(){this.quedraw()}update(y,T){this.circles=[];for(let f of y){let D=Number.isNaN(f.zoom),J=D?0:f.zoom-T,q=D?1/0:f.zoom;this.circles.push({option:f,threshold:f.zoom,minzoom:J,maxzoom:q,coordinate:{lat:f.lat,lng:f.lng}})}this.circles.sort((f,D)=>D.threshold-f.threshold),this.quedraw()}remove(){this.setMap(null)}resize(){let y=this.getMap();if(!y)return;let T=window.devicePixelRatio||1,f=y.getDiv(),D=f.offsetWidth,J=f.offsetHeight;if(this.canvas.width!==D*T||this.canvas.height!==J*T)this.canvas.width=D*T,this.canvas.height=J*T,this.canvas.style.width=`${D}px`,this.canvas.style.height=`${J}px`,this.context.setTransform(T,0,0,T,0,0)}quedraw(){if(this.animationDirty=!0,this.animationFrameId==null)this.animationFrameId=requestAnimationFrame(()=>{if(this.animationFrameId=null,this.animationDirty)this.animationDirty=!1,this.redraw()})}redraw(){let y=this.getMap(),T=this.getProjection(),f=y.getBounds();if(!y||!T||!f)return;let D=this.context;D.save(),D.clearRect(0,0,this.canvas.width,this.canvas.height),D.translate(this.canvas.width/2,this.canvas.height/2);let J=y.getZoom()??0;for(let q of this.circles)this.redrawCircle(D,q,J,T);D.restore()}redrawCircle(y,T,f,D){let J=Number.isNaN(T.threshold),{option:q,minzoom:Y,maxzoom:$,coordinate:w}=T;if(!(J?!0:f>=Y&&f<$))return;let Q=J?0:N(f,Y,$),S=J?0.5:1,V=U(q.radius.min,q.radius.max,Q),K=F(q.color.min,q.color.max,S,Q),I=F(q.stroke.color.min,q.stroke.color.max,S,Q),j=U(q.stroke.width.min,q.stroke.width.max,Q),R=D.fromLatLngToDivPixel(w);if(!R)return;if(y.save(),y.beginPath(),y.arc(R.x,R.y,V,0,Math.PI*2),y.fillStyle=K,y.fill(),j>0)y.strokeStyle=I,y.lineWidth=j,y.stroke();y.restore()}}return G}function U(G,y,T){return G+(y-G)*Math.max(0,Math.min(1,T))}function F(G,y,T,f){let D=(V)=>{let K=V.slice(V.indexOf("(")+1,V.indexOf(")")).split(",");return[Number(K[0]),Number(K[1]),Number(K[2]),K[3]!==void 0?Number(K[3]):1]},[J,q,Y,$]=D(G),[w,X,Q,S]=D(y);return`rgba(${Math.round(U(J,w,f))},${Math.round(U(q,X,f))},${Math.round(U(Y,Q,f))},${U($*T,S*T,f)})`}function N(G,y,T){if(T===y)return 1;return Math.max(0,Math.min(1,(G-y)/(T-y)))}import*as P from"@arenarium/maps-core/map/attribution";import{MAP_BASE_SIZE as W,MAP_ZOOM_MAX as B,MAP_ZOOM_MIN as H,MAP_ZOOM_SCALE as g}from"@arenarium/maps-core/map/constants";class Z{MapClass;MapMarkerClass;map;options;circles;listeners=new Set;attributionObserver;attributionElement;constructor(G,y,T,f){this.MapClass=G,this.MapMarkerClass=y,this.options=f,this.map=new this.MapClass(T,{...f,minZoom:Math.max(f.minZoom??H,H),maxZoom:Math.min(f.maxZoom??B,B),tilt:0,tiltInteractionEnabled:!1,heading:0,headingInteractionEnabled:!1,rotateControl:!1,scaleControl:!1,clickableIcons:!1});let D=L();if(this.circles=new D(this.map,this.getParameters()),f.attribution==!0||f.attribution==null)this.map.addListener("idle",()=>{if(this.attributionObserver)return;this.attributionObserver=new MutationObserver((J,q)=>{if(this.insertAttributionElement(),this.attributionElement==null)return;this.updateAttributionElement(),q.disconnect()}),this.attributionObserver.observe(T,{childList:!0,subtree:!0})}),this.map.addListener("bounds_changed",()=>{this.updateAttributionElement()})}insertAttributionElement(){let G=this.map.getDiv();if(G==null)return;let y=G.getElementsByClassName("gmnoprint")[0];if(y==null)return;if(y.parentElement==null)return;let T=y.cloneNode(!0),f=T.childNodes.item(0)?.childNodes.item(1)?.childNodes.item(0);if(f==null)return;f.title="",f.innerHTML=P.getHtml(),y.parentElement.insertBefore(T,y),this.attributionElement=f}updateAttributionElement(){let G=this.map.getDiv();if(G==null)return;let y=this.attributionElement?.childNodes.item(0);if(y){y.style.height="14px",y.style.display="inline-flex",y.style.alignItems="center",y.style.gap="1px";let T=y.childNodes.item(0);if(T)T.style.height="12px",T.style.width="auto";let f=y.childNodes.item(1);if(f)f.style.display=G.clientWidth>500?"initial":"none",f.style.color=this.options.colorScheme==google.maps.ColorScheme.DARK?"#fff":"#000"}}getParameters(){return{size:W,zoom:{min:this.options.minZoom??H,max:this.options.maxZoom??B,scale:g}}}getMap(){return this.map}getContainer(){return this.map.getDiv()}getZoom(){return this.map.getZoom()??NaN}getCenter(){let G=this.map.getCenter();if(G==null)return{lat:NaN,lng:NaN};return{lat:G.lat(),lng:G.lng()}}getBounds(){let G=this.map.getBounds();if(G==null)return{sw:{lat:NaN,lng:NaN},ne:{lat:NaN,lng:NaN}};let y=G.getSouthWest(),T=G.getNorthEast();return{sw:{lat:y.lat(),lng:y.lng()},ne:{lat:T.lat(),lng:T.lng()}}}getViewport(){return{bounds:this.getBounds(),center:this.getCenter(),zoom:this.getZoom()}}panBy(G,y){this.map.panBy(G,y)}moveTo(G,y,T){this.map.setCenter({lat:G,lng:y}),this.map.setZoom(T)}createMarker(G){let y=new this.MapMarkerClass({position:{lat:G.lat,lng:G.lng},content:G.element,zIndex:G.z});return{inserted:()=>y.map!=null&&y.map==this.map,insert:()=>y.map=this.map,remove:()=>y.map=void 0,update:(T)=>y.zIndex=T}}updateCircles(G,y){this.circles.update(G,y)}subscribe(G,y){let T=google.maps.event.addListener(this.map,G,y);this.listeners.add({id:T,event:G,callback:y})}unsubscribe(G,y){let T=this.listeners.values().find((f)=>f.event===G&&f.callback===y);if(T==null)return;google.maps.event.removeListener(T.id),this.listeners.delete(T)}}var h=[{elementType:"labels.icon",stylers:[{visibility:"off"}]},{stylers:[{saturation:-100},{lightness:-10}]},{featureType:"landscape",stylers:[{lightness:30}]},{featureType:"road",elementType:"geometry",stylers:[{saturation:-100}]}],A=[{elementType:"labels.icon",stylers:[{visibility:"off"}]},{stylers:[{saturation:-100}]},{elementType:"geometry",stylers:[{lightness:-45}]},{elementType:"labels.text.fill",stylers:[{lightness:-100}]},{elementType:"labels.text.stroke",stylers:[{lightness:-15}]},{featureType:"water",elementType:"geometry",stylers:[{lightness:-50}]}];export{Z as GoogleMapsProvider,h as GoogleMapLightStyle,A as GoogleMapDarkStyle};

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@arenarium/maps-integration-google",
 	"description": "Integration with Google Maps for @arenarium/maps.",
-	"version": "1.0.16",
+	"version": "1.0.18",
 	"type": "module",
 	"files": [
 		"dist"
@@ -35,7 +35,7 @@
 		"@types/google.maps": "^3.58.1"
 	},
 	"dependencies": {
-		"@arenarium/maps-core": "1.0.19"
+		"@arenarium/maps-core": "1.0.20"
 	},
 	"scripts": {
 		"lib_google_check": "bunx tsc --noEmit",