fix: correct Routes API service usage and fix bus stops missing markers

This commit is contained in:
2026-02-27 22:34:08 -05:00
parent d73926cd77
commit 8e75f24b1e
4 changed files with 45 additions and 38 deletions

View File

@ -41,7 +41,8 @@ export function useDirectionsRoute() {
try {
// Importar librerías necesarias de la nueva API
const { Route } = await google.maps.importLibrary("routes") as any;
const { RoutesService } = await google.maps.importLibrary("routes") as any;
const routeService = new RoutesService();
// Límite de la API de Google Maps Routes: Origen, Destino, y hasta 25 intermediates
const maxPuntosPorChunk = 25;
@ -79,7 +80,7 @@ export function useDirectionsRoute() {
}));
try {
const response = await Route.computeRoutes({
const response = await routeService.computeRoutes({
origin,
destination,
intermediates,

View File

@ -417,7 +417,8 @@ export function useGoogleMaps() {
try {
// Cargar ruta
const { Route } = await google.maps.importLibrary("routes") as any;
const { RoutesService } = await google.maps.importLibrary("routes") as any;
const routeService = new RoutesService();
const tamañoChunk = 25;
@ -451,7 +452,7 @@ export function useGoogleMaps() {
}));
try {
const response = await Route.computeRoutes({
const response = await routeService.computeRoutes({
origin,
destination,
intermediates,

View File

@ -56,11 +56,12 @@ export function useParadaCercana() {
let mejorRutaPuntos: google.maps.LatLng[] = [];
try {
const { Route } = await google.maps.importLibrary("routes") as any;
const { RoutesService } = await google.maps.importLibrary("routes") as any;
const routeService = new RoutesService();
for (const stop of top5) {
try {
const response = await Route.computeRoutes({
const response = await routeService.computeRoutes({
origin: {
location: {
latLng: {

View File

@ -406,41 +406,44 @@ function clearMapMarkers() {
}
async function updateMapMarkers() {
if (!isLoaded.value || !map.value) return;
if (!isLoaded.value || !map.value || isUpdatingMarkers.value) return;
isUpdatingMarkers.value = true;
const currentRequestRouteId = routeStore.selectedRouteId;
const stops = [...routeStore.selectedRouteStops];
if (!currentRequestRouteId || stops.length === 0) {
clearMapMarkers();
return;
try {
if (!currentRequestRouteId || stops.length === 0) {
clearMapMarkers();
return;
}
const selectedRouteObj = routeStore.allRoutes.find(r => r.id === currentRequestRouteId) || { id: currentRequestRouteId, short_name: currentRequestRouteId };
// Llamar al procesador de flujo principal, lo cual limpia el mapa y centra.
await procesarSeleccionDeRuta(selectedRouteObj, stops as BusStop[], map.value);
// ⛔ ABORTAR SI EL USUARIO LIMPIÓ EL MAPA MIENTRAS DIBUJÁBAMOS
if (routeStore.selectedRouteId !== currentRequestRouteId) {
console.log('Abortando dibujado de paradas (la ruta fue limpiada o cambiada)');
return;
}
// Agregar todos los stops como marcadores 'normales' para que se vean en el mapa
stops.forEach(stop => {
// Evitar sobre dibujar si es la cercana (useFlujoPrincipal ya se encargó)
if (paradaCercana.value && stop.id === paradaCercana.value.id) return;
addCleanMarker(
{ lat: stop.latitude, lng: stop.longitude },
stop.name,
'normal',
() => handleBusStopClick(stop)
);
});
} finally {
isUpdatingMarkers.value = false;
}
const selectedRouteObj = routeStore.allRoutes.find(r => r.id === currentRequestRouteId) || { id: currentRequestRouteId, short_name: currentRequestRouteId };
// Llamar al procesador de flujo principal, lo cual limpia el mapa y centra.
await procesarSeleccionDeRuta(selectedRouteObj, stops as BusStop[], map.value);
// ⛔ ABORTAR SI EL USUARIO LIMPIÓ EL MAPA MIENTRAS DIBUJÁBAMOS
if (routeStore.selectedRouteId !== currentRequestRouteId) {
console.log('Abortando dibujado de paradas (la ruta fue limpiada o cambiada)');
return;
}
// Agregar todos los stops como marcadores 'normales' para que se vean en el mapa
const { paradaCercana } = useParadaCercana();
stops.forEach(stop => {
// Evitar sobre dibujar si es la cercana (useFlujoPrincipal ya se encargó)
if (paradaCercana.value && stop.id === paradaCercana.value.id) return;
addCleanMarker(
{ lat: stop.latitude, lng: stop.longitude },
stop.name,
'normal',
() => handleBusStopClick(stop)
);
});
}
function updateMarkersStyles() {
@ -679,8 +682,9 @@ async function calculateWalkingPath(origin: { lat: number, lng: number }, target
// 2. Trazar línea de puntos verde siguiendo RED VIAL PRINCIPAL
try {
const { Route } = await google.maps.importLibrary("routes") as any;
const response = await Route.computeRoutes({
const { RoutesService } = await google.maps.importLibrary("routes") as any;
const routeService = new RoutesService();
const response = await routeService.computeRoutes({
origin: {
location: {
latLng: { latitude: origin.lat, longitude: origin.lng }