Kit de IU de Places
Organiza tus páginas con colecciones
Guarda y categoriza el contenido según tus preferencias.
Selecciona la plataforma:
Android
iOS
JavaScript
La biblioteca de componentes del kit de IU de Places te permite llevar la experiencia de usuario de Google Maps con Places que todos conocen a tus apps y páginas web, con los mismos datos que potencian la API de Places. Incluye un conjunto de componentes de IU individuales que se pueden usar de forma independiente, en conjunto y en combinación con otras APIs de Google Maps Platform para ofrecer una experiencia enriquecida de Places con un costo y una cantidad de código mínimos.
El kit de IU de Places incluye los siguientes elementos HTML para renderizar datos de Places:
Elementos de Place Details
(Place Details y Place Details Compact) renderizan detalles como el horario de atención, el sitio web y las opiniones de un lugar seleccionado.
Los elementos de Place Search (Place Nearby Search y Place Text Search) renderizan una lista de lugares en respuesta a una búsqueda cercana o una búsqueda de texto.
Elemento básico de Place Autocomplete
renderiza un campo de entrada de texto, proporciona predicciones de lugares en una lista de selección de IU y devuelve un ID de lugar
para el lugar seleccionado.
Elevación (experimental):
Renderiza los datos de elevación como un valor numérico para un solo punto o como un gráfico visual para una
ruta.
Funciones y beneficios principales
- Incorpora la experiencia de confianza de Google con un mínimo de código.
- Incorpora la IU de Google Maps para Places a tus apps a un costo más bajo que el de la API de Places.
- Elige los datos y las opciones de visualización que mejor se adapten a tus necesidades.
Facturación
Las solicitudes del kit de IU de Places siempre se facturan según la
tarifa de la API del kit de IU de Places, independientemente del método de búsqueda que utilicen o de los tipos de datos que devuelvan. Por ejemplo, una búsqueda cercana del kit de IU de Places no generará cargos adicionales para la búsqueda cercana de Places API Pro. Del mismo modo, una solicitud de Place Details del kit de IU de Places puede devolver fotos, precios y calificaciones de un lugar seleccionado, pero solo se te facturará la solicitud de Place Details del kit de IU de Places.
Salvo que se indique lo contrario, el contenido de esta página está sujeto a la licencia Atribución 4.0 de Creative Commons, y los ejemplos de código están sujetos a la licencia Apache 2.0. Para obtener más información, consulta las políticas del sitio de Google Developers. Java es una marca registrada de Oracle o sus afiliados.
Última actualización: 2025-08-29 (UTC)
[null,null,["Última actualización: 2025-08-29 (UTC)"],[[["\u003cp\u003eThe Places UI Kit offers pre-built UI components for integrating Google Maps Places functionality into your apps and web pages.\u003c/p\u003e\n"],["\u003cp\u003eIt includes components like Place Details, Place List, and Elevation for displaying place information and elevation data.\u003c/p\u003e\n"],["\u003cp\u003eThis kit is cost-effective compared to the Places API and allows customization of data and display options.\u003c/p\u003e\n"],["\u003cp\u003eThis product or feature is currently in the Experimental (pre-GA) phase, which means it has limited support and potential for incompatibility.\u003c/p\u003e\n"]]],[],null,["Select platform: [Android](/maps/documentation/places/android-sdk/places-ui-kit-overview \"View this page for the Android platform docs.\") [iOS](/maps/documentation/places/ios-sdk/places-ui-kit-overview \"View this page for the iOS platform docs.\") [JavaScript](/maps/documentation/javascript/places-ui-kit/overview \"View this page for the JavaScript platform docs.\")\n\n\nThe Places UI Kit component library lets you bring the familiar Google Maps user experience for\nPlaces to your apps and web pages, using the same data that powers the Places API. It includes a\nset of individual UI components that can be used independently, together, and in conjunction with\nother Google Maps Platform APIs to deliver a Places-rich experience with minimal cost and code.\n\n\nThe Places UI Kit includes the following HTML elements for rendering Places data:\n- [Place Details Elements](/maps/documentation/javascript/places-ui-kit/place-details) (Place Details and Place Details Compact) render details such as opening hours, website, and reviews for a selected place.\n- [Place Search Elements](/maps/documentation/javascript/places-ui-kit/place-list) (Place Nearby Search and Place Text Search) render a list of places in response to either a nearby search or text search query.\n- [Basic Place Autocomplete Element](/maps/documentation/javascript/places-ui-kit/basic-autocomplete) renders a text input field, supplies place predictions in a UI pick list, and returns a place ID for the selected place.\n- [Elevation](/maps/documentation/javascript/places-ui-kit/elevation) (experimental) renders elevation data as a numerical value for a single point, or as a visual plot for a path.\n| **Tip:** The Places UI Kit offers extensive visual customization options at no extra charge. See [Places UI Kit Custom Styling](/maps/documentation/javascript/places-ui-kit/custom-styling) for more information.\n\nKey features and capabilities\n - Incorporate Google's trusted experience starting with minimal code.\n - Bring Google Maps UI for Places to your apps at a lower cost than the Places API.\n - Choose the data and display options that best suit your needs.\n\nBilling\n- Places UI Kit requests are always billed at the [Places UI Kit API rate](/maps/billing-and-pricing/sku-details#places_ui-kit-request-ess-sku), regardless of which search method they use or what data types they return. For example, a Places UI Kit Nearby Search won't incur any additional charges for Places API Nearby Search Pro. Similarly, a Places UI Kit Place Details request may return photos, price, and rating for a selected place, but you will only be billed for the Places UI Kit Place Details request.\n\nNext step:\n[Get started with the Places UI Kit](/maps/documentation/javascript/places-ui-kit/get-started)"]]
