De acuerdo con esta guía: https://developer.tomtom.com/blog/build- different/adding-tomtom-maps-django-app-building-front-end-map Estoy tratando de usar el tomtom para mi proyecto django y todo funciona bien, excepto la parte del zoom donde el mapa debe hacer zoom de acuerdo con los acordes que le di. El error que obtengo en el registro de la consola del explorador es:
Uncaught (in promise) Error: `LngLatLike` argument must be specified as a LngLat instance, an object {lng: <lng>, lat: <lat>}, an object {lon: <lng>, lat: <lat>}, or an array of [<lng>, <lat>]El código que traté de ejecutar:
// create the map tt.setProductInfo('Google Map', '1.0'); let map = tt.map({ key: '', container: 'map' }); // add store markers let bounds = [] let storeLocations = JSON.parse("{{ locations|escapejs }}"); for (let storeLocation of storeLocations) { let coordinates = [storeLocation.longitude, storeLocation.latitude]; bounds.push(coordinates); // create popup to display store information when the marker is clicked let popup = new tt.Popup().setHTML(` <div class="locator-popup"> <h6>Store Name</h6> <p>${storeLocation.name}</p> <h6>Address</h6> <p>${storeLocation.address}</p> </div> `); let marker = new tt.Marker() .setLngLat(coordinates) .setPopup(popup) .addTo(map); } // zoom the map to fit all markers map.on('load', () => { console.log(bounds) map.fitBounds(bounds, { padding: { top: 50, bottom:50, left: 50, right: 50 } }); })Nota: Estaba pensando que tal vez se deba a los 'límites'. Entonces, comprobé la salida de 'console.log(bounds)' y el resultado es:
[Array(2)] 0: (2) [51.34912743809577, 35.701243277665895] length: 1 lastIndex: (...) lastItem: (...) [[Prototype]]: Array(0)El mapa debe hacer zoom mientras está cargado
fitBounds() necesita dos esquinas: puntos suroeste y noreste. Este error indica más o menos que no obtuvo el argumento LngLatLike. Pero de hecho necesita dos de ellos.
Entonces, para corregir el código, si tiene una sola tienda en la matriz, entonces podría duplicar esa ubicación en la matriz de límites.
Algo como:
if (bounds.length = 1) { bounds.push(bounds[0]) }