#1 Wed 15 July 2015 13:51
- Olivier82
- Juste Inscrit !
- Date d'inscription: 15 Jul 2015
- Messages: 6
Leaflet - Affichage partiel
Bonjour à tous,
J'utilise leaflet dans le cadre d'une application web basée sur symfony dans des modèles twig (pour expliquer le code exotique dans le javascript).
Je rencontre un problème au niveau de l'affichage des cartes : elle ne s'affiche que partiellement puis si on actualise la page un certain nombre de fois (aléatoire) finissent par s'afficher correctement.
Le code est le suivant :
Code:
var geojson = L.geoJson(gestionnairelayer); geojson.setStyle({"color": 'red', "weight": 1, "fill" : true, smoothFactor: 1, "fillOpacity": 0.025}); var topo = L.tileLayer('{{ topolayer.url|raw }}', {attribution: '{{ topolayer.attribution|raw }}'}); var aerial = L.tileLayer("{{ aeriallayer.url|raw }}", {attribution: "{{ aeriallayer.attribution|raw }}"}); var baseMaps = {"Carte": topo, "Vue aerienne": aerial}; var overlayMaps = {}; var map = L.map('{{ carte.div|raw }}', {center: [{{ carte.latitudeview|raw }}, {{ carte.longitudeview|raw }}], zoom: {{ carte.zoom|raw }}, layers: [topo, geojson]}); L.control.layers(baseMaps, overlayMaps).addTo(map); map.fitBounds(geojson.getBounds()).setMaxBounds(geojson.getBounds());
J'ai identifié la ligne qui pose problème (la carte s'affiche correctement lorsqu'elle est passée en commentaire) mais du coup je ne peux pas rencentrer ma carte sur le layer geojson.
Code:
map.fitBounds(geojson.getBounds()).setMaxBounds(geojson.getBounds());
Quelqu'un aurait-il un conseil pour résoudre ce problème ?
Par avance merci.
Hors ligne
#3 Wed 15 July 2015 17:12
- Olivier82
- Juste Inscrit !
- Date d'inscription: 15 Jul 2015
- Messages: 6
Re: Leaflet - Affichage partiel
Bonjour,
Pourquoi pas un simple :Code:
map.fitBounds(geojson.getBounds())?
Je souhaite en fait limiter les déplacements dans la carte aux limites de ma couche geojson.
Sinon j'ai trouvé une solution.
En fait le code est ambigü. Le centrage est déjà effectué lorsque la carte est créée. Donc j'ai supprimé à la fois les coordonnées du centre de carte ainsi que le niveau de zoom.
Code:
var map = L.map('{{ carte.div|raw }}', {layers: [topo, geojson]});
Hors ligne