Suite

Utilisation de photon dans un dépliant en dehors de la carte

Utilisation de photon dans un dépliant en dehors de la carte


J'utilise le plugin dépliant photon pour demander des adresses comme ici : https://adresse.data.gouv.fr/map/

Cela fonctionne bien et le géocodeur a été ajouté à ma carte. Maintenant, je voudrais mettre le géocodeur en dehors de ma carte dans une boîte de recherche. Y a-t-il un moyen de le faire ?

API_URL = '//api-adresse.data.gouv.fr'; var searchPoints = L.geoJson(null, { onEachFeature: function (feature, layer) { layer.bindPopup(feature.properties.name); } }); function showSearchPoints (geojson) { searchPoints.clearLayers(); searchPoints.addData(geojson); } ; var photonControlOptions = { resultsHandler: showSearchPoints, placeholder:' Ex : Rue Diderot Paris', position: 'topright', url: API_URL + '/search/?', noResultLabel: 'Aucun résultat', }; var map = new L.Map("map", { center : new L.LatLng(49.047, 1.605), calques : [layerstreets], zoom : 13, zoomControl : false, photonControl : true, photonControlOptions : photonControlOptions }); searchPoints.addTo(carte);

Un hack "simple" serait de créer lephotonControlen dehors de l'instanciation de la carte, afin que vous puissiez y conserver une référence. De même, au lieu de l'ajouter directement à la carte, appelez sonsurAjouterméthode pour récupérer le conteneur DOM et le placer là où vous en avez besoin plutôt que dans un coin de carte.

var map = L.map("map", { center: [49.047, 1.605], zoom: 13, zoomControl: false }); var photonControl = new L.Control.Photon(photonControlOptions); var photonContainer = photonControl.onAdd(map); document.body.appendChild(photonContainer);

Démo : http://plnkr.co/edit/jv2qTfX4iXCccMtiL2LG?p=preview


Voir la vidéo: Création du désigne et les éléments importants - Extensions de cils