Organiza tus páginas con colecciones
Guarda y categoriza el contenido según tus preferencias.
Errores de la clave de API y la facturación
En determinadas circunstancias, es posible que se muestre un mapa oscuro, o una imagen "negativa" de Street View, que incluya una marca de agua con el texto "solo para fines de desarrollo".
Este comportamiento generalmente indica que hay problemas con una clave de API o la facturación.
Para usar los productos de Google Maps Platform, debes tener la facturación habilitada en tu cuenta y todas las solicitudes deben incluir una clave de API válida. El siguiente flujo de preguntas y respuestas te ayudará a solucionar el problema:
¿Estás usando una clave de API?
No lo sé. ¿Cómo puedo comprobar si estoy usando una clave de API?
Una clave de API se pasa como el parámetro key en la URL que se utiliza para cargar la API de Maps JavaScript. A continuación, se muestran algunas opciones que puedes usar para verificar si estás usando una clave de API:
Usa la extensión de Chrome Google Maps Platform API Checker. Esto te permite determinar si tu sitio web implementa adecuadamente las APIs de Google Maps con licencia ofrecidas por Google.
Si usas una biblioteca o un complemento para cargar la API de Maps JavaScript, comprueba la configuración de esa biblioteca y busca una opción de clave de API.
Revisa los errores en el navegador.
Si ves los siguientes mensajes, significa que no estás usando tu clave de API correctamente:
Advertencia de la API de Maps JavaScript de Google: NoApiKeys
Si tienes acceso al código fuente de tu aplicación, busca la etiqueta <script> que se usa para cargar la API de Maps JavaScript.
Cuando cargues esta API, en el código que se muestra a continuación, reemplaza YOUR_API_KEY con tu clave de API.
Verifica el tráfico de red que genera tu sitio web en el navegador.
En Chrome, puedes ver esta información en la pestaña Network de las Herramientas para desarrolladores.
Aquí podrás ver las solicitudes de red que realizó tu sitio web. Las solicitudes realizadas con la API de Maps JavaScript se encontrarán en la ruta de acceso maps/api/js.
Aquí puedes confirmar si las solicitudes usan el parámetro key.
Puede resultarte útil filtrar el tráfico de red por maps/api/js cuando visualizas la pestaña Network.
¡Perfecto! Ahora, veamos si hay una cuenta de facturación vinculada a tu proyecto.
¿Hay una cuenta de facturación vinculada a tu proyecto?
No lo sé. ¿Cómo puedo comprobar si hay una cuenta de facturación vinculada a mi proyecto?
Ve a la
página Facturación en la consola de Google Cloud y selecciona el proyecto en el que se creó tu clave de API.
Para confirmar que la clave está asociada al proyecto, haz lo siguiente:
Ve a la sección Credenciales, accesible desde la barra lateral izquierda en Google Maps Platform > Credenciales.
Comprueba que aparezca la clave de API que actualmente usas en tu sitio web.
Si no figura, cambia a otro proyecto y verifica las credenciales allí.
Si no encuentras el proyecto que corresponde a tu clave de API, es posible que hayas perdido el acceso a ese proyecto.
Pídeles ayuda a otros miembros de tu organización. Si no se puede encontrar el proyecto original, haz lo siguiente:
Crea un nuevo proyecto. Para ello, selecciona Proyecto nuevo en la lista de proyectos o Crear proyecto en la página Administrador de recursos.
Crea una nueva clave de API. Puedes hacerlo en la página Credenciales.
Una vez ahí, haz clic en Crear credenciales y selecciona Clave de API.
Cuando hayas localizado tu proyecto en la consola de Cloud, comprueba si tiene vinculada una cuenta de facturación. Para ello, navega hasta la sección Facturación en el menú lateral izquierdo.
No, no hay ninguna cuenta de facturación vinculada a mi proyecto.
¿Existe un límite diario autoimpuesto para la API?
Si estableciste un límite diario en alguna de las API, lo cual es común para evitar aumentos inesperados, puedes aumentar el límite diario para solucionar este problema.
Si deseas verificar tus límites diarios, ve al panel de APIs y servicios en la consola de Cloud. Una vez allí, haz lo siguiente:
Si se te solicita, selecciona un proyecto.
Selecciona una API de la lista y, luego, haz clic en la pestaña Cuotas.
¿Tu clave de API tiene una restricción de direcciones IP?
Las claves de API con una restricción de direcciones IP solo se pueden utilizar con los servicios web diseñados para usarse desde el servidor (como la API de Geocoding y otras APIs de servicios web).
La mayoría de estos servicios web tienen servicios equivalentes dentro de la API de Maps JavaScript (por ejemplo, consulta el Servicio de geocodificación).
Para usar los servicios del cliente de la API de Maps JavaScript, deberás crear una clave de API separada que pueda protegerse con una restricción de URLs de referencia de HTTP (consulta Cómo obtener, agregar y restringir una clave de API).
Si tu código no funciona:
Para ayudarte a lograr que tus códigos de mapas funcionen, Brendan Kenny y Mano Marks señalan algunos errores comunes y cómo corregirlos en este video.
Busca errores de ortografía. Recuerda que JavaScript es un lenguaje que distingue mayúsculas de minúsculas.
Verifica los puntos básicos. Algunos de los problemas más comunes se producen en el momento inicial de la creación de mapas. Por ejemplo:
Confirma si especificaste las propiedades zoom y center en las opciones del mapa.
Asegúrate de haber declarado un elemento div según el cual el mapa aparecerá en la pantalla.
Asegúrate de que se haya especificado una altura para el elemento div del mapa. De manera predeterminada, los elementos div se crean con una altura de 0, por lo que son invisibles.
Usa un depurador de JavaScript para identificar problemas, como el que está disponible en las herramientas para desarrolladores de Chrome. Primero busca errores en la Consola de JavaScript.
Publica tus preguntas en Stack Overflow. Los lineamientos para publicar preguntas de calidad están disponibles en la página de asistencia.
[null,null,["Última actualización: 2025-08-31 (UTC)"],[[["\u003cp\u003eTo use the Google Maps JavaScript API, you must include an API key and enable billing for your project.\u003c/p\u003e\n"],["\u003cp\u003eIf you see a darkened map or a negative Street View image watermarked with "for development purposes only", you might have an issue with your API key or billing.\u003c/p\u003e\n"],["\u003cp\u003eTroubleshooting steps involve verifying your API key implementation, checking billing account attachment, ensuring billing method validity, and reviewing daily usage limits and IP restrictions.\u003c/p\u003e\n"],["\u003cp\u003eThis page offers solutions to common billing and API errors, and links to resources for further assistance.\u003c/p\u003e\n"]]],["Using the Maps JavaScript API requires a valid API key and enabled billing. Issues like a darkened map typically stem from these. Verify API key usage via browser checks, source code, or network traffic. Ensure the project linked to your API key has an active billing account. Check for invalid payment methods or exceeded API daily limits. If restricted by IP address, create a key with HTTP referrers. Troubleshoot by checking for typos, verifying map element properties, or using a JavaScript debugger.\n"],null,["# Troubleshooting\n\n| **Reminder:** To use the Maps JavaScript API:\n|\n| - All Maps JavaScript API requests must include an API key; we no longer support keyless access.\n| - You must [enable billing](https://console.cloud.google.com/project/_/billing/enable?utm_source=Docs_BillingNudge) on each of your projects.\n\n### API Key and Billing Errors\n\n\nUnder certain circumstances, a darkened map, or 'negative' Street View image,\nwatermarked with the text \"for development purposes only\", may be displayed.\nThis behavior typically indicates issues with either an API key or billing.\nIn order to use Google Maps Platform products, billing must be enabled on your account,\nand all requests must include a valid API key. The following flow will help troubleshoot this:\n\n#### Are you using an API key?\n\n#### I'm not sure. How can I check if I am using an API key?\n\nAn API key is passed as the `key` parameter in the URL that is used to load the\nMaps JavaScript API. Here are a few options to check if you are using an API key:\n\n- Use the [Google Maps Platform API Checker](https://chrome.google.com/webstore/detail/google-maps-platform-api/mlikepnkghhlnkgeejmlkfeheihlehne) Chrome extension. This allows you to determine if your website is properly implementing Google's licensed Maps APIs.\n- If you are using a library or plugin to load the Maps JavaScript API, check the settings for that library and look for an API key option.\n- Check [errors in your browser](/maps/documentation/javascript/error-messages#checking-errors). If you see the following messages, you are not using your API key correctly:\n - Google Maps JavaScript API warning: [NoApiKeys](/maps/documentation/javascript/error-messages#no-api-keys)\n - Google Maps JavaScript API error: [MissingKeyMapError](/maps/documentation/javascript/error-messages#missing-key-map-error)\n\n#### For web developers:\n\n- If you have access to the source code of your application, look for the `\u003cscript\u003e` tag which is used to load the Maps JavaScript API. When loading the Maps JavaScript API, substitute `YOUR_API_KEY` in the code below with your API key. \n\n ```html\n \u003cscript async defer\n src=\"https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap\"\u003e\n \u003c/script\u003e\n ```\n- Check the network traffic generated by your website in the browser. In Chrome, this can be viewed using the [DevTools](/web/tools/chrome-devtools) **Network** tab. Here you will see the network requests made by your website. Requests made using the Maps JavaScript API will be under the path `maps/api/js`. Here you can confirm if the requests are using the `key` parameter. It may be helpful to [filter your network traffic](/web/tools/chrome-devtools/console#filtering_the_console_output) by `maps/api/js` when viewing the **Network** tab.\n\n#### No, I am not using an API key.\n\nTo get an API key, click the button below. If you do not see a guided setup, follow the\nfull instructions at [Get Started with Google Maps\nPlatform](/maps/get-started#procedures).\n\n\n[Get Started](/maps/get-started)\n\n#### Yes, I am using an API key.\n\nGreat! Let's move on and check if a billing account is attached to your project.\n\n#### Is a billing account attached to your project?\n\n#### I'm not sure. How can I check if billing account is attached to my project?\n\nGo to the [Billing page](https://console.cloud.google.com/project/_/billing/enable?utm_source=Docs_BillingNudge) in the Google Cloud console and select the project under which your API key was created.\nTo confirm the key is associated with the project:\n\n1. Go to the **Credentials** section, which can be accessed from the left side bar under **Google Maps Platform \\\u003e Credentials**.\n2. Check that the API key you currently use on your website is listed. If that's not the case, switch to a different project, and check the credentials there.\n3. If you cannot locate the project for your API key, you may have lost access to this project. Ask others in your organization for help. If the original project cannot be located, you should:\n 1. Create a new project. This can be done by selecting **New Project** from the projects list, or by selecting **Create Project** via the [Resource Manager page](https://console.cloud.google.com/cloud-resource-manager).\n 2. Create a new API key. This can be done on the **Credentials** page. Once there click **Create credentials** and then select **API key**.\n\n\nOnce you have located your project in the Cloud console,\ncheck if a billing account is attached by navigating to the [Billing](https://console.cloud.google.com/project/_/billing) section in the left side menu.\n\n#### No, a billing account is not attached to my project.\n\nGo to the [Enable Billing](https://console.cloud.google.com/project/_/billing/enable?utm_source=Docs_BillingNudge) page in the Cloud console\nand add a billing account to your project. For additional information, see\n[Get Started with Google Maps Platform](/maps/get-started).\n\n#### Yes, a billing account is attached to my project.\n\nGreat! Let's make sure the provided billing method is valid.\n\n#### Is the provided billing method no longer valid (for example an expired credit card)?\n\nYou [can add, remove, or update a payment method](https://cloud.google.com/billing/docs/how-to/payment-methods) in the Cloud console.\n\n#### Is there an exceeded self-imposed daily limit on the API?\n\nIf you have set a daily limit on any of your APIs, which is common to prevent unexpected increases,\nyou can resolve this by [increasing your daily limit](/maps/faq#usage_cap).\n\nYou can check your daily limits by going to the\n[APIs \\& Services Dashboard](https://console.cloud.google.com/project/_/apiui/apis/enabled?utm_source=Docs_EnabledAPIsView) in the\nCloud console. Once there:\n\n1. Select a project if prompted.\n2. Select an API from the list, then click the **Quotas** tab.\n\n#### Does your API key have an IP addresses restriction?\n\nAPI keys with an **IP addresses** restriction can only be used with web services that are\nintended for use from the server side (such as the\n[Geocoding API](/maps/documentation/geocoding/start)\nand other [Web Service APIs](/maps/apis-by-platform)).\nMost of these web services have equivalent services within the Maps JavaScript API (for example, see the\n[Geocoding Service](/maps/documentation/javascript/geocoding)).\nTo use the Maps JavaScript API client side services, you will need to create a separate API key which\ncan be secured with an **HTTP referrers** restriction (see\n[Get, add, and restrict an API key](/maps/get-started#api-key)).\n\n### If your code isn't working:\n\nTo help you get your maps code up and running, Brendan Kenny and Mano Marks point out\nsome common mistakes and how to fix them in this video. \n\n- Look for typos. Remember that JavaScript is a case-sensitive language.\n- Check the basics - some of the most common problems occur with the initial map creation. Such as:\n - Confirm that you've specified the `zoom` and `center` properties in your map options.\n - Ensure that you have declared a div element in which the map will appear on the screen.\n - Ensure that the div element for the map has a height. By default, div elements are created with a height of 0, and are therefore invisible.\n\n Refer to our examples for a [reference\n implementation](/maps/documentation/javascript/examples/map-simple).\n- Use a JavaScript debugger to help identify problems, like the one available in the [Chrome\n Developer Tools](/chrome-developer-tools/docs/javascript-debugging). Start by looking in the JavaScript console for errors.\n- Post questions to [Stack\n Overflow](https://stackoverflow.com/questions/ask?tags=google-maps-api-3,google-maps). Guidelines on how to post great questions are available on the [Support](/maps/support) page."]]
