Placer un repère depuis une recherche

Le schéma habituel « boîte de recherche plus épingle » : géocodez la requête, puis posez un marqueur sur le premier résultat. C'est le même appel en direct que Ajouter un repère, écrit ici comme un exemple de géocodage.

import { Unmap, maplibregl } from "@unmap/sdk";

const unmap = new Unmap({
  key: "um_live_...",
  container: "map",
  center: [-114.0719, 51.0447],
  zoom: 11,
});

const [place] = await unmap.geocoder.search("Calgary Tower");

new maplibregl.Marker({ color: "#FF3E9A" })
  .setLngLat([place.lng, place.lat])
  .setPopup(new maplibregl.Popup().setText(place.name))
  .addTo(unmap.map!);

Prenez le premier élément du tableau, ou laissez l'utilisateur choisir parmi les autres. place.lng et place.lat sont les nombres à passer à MapLibre. Si vous n'avez besoin que de la coordonnée et pas d'une carte, @unmap/geocoding est le client autonome.

Voir Rechercher un lieu pour la recherche sans épingle, et l'API de géocodage pour la forme du résultat.