Leaflet: Error: el contenedor de mapas ya está inicializado

Parece que está tratando de reiniciar un mapa existente... Los tableros de problemas aquí son más para trabajar con errores y sugerencias de nuevas características. StackOverflow (http://stackoverflow.com/questions/tagged/leaflet) es un mejor lugar para solucionar problemas de uso de la biblioteca. Si cree que esto se debe a un error, publique su caso de ejemplo en un JSFiddle u otro sitio de demostración.

Parece que el problema está relacionado con la implementación en MVVM y no con un error. Intentaré buscar algunos ejemplos de MVVM usando el folleto.

mismo problema aquí ... ¿qué podría ser?

@ralexrdz, ¿ quizás un contenedor que inicializa más de una vez?

@mourner El html es básicamente html head loading js y css y un div con id="map". Y el único js que tengo es
mapa.setView([19.34, -99.15], 12);
L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}', {
atribución: 'Datos del mapa © Colaboradores de OpenStreetMap , CC-BY-SA , Imágenes © Mapbox ',
zoom máximo: 18,
id: 'mapboxMapId,
token de acceso: 'mapboxAccessToken'
}).addTo(mapa);
¿Cómo puede ser que un contenedor se inicialice antes?

tengo el mismo problema, estoy usando un folleto en React

Probablemente será un error del folleto de reacción @epicallan

@danzel estoy usando reaccionar, su error de folleto de reacción, acabo de hacer algunos trucos

@epicallan ¿Puedes explicar lo que hiciste? Tengo el mismo problema con React y Leaflet.

Antes de inicializar el mapa, compruebe si el mapa ya está iniciado o no.

var contenedor = L.DomUtil.get('mapa');
if(contenedor != nulo){
container._leaflet_id = nulo;
}

@Dipinrajc Con este método, no está disponible para arrastrar con el mouse en el mapa.

¿Alguna idea de cómo arrastrar el mapa nuevamente con el mouse @adrielstar ?

Yo soy esta @fillipefeitosa .

HTML:
< div id="mapa" >< /div>

renderizar mapa:
document.getElementById('map').innerHTML = "< div id='map' style='width: 100%; height: 100%;'>";

para recargar el contenido de div donde renderizar el mapa.
Hoop esto también te ayudará

Gracias amigo, pero eso no funcionó. Reemplazó mi var map con el div y el mapa no se carga

Antes de inicializar el mapa, compruebe si el mapa ya está iniciado o no.

var contenedor = L.DomUtil.get('mapa');
if(contenedor != nulo){
container._leaflet_id = nulo;
}

¿Hay un método de folleto existente para esto?

mismo problema conmigo :(

Antes de inicializar el mapa, compruebe si el mapa ya está iniciado o no.
var contenedor = L.DomUtil.get('mapa');
if(contenedor != nulo){
container._leaflet_id = nulo;
}

¿Hay un método de folleto existente para esto?

@enzojimenez , puede crear un método para esto como lo he creado a continuación

function initializingMap() // llame a este método antes de inicializar su mapa.
{
var contenedor = L.DomUtil.get('mapa');
if(contenedor != nulo){
container._leaflet_id = nulo;
}
}

Para resolver el problema, defina:
importar * como Mapa de 'folleto';

@ViewChild ('mapa') mapElement: ElementRef;
mapa: Mapa.Mapa;

this.map = Map.map (this.mapElement.nativeElement, {
zoom máximo: 18
});

Solución aquí: https://www.designlimbo.com/leaflet-ionic-3-and-map-container-is-already-initialized/

como se dice aquí , esta sería la mejor manera de hacerlo:
if (map != undefined) { map.remove(); }

Antes de inicializar el mapa, compruebe si el mapa ya está iniciado o no.

var contenedor = L.DomUtil.get('mapa');
if(contenedor != nulo){
container._leaflet_id = nulo;
}

Eres un ángel