132 lines
4.2 KiB
TypeScript
132 lines
4.2 KiB
TypeScript
import { ref } from 'vue'
|
|
|
|
// Registro global de todo lo que está en el mapa
|
|
const markers = ref<google.maps.Marker[]>([])
|
|
const renderers = ref<google.maps.DirectionsRenderer[]>([])
|
|
const polylines = ref<google.maps.Polyline[]>([])
|
|
const infoWindows = ref<google.maps.InfoWindow[]>([])
|
|
const circles = ref<google.maps.Circle[]>([])
|
|
|
|
// Singleton pattern using composable
|
|
export const useMapState = () => {
|
|
|
|
const registrarMarker = (marker: any) => {
|
|
if (marker) markers.value.push(marker as google.maps.Marker)
|
|
return marker
|
|
}
|
|
|
|
// Registrar un renderer
|
|
const registrarRenderer = (renderer: google.maps.DirectionsRenderer) => {
|
|
if (renderer) renderers.value.push(renderer)
|
|
return renderer
|
|
}
|
|
|
|
// Registrar una polyline
|
|
const registrarPolyline = (polyline: google.maps.Polyline) => {
|
|
if (polyline) polylines.value.push(polyline)
|
|
return polyline
|
|
}
|
|
|
|
// Registrar un circle
|
|
const registrarCircle = (circle: google.maps.Circle) => {
|
|
if (circle) circles.value.push(circle)
|
|
return circle
|
|
}
|
|
|
|
// Registrar un InfoWindow
|
|
const registrarInfoWindow = (infoWindow: google.maps.InfoWindow) => {
|
|
if (infoWindow) infoWindows.value.push(infoWindow)
|
|
return infoWindow
|
|
}
|
|
|
|
// Callback para sincronización externa (ej. useGoogleMaps globalOverlays)
|
|
const onLimpiarCallback = ref<(() => void) | null>(null)
|
|
|
|
const registrarCallbackLimpieza = (fn: () => void) => {
|
|
onLimpiarCallback.value = fn
|
|
}
|
|
|
|
// ⚠️ FUNCIÓN CRÍTICA: limpiar ABSOLUTAMENTE TODO del mapa
|
|
const limpiarMapa = () => {
|
|
// Eliminar markers
|
|
markers.value.forEach(m => {
|
|
try {
|
|
if (m && typeof m.setMap === 'function') m.setMap(null)
|
|
if (m && typeof (m as any).remove === 'function') (m as any).remove() // para HTML markers custom
|
|
if (m && google?.maps?.event?.clearInstanceListeners) {
|
|
google.maps.event.clearInstanceListeners(m)
|
|
}
|
|
} catch (e) {
|
|
console.warn('Error limpiando marker', e)
|
|
}
|
|
})
|
|
markers.value = []
|
|
|
|
// Eliminar renderers de Directions
|
|
renderers.value.forEach(r => {
|
|
try {
|
|
if (r && typeof r.setMap === 'function') r.setMap(null)
|
|
if (r && typeof r.setDirections === 'function') r.setDirections({ routes: [] } as any)
|
|
} catch (e) {
|
|
console.warn('Error limpiando renderer', e)
|
|
}
|
|
})
|
|
renderers.value = []
|
|
|
|
// Eliminar polylines
|
|
polylines.value.forEach(p => {
|
|
try {
|
|
if (p && typeof p.setMap === 'function') p.setMap(null)
|
|
} catch (e) {
|
|
console.warn('Error limpiando polyline', e)
|
|
}
|
|
})
|
|
polylines.value = []
|
|
|
|
// Cerrar y limpiar infoWindows
|
|
infoWindows.value.forEach(iw => {
|
|
try {
|
|
if (iw && typeof iw.close === 'function') iw.close()
|
|
} catch (e) {
|
|
console.warn('Error limpiando infowindow', e)
|
|
}
|
|
})
|
|
infoWindows.value = []
|
|
|
|
// Eliminar circles (pulso de ubicación) // Added custom HTML markers too since they often act as circles
|
|
circles.value.forEach(c => {
|
|
try {
|
|
if (c && typeof c.setMap === 'function') c.setMap(null)
|
|
if (c && typeof (c as any).remove === 'function') (c as any).remove()
|
|
} catch (e) {
|
|
console.warn('Error limpiando circle', e)
|
|
}
|
|
})
|
|
circles.value = []
|
|
|
|
// Ejecutar callback de limpieza externa si existe
|
|
if (onLimpiarCallback.value) {
|
|
try { onLimpiarCallback.value() } catch (e) {
|
|
console.warn('Error en callback de limpieza externa', e)
|
|
}
|
|
}
|
|
|
|
console.log('SIBU | Mapa limpiado completamente ✓')
|
|
}
|
|
|
|
return {
|
|
markers,
|
|
renderers,
|
|
polylines,
|
|
infoWindows,
|
|
circles,
|
|
registrarMarker,
|
|
registrarRenderer,
|
|
registrarPolyline,
|
|
registrarCircle,
|
|
registrarInfoWindow,
|
|
registrarCallbackLimpieza,
|
|
limpiarMapa
|
|
}
|
|
}
|