Anuncio: Pronto se lanzarán nuevos diseños de mapas base en Google Maps Platform. Esta actualización del diseño de mapas incluye una nueva paleta de colores predeterminada, pines modernizados y mejoras en la experiencia y la usabilidad del mapa. Todos los diseños de mapa se actualizarán automáticamente en marzo de 2025. Para obtener más información sobre la disponibilidad y cómo habilitar esta actualización antes, consulta Nuevo diseño de mapa para Google Maps Platform.
Organiza tus páginas con colecciones
Guarda y categoriza el contenido según tus preferencias.
En esta página, se muestra cómo obtener una clave de API, habilitar las APIs necesarias y cargar la biblioteca de Places para que puedas trabajar con la clase Place.
Obtén una clave de API y habilita las APIs necesarias
Antes de usar la clase Place, debes hacer lo siguiente:
Crea un proyecto de Cloud con una cuenta de facturación.
Obtén una clave de API.
Habilita las siguientes APIs:
API de Maps JavaScript
API de Places
API de Places (versión nueva, requerida para poder usar Text Search [nueva])
Para cargar la biblioteca de Places, primero carga la API de Maps JavaScript. Para ello, agrega el cargador de arranque intercalado al código de tu aplicación, como se muestra en el siguiente fragmento:
<script>
(g=>{varh,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});vard=b.maps||(b.maps={}),r=newSet,e=newURLSearchParams,u=()=>h||(h=newPromise(async(f,n)=>{await(a=m.createElement("script"));e.set("libraries",[...r]+"");for(king)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=>h=n(Error(p+" could not load."));a.nonce=m.querySelector("script[nonce]")?.nonce||"";m.head.append(a)}));d[l]?console.warn(p+" only loads once. Ignoring:",g):d[l]=(f,...n)=>r.add(f)&&u().then(()=>d[l](f,...n))})({key:"YOUR_API_KEY",v:"weekly",// Use the 'v' parameter to indicate the version to use (weekly, beta, alpha, etc.).// Add other bootstrap parameters as needed, using camel case.});
</script>
Luego, usa el operador await para llamar a importLibrary() desde una función async, como se muestra a continuación:
[[["Fácil de comprender","easyToUnderstand","thumb-up"],["Resolvió mi problema","solvedMyProblem","thumb-up"],["Otro","otherUp","thumb-up"]],[["Falta la información que necesito","missingTheInformationINeed","thumb-down"],["Muy complicado o demasiados pasos","tooComplicatedTooManySteps","thumb-down"],["Desactualizado","outOfDate","thumb-down"],["Problema de traducción","translationIssue","thumb-down"],["Problema con las muestras o los códigos","samplesCodeIssue","thumb-down"],["Otro","otherDown","thumb-down"]],["Última actualización: 2024-12-22 (UTC)"],[[["This guide explains how to prepare your application to work with the Google Maps Places API's Place class."],["You'll need to set up a Cloud project, obtain an API key, and enable necessary APIs including Maps JavaScript API, Places API, and Places API (New)."],["The Places Library is loaded by including the Maps JavaScript API bootstrap loader and then calling `importLibrary(\"places\")`."],["Once set up, you can utilize the Place class for searching places, retrieving details, and using Place Autocomplete."]]],[]]