Get Started | Maps Static API | Google for Developers

<!doctype html> <html lang="en" dir="ltr"> <head> <meta name="google-signin-client-id" content="721724668570-nbkv1cfusk7kk4eni4pjvepaus73b13t.apps.googleusercontent.com"> <meta name="google-signin-scope" content="profile email https://www.googleapis.com/auth/developerprofiles https://www.googleapis.com/auth/developerprofiles.award"> <meta property="og:site_name" content="Google for Developers"> <meta property="og:type" content="website"><meta name="theme-color" content="#fff"><meta charset="utf-8"> <meta content="IE=Edge" http-equiv="X-UA-Compatible"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="manifest" href="/_pwa/developers/manifest.json" crossorigin="use-credentials"> <link rel="preconnect" href="//www.gstatic.com" crossorigin> <link rel="preconnect" href="//fonts.gstatic.com" crossorigin> <link rel="preconnect" href="//fonts.googleapis.com" crossorigin> <link rel="preconnect" href="//apis.google.com" crossorigin> <link rel="preconnect" href="//www.google-analytics.com" crossorigin><link rel="stylesheet" href="//fonts.googleapis.com/css?family=Google+Sans:400,500|Roboto:400,400italic,500,500italic,700,700italic|Roboto+Mono:400,500,700&display=swap"> <link rel="stylesheet" href="//fonts.googleapis.com/css2?family=Material+Icons&family=Material+Symbols+Outlined&display=block"><link rel="stylesheet" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers/css/app.css"> <link rel="shortcut icon" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers/images/favicon-new.png"> <link rel="apple-touch-icon" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers/images/touchicon-180-new.png"><link rel="canonical" href="https://developers.google.com/maps/documentation/maps-static/start"><link rel="search" type="application/opensearchdescription+xml" title="Google for Developers" href="https://developers.google.com/s/opensearch.xml"> <link rel="alternate" hreflang="en" href="https://developers.google.com/maps/documentation/maps-static/start" /><link rel="alternate" hreflang="x-default" href="https://developers.google.com/maps/documentation/maps-static/start" /><link rel="alternate" hreflang="ar" href="https://developers.google.com/maps/documentation/maps-static/start?hl=ar" /><link rel="alternate" hreflang="bn" href="https://developers.google.com/maps/documentation/maps-static/start?hl=bn" /><link rel="alternate" hreflang="zh-Hans" href="https://developers.google.com/maps/documentation/maps-static/start?hl=zh-cn" /><link rel="alternate" hreflang="zh-Hant" href="https://developers.google.com/maps/documentation/maps-static/start?hl=zh-tw" /><link rel="alternate" hreflang="fa" href="https://developers.google.com/maps/documentation/maps-static/start?hl=fa" /><link rel="alternate" hreflang="fr" href="https://developers.google.com/maps/documentation/maps-static/start?hl=fr" /><link rel="alternate" hreflang="de" href="https://developers.google.com/maps/documentation/maps-static/start?hl=de" /><link rel="alternate" hreflang="he" href="https://developers.google.com/maps/documentation/maps-static/start?hl=he" /><link rel="alternate" hreflang="hi" href="https://developers.google.com/maps/documentation/maps-static/start?hl=hi" /><link rel="alternate" hreflang="id" href="https://developers.google.com/maps/documentation/maps-static/start?hl=id" /><link rel="alternate" hreflang="it" href="https://developers.google.com/maps/documentation/maps-static/start?hl=it" /><link rel="alternate" hreflang="ja" href="https://developers.google.com/maps/documentation/maps-static/start?hl=ja" /><link rel="alternate" hreflang="ko" href="https://developers.google.com/maps/documentation/maps-static/start?hl=ko" /><link rel="alternate" hreflang="pl" href="https://developers.google.com/maps/documentation/maps-static/start?hl=pl" /><link rel="alternate" hreflang="pt-BR" href="https://developers.google.com/maps/documentation/maps-static/start?hl=pt-br" /><link rel="alternate" hreflang="ru" href="https://developers.google.com/maps/documentation/maps-static/start?hl=ru" /><link rel="alternate" hreflang="es-419" href="https://developers.google.com/maps/documentation/maps-static/start?hl=es-419" /><link rel="alternate" hreflang="th" href="https://developers.google.com/maps/documentation/maps-static/start?hl=th" /><link rel="alternate" hreflang="tr" href="https://developers.google.com/maps/documentation/maps-static/start?hl=tr" /><link rel="alternate" hreflang="vi" href="https://developers.google.com/maps/documentation/maps-static/start?hl=vi" /><title>Get Started  |  Maps Static API  |  Google for Developers</title> <meta property="og:title" content="Get Started  |  Maps Static API  |  Google for Developers"><meta property="og:url" content="https://developers.google.com/maps/documentation/maps-static/start"><meta property="og:image" content="https://developers.google.com/static/maps/images/google-maps-platform-1200x675.png"> <meta property="og:image:width" content="1200"> <meta property="og:image:height" content="675"><meta property="og:locale" content="en"><meta name="twitter:card" content="summary_large_image"><meta name="twitter:site" content="@GMapsPlatform"><script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Article", "headline": "Get Started" } </script><script type="application/ld+json"> { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [{ "@type": "ListItem", "position": 1, "name": "Google Maps Platform", "item": "https://developers.google.com/maps" },{ "@type": "ListItem", "position": 2, "name": "Web", "item": "https://developers.google.com/maps/web" },{ "@type": "ListItem", "position": 3, "name": "Maps Static API", "item": "https://developers.google.com/maps/documentation/maps-static" },{ "@type": "ListItem", "position": 4, "name": "Get Started", "item": "https://developers.google.com/maps/documentation/maps-static/start" }] } </script> <link rel="stylesheet" href="/extras.css"></head> <body class="" template="page" theme="white" type="article" layout="docs" concierge='closed' display-toc pending> <devsite-progress type="indeterminate" id="app-progress"></devsite-progress> <section class="devsite-wrapper"> <devsite-cookie-notification-bar></devsite-cookie-notification-bar><devsite-header role="banner"> <div class="devsite-header--inner nocontent"> <div class="devsite-top-logo-row-wrapper-wrapper"> <div class="devsite-top-logo-row-wrapper"> <div class="devsite-top-logo-row"> <button type="button" id="devsite-hamburger-menu" class="devsite-header-icon-button button-flat material-icons gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Navigation menu button" visually-hidden aria-label="Open menu"> </button> <div class="devsite-product-name-wrapper"> <a href="https://developers.google.com/maps"> <div class="devsite-product-logo-container" size="medium" > <picture> <img class="devsite-product-logo" alt="Google Maps Platform" src="https://developers.google.com/static/maps/images/maps-icon.svg" srcset=" /static/maps/images/maps-icon.svg" sizes="64px" loading="lazy" > </picture> </div> </a> <span class="devsite-product-name"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item devsite-has-google-wordmark"> <a href="https://developers.google.com/maps" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Upper Header" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="Google Maps Platform" > <svg class="devsite-google-wordmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 148 48"> <title>Google</title> <path class="devsite-google-wordmark-svg-path" d="M19.58,37.65c-9.87,0-18.17-8.04-18.17-17.91c0-9.87,8.3-17.91,18.17-17.91c5.46,0,9.35,2.14,12.27,4.94l-3.45,3.45c-2.1-1.97-4.93-3.49-8.82-3.49c-7.21,0-12.84,5.81-12.84,13.02c0,7.21,5.64,13.02,12.84,13.02c4.67,0,7.34-1.88,9.04-3.58c1.4-1.4,2.32-3.41,2.66-6.16H19.58v-4.89h16.47c0.18,0.87,0.26,1.92,0.26,3.06c0,3.67-1.01,8.21-4.24,11.44C28.93,35.9,24.91,37.65,19.58,37.65z M61.78,26.12c0,6.64-5.1,11.53-11.36,11.53s-11.36-4.89-11.36-11.53c0-6.68,5.1-11.53,11.36-11.53S61.78,19.43,61.78,26.12z M56.8,26.12c0-4.15-2.96-6.99-6.39-6.99c-3.43,0-6.39,2.84-6.39,6.99c0,4.11,2.96,6.99,6.39,6.99C53.84,33.11,56.8,30.22,56.8,26.12z M87.25,26.12c0,6.64-5.1,11.53-11.36,11.53c-6.26,0-11.36-4.89-11.36-11.53c0-6.68,5.1-11.53,11.36-11.53C82.15,14.59,87.25,19.43,87.25,26.12zM82.28,26.12c0-4.15-2.96-6.99-6.39-6.99c-3.43,0-6.39,2.84-6.39,6.99c0,4.11,2.96,6.99,6.39,6.99C79.32,33.11,82.28,30.22,82.28,26.12z M112.09,15.29v20.7c0,8.52-5.02,12.01-10.96,12.01c-5.59,0-8.95-3.76-10.22-6.81l4.41-1.83c0.79,1.88,2.71,4.1,5.81,4.1c3.8,0,6.16-2.36,6.16-6.77v-1.66h-0.18c-1.14,1.4-3.32,2.62-6.07,2.62c-5.76,0-11.05-5.02-11.05-11.49c0-6.51,5.28-11.57,11.05-11.57c2.75,0,4.93,1.22,6.07,2.58h0.18v-1.88H112.09z M107.64,26.16c0-4.06-2.71-7.03-6.16-7.03c-3.49,0-6.42,2.97-6.42,7.03c0,4.02,2.93,6.94,6.42,6.94C104.93,33.11,107.64,30.18,107.64,26.16z M120.97,3.06v33.89h-5.07V3.06H120.97z M140.89,29.92l3.93,2.62c-1.27,1.88-4.32,5.11-9.61,5.11c-6.55,0-11.28-5.07-11.28-11.53c0-6.86,4.77-11.53,10.71-11.53c5.98,0,8.91,4.76,9.87,7.34l0.52,1.31l-15.42,6.38c1.18,2.31,3.01,3.49,5.59,3.49C137.79,33.11,139.58,31.84,140.89,29.92zM128.79,25.77l10.31-4.28c-0.57-1.44-2.27-2.45-4.28-2.45C132.24,19.04,128.66,21.31,128.79,25.77z"/> </svg>Maps Platform </a> </li> </ul> </span> </div> <div class="devsite-top-logo-row-middle"> <div class="devsite-header-upper-tabs"> <devsite-tabs class="upper-tabs"> <nav class="devsite-tabs-wrapper" aria-label="Upper tabs"> <tab > <a href="https://mapsplatform.google.com/" track-metadata-eventdetail="https://mapsplatform.google.com/" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - overview" track-metadata-module="primary nav" data-category="home" data-label="navTopMenu" track-name="overview" data-action="tabClick" > Overview </a> </tab> <tab > <a href="https://mapsplatform.google.com/maps-products/" track-metadata-eventdetail="https://mapsplatform.google.com/maps-products/" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - products" track-metadata-module="primary nav" data-category="products" data-label="navTopMenu" track-name="products" data-action="tabClick" > Products </a> </tab> <tab > <a href="https://mapsplatform.google.com/pricing/" track-metadata-eventdetail="https://mapsplatform.google.com/pricing/" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - pricing" track-metadata-module="primary nav" data-category="pricing" data-label="navTopMenu" track-name="pricing" data-action="tabClick" > Pricing </a> </tab> <tab class="devsite-dropdown devsite-dropdown-full devsite-active "> <a href="https://developers.google.com/maps/documentation" track-metadata-eventdetail="https://developers.google.com/maps/documentation" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - documentation" track-metadata-module="primary nav" aria-label="Documentation, selected" data-category="documentation" data-label="navTopMenu" track-name="documentation" data-action="tabClick" > Documentation </a> <a href="#" role="button" aria-haspopup="true" aria-expanded="false" aria-label="Dropdown menu for Documentation" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation" track-metadata-position="nav - documentation" track-metadata-module="primary nav" data-category="documentation" data-label="navTopMenu" track-name="documentation" data-action="tabClick" class="devsite-tabs-dropdown-toggle devsite-icon devsite-icon-arrow-drop-down"></a> <div class="devsite-tabs-dropdown" aria-label="submenu" hidden> <div class="devsite-tabs-dropdown-content"> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section "> <li class="devsite-nav-title" role="heading" tooltip>Get Started</li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/get-started" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/get-started" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="get started" tooltip > <div class="devsite-nav-item-title"> Get Started with Google Maps Platform </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/api-picker" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/api-picker" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="get started" tooltip > <div class="devsite-nav-item-title"> API Picker </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/billing-and-pricing/overview" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/billing-and-pricing/overview" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="get started" tooltip > <div class="devsite-nav-item-title"> Billing & Pricing </div> </a> </li> <li class="devsite-nav-item"> <a href="https://mapsplatform.google.com/resources/trust-center" track-type="nav" track-metadata-eventdetail="https://mapsplatform.google.com/resources/trust-center" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="get started" tooltip > <div class="devsite-nav-item-title"> Security & Compliance </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/reporting-and-monitoring/overview" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/reporting-and-monitoring/overview" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="get started" tooltip > <div class="devsite-nav-item-title"> Reporting & Monitoring </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/faq" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/faq" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="get started" tooltip > <div class="devsite-nav-item-title"> FAQ </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/support" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/support" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="get started" tooltip > <div class="devsite-nav-item-title"> Support and Resources </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/support/care" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/support/care" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="get started" tooltip > <div class="devsite-nav-item-title"> Customer Care </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/incident-management" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/incident-management" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="get started" tooltip > <div class="devsite-nav-item-title"> Incident Management </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section "> <li class="devsite-nav-title" role="heading" tooltip>Maps</li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/javascript" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/javascript" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="maps" tooltip > <div class="devsite-nav-item-title"> Maps JavaScript API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/android-sdk" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/android-sdk" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="maps" tooltip > <div class="devsite-nav-item-title"> Maps SDK for Android </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/ios-sdk" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/ios-sdk" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="maps" tooltip > <div class="devsite-nav-item-title"> Maps SDK for iOS </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/flutter-package/overview" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/flutter-package/overview" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="maps" tooltip > <div class="devsite-nav-item-title"> Google Maps for Flutter </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/embed" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/embed" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="maps" tooltip > <div class="devsite-nav-item-title"> Maps Embed API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/maps-static" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/maps-static" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="maps" tooltip > <div class="devsite-nav-item-title"> Maps Static API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/streetview" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/streetview" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="maps" tooltip > <div class="devsite-nav-item-title"> Street View Static API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/urls" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/urls" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="maps" tooltip > <div class="devsite-nav-item-title"> Maps URLs </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/aerial-view" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/aerial-view" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="maps" tooltip > <div class="devsite-nav-item-title"> Aerial View API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/elevation" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/elevation" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="maps" tooltip > <div class="devsite-nav-item-title"> Elevation API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/tile" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/tile" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="maps" tooltip > <div class="devsite-nav-item-title"> Map Tiles API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/datasets" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/datasets" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="maps" tooltip > <div class="devsite-nav-item-title"> Maps Datasets API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/web-components" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/web-components" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="maps" tooltip > <div class="devsite-nav-item-title"> Web Components (Preview) </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section "> <li class="devsite-nav-title" role="heading" tooltip>Routes</li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/routes" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/routes" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="routes" tooltip > <div class="devsite-nav-item-title"> Routes API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/navigation/android-sdk" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/navigation/android-sdk" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="routes" tooltip > <div class="devsite-nav-item-title"> Navigation SDK for Android </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/navigation/ios-sdk" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/navigation/ios-sdk" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="routes" tooltip > <div class="devsite-nav-item-title"> Navigation SDK for iOS </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/cross-platform/navigation" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/cross-platform/navigation" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="routes" tooltip > <div class="devsite-nav-item-title"> Navigation for Flutter </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/cross-platform/navigation" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/cross-platform/navigation" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="routes" tooltip > <div class="devsite-nav-item-title"> Navigation for React Native </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/roads" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/roads" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="routes" tooltip > <div class="devsite-nav-item-title"> Roads API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/directions" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/directions" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="routes" tooltip > <div class="devsite-nav-item-title"> Directions API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/distance-matrix" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/distance-matrix" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="routes" tooltip > <div class="devsite-nav-item-title"> Distance Matrix API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/route-optimization" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/route-optimization" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="routes" tooltip > <div class="devsite-nav-item-title"> Route Optimization API </div> </a> </li> </ul> <ul class="devsite-tabs-dropdown-section "> <li class="devsite-nav-title" role="heading" tooltip>Solutions</li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/solutions" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/solutions" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="routes" tooltip > <div class="devsite-nav-item-title"> Industry solutions </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/mobility" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/mobility" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="routes" tooltip > <div class="devsite-nav-item-title"> Mobility services </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section "> <li class="devsite-nav-title" role="heading" tooltip>Places</li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/places/web-service" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/places/web-service" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="places" tooltip > <div class="devsite-nav-item-title"> Places API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/places/android-sdk" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/places/android-sdk" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="places" tooltip > <div class="devsite-nav-item-title"> Places SDK for Android </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/places/ios-sdk" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/places/ios-sdk" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="places" tooltip > <div class="devsite-nav-item-title"> Places SDK for iOS </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/javascript/places" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/javascript/places" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="places" tooltip > <div class="devsite-nav-item-title"> Places Library, Maps JavaScript API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/geocoding" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/geocoding" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="places" tooltip > <div class="devsite-nav-item-title"> Geocoding API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/geolocation" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/geolocation" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="places" tooltip > <div class="devsite-nav-item-title"> Geolocation API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/address-validation" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/address-validation" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="places" tooltip > <div class="devsite-nav-item-title"> Address Validation API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/timezone" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/timezone" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="places" tooltip > <div class="devsite-nav-item-title"> Time Zone API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/places-insights" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/places-insights" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="places" tooltip > <div class="devsite-nav-item-title"> Places Insights API (Preview) </div> </a> </li> </ul> <ul class="devsite-tabs-dropdown-section "> <li class="devsite-nav-title" role="heading" tooltip>Environment</li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/air-quality" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/air-quality" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="places" tooltip > <div class="devsite-nav-item-title"> Air Quality API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/pollen" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/pollen" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="places" tooltip > <div class="devsite-nav-item-title"> Pollen API </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/documentation/solar" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/documentation/solar" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="places" tooltip > <div class="devsite-nav-item-title"> Solar API </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section "> <li class="devsite-nav-title" role="heading" tooltip>Additional Resources</li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/api-security-best-practices" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/api-security-best-practices" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="additional resources" tooltip > <div class="devsite-nav-item-title"> API Security Best Practices </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/digital-signature" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/digital-signature" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="additional resources" tooltip > <div class="devsite-nav-item-title"> Digital Signature Guide </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/coverage" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/coverage" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="additional resources" tooltip > <div class="devsite-nav-item-title"> Map Coverage Details </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/optimization-guide" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/optimization-guide" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="additional resources" tooltip > <div class="devsite-nav-item-title"> Optimization Guide </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/software-support" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/software-support" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="additional resources" tooltip > <div class="devsite-nav-item-title"> Mobile OS and software support </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/launch-stages" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/launch-stages" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="additional resources" tooltip > <div class="devsite-nav-item-title"> Launch stages </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/deprecations" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/deprecations" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="additional resources" tooltip > <div class="devsite-nav-item-title"> Deprecations </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/asset-tracking-plan" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/asset-tracking-plan" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="additional resources" tooltip > <div class="devsite-nav-item-title"> Asset Tracking Plan </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/url-encoding" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/url-encoding" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="additional resources" tooltip > <div class="devsite-nav-item-title"> URL Encoding </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developers.google.com/maps/third-party-platforms/wordpress" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/third-party-platforms/wordpress" track-metadata-position="nav - documentation" track-metadata-module="tertiary nav" track-metadata-module_headline="additional resources" tooltip > <div class="devsite-nav-item-title"> WordPress Users </div> </a> </li> </ul> </div> </div> </div> </tab> <tab > <a href="https://mapsplatform.google.com/resources/blog" track-metadata-eventdetail="https://mapsplatform.google.com/resources/blog" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - blog" track-metadata-module="primary nav" data-category="blog" data-label="navTopMenu" track-name="blog" data-action="tabClick" > Blog </a> </tab> <tab class="devsite-dropdown "> <a href="https://developers.google.com/maps/developer-community" track-metadata-eventdetail="https://developers.google.com/maps/developer-community" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - community" track-metadata-module="primary nav" data-category="community" data-label="navTopMenu" track-name="community" data-action="tabClick" > Community </a> <a href="#" role="button" aria-haspopup="true" aria-expanded="false" aria-label="Dropdown menu for Community" track-type="nav" track-metadata-eventdetail="https://developers.google.com/maps/developer-community" track-metadata-position="nav - community" track-metadata-module="primary nav" data-category="community" data-label="navTopMenu" track-name="community" data-action="tabClick" class="devsite-tabs-dropdown-toggle devsite-icon devsite-icon-arrow-drop-down"></a> <div class="devsite-tabs-dropdown" aria-label="submenu" hidden> <div class="devsite-tabs-dropdown-content"> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section "> <li class="devsite-nav-item"> <a href="https://stackoverflow.com/questions/tagged/google-maps" track-type="nav" track-metadata-eventdetail="https://stackoverflow.com/questions/tagged/google-maps" track-metadata-position="nav - community" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> StackOverflow </div> </a> </li> <li class="devsite-nav-item"> <a href="https://github.com/googlemaps/" track-type="nav" track-metadata-eventdetail="https://github.com/googlemaps/" track-metadata-position="nav - community" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> GitHub </div> </a> </li> <li class="devsite-nav-item"> <a href="https://www.youtube.com/c/GoogleMapsPlatform" track-type="nav" track-metadata-eventdetail="https://www.youtube.com/c/GoogleMapsPlatform" track-metadata-position="nav - community" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> YouTube </div> </a> </li> <li class="devsite-nav-item"> <a href="https://discord.gg/f4hvx8Rp2q" track-type="nav" track-metadata-eventdetail="https://discord.gg/f4hvx8Rp2q" track-metadata-position="nav - community" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Discord </div> </a> </li> <li class="devsite-nav-item"> <a href="https://twitter.com/GMapsPlatform" track-type="nav" track-metadata-eventdetail="https://twitter.com/GMapsPlatform" track-metadata-position="nav - community" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> X (Twitter) </div> </a> </li> <li class="devsite-nav-item"> <a href="https://issuetracker.google.com/bookmark-groups/76561" track-type="nav" track-metadata-eventdetail="https://issuetracker.google.com/bookmark-groups/76561" track-metadata-position="nav - community" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Issue Tracker </div> </a> </li> <li class="devsite-nav-item"> <a href="https://devlibrary.withgoogle.com/products/maps" track-type="nav" track-metadata-eventdetail="https://devlibrary.withgoogle.com/products/maps" track-metadata-position="nav - community" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Google Dev Library </div> </a> </li> </ul> </div> </div> </div> </tab> </nav> </devsite-tabs> </div> <devsite-search enable-signin enable-search enable-suggestions enable-query-completion project-name="Maps Static API" tenant-name="Google for Developers" project-scope="/maps/documentation/maps-static" url-scoped="https://developers.google.com/s/results/maps/documentation/maps-static" > <form class="devsite-search-form" action="https://developers.google.com/s/results" method="GET"> <div class="devsite-search-container"> <button type="button" search-open class="devsite-search-button devsite-header-icon-button button-flat material-icons" aria-label="Open search"></button> <div class="devsite-searchbox"> <input aria-activedescendant="" aria-autocomplete="list" aria-label="Search" aria-expanded="false" aria-haspopup="listbox" autocomplete="off" class="devsite-search-field devsite-search-query" name="q" placeholder="Search" role="combobox" type="text" value="" > <div class="devsite-search-image material-icons" aria-hidden="true"> </div> <div class="devsite-search-shortcut-icon-container" aria-hidden="true"> <kbd class="devsite-search-shortcut-icon">/</kbd> </div> </div> </div> </form> <button type="button" search-close class="devsite-search-button devsite-header-icon-button button-flat material-icons" aria-label="Close search"></button> </devsite-search> </div> <devsite-language-selector> <ul role="presentation"> <li role="presentation"> <a role="menuitem" lang="en" >English</a> </li> <li role="presentation"> <a role="menuitem" lang="de" >Deutsch</a> </li> <li role="presentation"> <a role="menuitem" lang="es" >Español</a> </li> <li role="presentation"> <a role="menuitem" lang="es_419" >Español – América Latina</a> </li> <li role="presentation"> <a role="menuitem" lang="fr" >Français</a> </li> <li role="presentation"> <a role="menuitem" lang="id" >Indonesia</a> </li> <li role="presentation"> <a role="menuitem" lang="it" >Italiano</a> </li> <li role="presentation"> <a role="menuitem" lang="pl" >Polski</a> </li> <li role="presentation"> <a role="menuitem" lang="pt_br" >Português – Brasil</a> </li> <li role="presentation"> <a role="menuitem" lang="vi" >Tiếng Việt</a> </li> <li role="presentation"> <a role="menuitem" lang="tr" >Türkçe</a> </li> <li role="presentation"> <a role="menuitem" lang="ru" >Русский</a> </li> <li role="presentation"> <a role="menuitem" lang="he" >עברית</a> </li> <li role="presentation"> <a role="menuitem" lang="ar" >العربيّة</a> </li> <li role="presentation"> <a role="menuitem" lang="fa" >فارسی</a> </li> <li role="presentation"> <a role="menuitem" lang="hi" >हिंदी</a> </li> <li role="presentation"> <a role="menuitem" lang="bn" >বাংলা</a> </li> <li role="presentation"> <a role="menuitem" lang="th" >ภาษาไทย</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_cn" >中文 – 简体</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_tw" >中文 – 繁體</a> </li> <li role="presentation"> <a role="menuitem" lang="ja" >日本語</a> </li> <li role="presentation"> <a role="menuitem" lang="ko" >한국어</a> </li> </ul> </devsite-language-selector> <devsite-user enable-profiles fp-auth id="devsite-user"> <span class="button devsite-top-button" aria-hidden="true" visually-hidden>Sign in</span> </devsite-user> </div> </div> </div> <div class="devsite-collapsible-section "> <div class="devsite-header-background"> <div class="devsite-product-id-row" > <div class="devsite-product-description-row"> <ul class="devsite-breadcrumb-list" aria-label="Lower header breadcrumb"> <li class="devsite-breadcrumb-item "> <a href="https://developers.google.com/maps/web" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Lower Header" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="Google Maps APIs for Web" > Web </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developers.google.com/maps/documentation/maps-static" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Lower Header" data-value="2" track-type="globalNav" track-name="breadcrumb" track-metadata-position="2" track-metadata-eventdetail="Maps Static API" > Maps Static API </a> </li> </ul> </div> <div class="devsite-product-button-row"> <a href="https://console.cloud.google.com/google/maps-apis/start?utm_source=Docs_GS_Button&ref=https://developers.google.com/maps/&utm_content=Docs_static-maps-backend" class="button button-primary " data-label="nav" data-action="buttonClick" data-category="GMPgetStarted" >Get Started</a> <a href="https://cloud.google.com/contact-maps" class="button " >Contact sales</a> </div> </div> <div class="devsite-doc-set-nav-row"> <devsite-tabs class="lower-tabs"> <nav class="devsite-tabs-wrapper" aria-label="Lower tabs"> <tab class="devsite-active"> <a href="https://developers.google.com/maps/documentation/maps-static" track-metadata-eventdetail="https://developers.google.com/maps/documentation/maps-static" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - guides" track-metadata-module="primary nav" aria-label="Guides, selected" data-category="Site-Wide Custom Events" data-label="Tab: Guides" track-name="guides" > Guides </a> </tab> <tab > <a href="https://developers.google.com/maps/documentation/maps-static/support" track-metadata-eventdetail="https://developers.google.com/maps/documentation/maps-static/support" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - support" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Support" track-name="support" > Support </a> </tab> </nav> </devsite-tabs> </div> </div> </div> </div> </devsite-header> <devsite-book-nav scrollbars > <div class="devsite-book-nav-filter" > <span class="filter-list-icon material-icons" aria-hidden="true"></span> <input type="text" placeholder="Filter" aria-label="Type to filter" role="searchbox"> <span class="filter-clear-button hidden" data-title="Clear filter" aria-label="Clear filter" role="button" tabindex="0"></span> </div> <nav class="devsite-book-nav devsite-nav nocontent" aria-label="Side menu"> <div class="devsite-mobile-header"> <button type="button" id="devsite-close-nav" class="devsite-header-icon-button button-flat material-icons gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Close navigation" aria-label="Close navigation"> </button> <div class="devsite-product-name-wrapper"> <a href="https://developers.google.com/maps"> <div class="devsite-product-logo-container" size="medium" > <picture> <img class="devsite-product-logo" alt="Google Maps Platform" src="https://developers.google.com/static/maps/images/maps-icon.svg" srcset=" /static/maps/images/maps-icon.svg" sizes="64px" loading="lazy" > </picture> </div> </a> <span class="devsite-product-name"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item devsite-has-google-wordmark"> <a href="https://developers.google.com/maps" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Upper Header" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="Google Maps Platform" > <svg class="devsite-google-wordmark" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 148 48"> <title>Google</title> <path class="devsite-google-wordmark-svg-path" d="M19.58,37.65c-9.87,0-18.17-8.04-18.17-17.91c0-9.87,8.3-17.91,18.17-17.91c5.46,0,9.35,2.14,12.27,4.94l-3.45,3.45c-2.1-1.97-4.93-3.49-8.82-3.49c-7.21,0-12.84,5.81-12.84,13.02c0,7.21,5.64,13.02,12.84,13.02c4.67,0,7.34-1.88,9.04-3.58c1.4-1.4,2.32-3.41,2.66-6.16H19.58v-4.89h16.47c0.18,0.87,0.26,1.92,0.26,3.06c0,3.67-1.01,8.21-4.24,11.44C28.93,35.9,24.91,37.65,19.58,37.65z M61.78,26.12c0,6.64-5.1,11.53-11.36,11.53s-11.36-4.89-11.36-11.53c0-6.68,5.1-11.53,11.36-11.53S61.78,19.43,61.78,26.12z M56.8,26.12c0-4.15-2.96-6.99-6.39-6.99c-3.43,0-6.39,2.84-6.39,6.99c0,4.11,2.96,6.99,6.39,6.99C53.84,33.11,56.8,30.22,56.8,26.12z M87.25,26.12c0,6.64-5.1,11.53-11.36,11.53c-6.26,0-11.36-4.89-11.36-11.53c0-6.68,5.1-11.53,11.36-11.53C82.15,14.59,87.25,19.43,87.25,26.12zM82.28,26.12c0-4.15-2.96-6.99-6.39-6.99c-3.43,0-6.39,2.84-6.39,6.99c0,4.11,2.96,6.99,6.39,6.99C79.32,33.11,82.28,30.22,82.28,26.12z M112.09,15.29v20.7c0,8.52-5.02,12.01-10.96,12.01c-5.59,0-8.95-3.76-10.22-6.81l4.41-1.83c0.79,1.88,2.71,4.1,5.81,4.1c3.8,0,6.16-2.36,6.16-6.77v-1.66h-0.18c-1.14,1.4-3.32,2.62-6.07,2.62c-5.76,0-11.05-5.02-11.05-11.49c0-6.51,5.28-11.57,11.05-11.57c2.75,0,4.93,1.22,6.07,2.58h0.18v-1.88H112.09z M107.64,26.16c0-4.06-2.71-7.03-6.16-7.03c-3.49,0-6.42,2.97-6.42,7.03c0,4.02,2.93,6.94,6.42,6.94C104.93,33.11,107.64,30.18,107.64,26.16z M120.97,3.06v33.89h-5.07V3.06H120.97z M140.89,29.92l3.93,2.62c-1.27,1.88-4.32,5.11-9.61,5.11c-6.55,0-11.28-5.07-11.28-11.53c0-6.86,4.77-11.53,10.71-11.53c5.98,0,8.91,4.76,9.87,7.34l0.52,1.31l-15.42,6.38c1.18,2.31,3.01,3.49,5.59,3.49C137.79,33.11,139.58,31.84,140.89,29.92zM128.79,25.77l10.31-4.28c-0.57-1.44-2.27-2.45-4.28-2.45C132.24,19.04,128.66,21.31,128.79,25.77z"/> </svg>Maps Platform </a> </li> </ul> </span> </div> </div> <div class="devsite-book-nav-wrapper"> <div class="devsite-mobile-nav-top"> <ul class="devsite-nav-list"> <li class="devsite-nav-item"> <a href="https://mapsplatform.google.com/" class="devsite-nav-title gc-analytics-event " data-category="home" data-label="navTopMenu" track-name="overview" data-action="tabClick" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Overview" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Overview </span> </a> </li> <li class="devsite-nav-item"> <a href="https://mapsplatform.google.com/maps-products/" class="devsite-nav-title gc-analytics-event " data-category="products" data-label="navTopMenu" track-name="products" data-action="tabClick" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Products" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Products </span> </a> </li> <li class="devsite-nav-item"> <a href="https://mapsplatform.google.com/pricing/" class="devsite-nav-title gc-analytics-event " data-category="pricing" data-label="navTopMenu" track-name="pricing" data-action="tabClick" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Pricing" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Pricing </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation" class="devsite-nav-title gc-analytics-event devsite-nav-active" data-category="documentation" data-label="navTopMenu" track-name="documentation" data-action="tabClick" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Documentation" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Documentation </span> </a> <ul class="devsite-nav-responsive-tabs devsite-nav-has-menu "> <li class="devsite-nav-item"> <span class="devsite-nav-title" tooltip data-category="documentation" data-label="navTopMenu" track-name="documentation" data-action="tabClick" > <span class="devsite-nav-text" tooltip menu="Documentation"> More </span> <span class="devsite-nav-icon material-icons" data-icon="forward" menu="Documentation"> </span> </span> </li> </ul> <ul class="devsite-nav-responsive-tabs"> <li class="devsite-nav-item"> <a href="/maps/documentation/maps-static" class="devsite-nav-title gc-analytics-event devsite-nav-has-children devsite-nav-active" data-category="Site-Wide Custom Events" data-label="Tab: Guides" track-name="guides" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Guides" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip menu="_book"> Guides </span> <span class="devsite-nav-icon material-icons" data-icon="forward" menu="_book"> </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/maps-static/support" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Support" track-name="support" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Support" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Support </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> </ul> </li> <li class="devsite-nav-item"> <a href="https://mapsplatform.google.com/resources/blog" class="devsite-nav-title gc-analytics-event " data-category="blog" data-label="navTopMenu" track-name="blog" data-action="tabClick" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Blog" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Blog </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/developer-community" class="devsite-nav-title gc-analytics-event " data-category="community" data-label="navTopMenu" track-name="community" data-action="tabClick" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Community" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Community </span> </a> <ul class="devsite-nav-responsive-tabs devsite-nav-has-menu "> <li class="devsite-nav-item"> <span class="devsite-nav-title" tooltip data-category="community" data-label="navTopMenu" track-name="community" data-action="tabClick" > <span class="devsite-nav-text" tooltip menu="Community"> More </span> <span class="devsite-nav-icon material-icons" data-icon="forward" menu="Community"> </span> </span> </li> </ul> </li> </ul> </div> <div class="devsite-mobile-nav-bottom"> <ul class="devsite-nav-list" menu="_book"> <li class="devsite-nav-item"><a href="/maps/documentation/maps-static" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static" ><span class="devsite-nav-text" tooltip>Maps Static API</span></a></li> <li class="devsite-nav-item"><a href="/maps/documentation/maps-static/overview" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/overview" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/overview" ><span class="devsite-nav-text" tooltip>Overview</span></a></li> <li class="devsite-nav-item"><a href="/maps/documentation/maps-static/start" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/start" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/start" ><span class="devsite-nav-text" tooltip>Get Started</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Setup</span> </div></li> <li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-setup" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-setup" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-setup" ><span class="devsite-nav-text" tooltip>Set up your Google Cloud project</span></a></li> <li class="devsite-nav-item"><a href="/maps/documentation/maps-static/get-api-key" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/get-api-key" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/get-api-key" ><span class="devsite-nav-text" tooltip>Use API Keys</span></a></li> <li class="devsite-nav-item"><a href="/maps/documentation/maps-static/digital-signature" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/digital-signature" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/digital-signature" ><span class="devsite-nav-text" tooltip>Use a Digital Signature</span></a></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Customize with cloud-based maps styling</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization" ><span class="devsite-nav-text" tooltip>Overview</span></a></li><li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Get Started</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/setup-leg" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/setup-leg" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/setup-leg" ><span class="devsite-nav-text" tooltip>Get started and set up</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/tut-leg" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/tut-leg" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/tut-leg" ><span class="devsite-nav-text" tooltip>Tutorial - Highlight a road network</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/update-legacy" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/update-legacy" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/update-legacy" ><span class="devsite-nav-text" tooltip>Update a map style to the latest version</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/update-old2-leg" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/update-old2-leg" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/update-old2-leg" ><span class="devsite-nav-text" tooltip>Map feature changes</span></a></li></ul></div></li><li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Create and use map styles</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/map-styles-leg" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/map-styles-leg" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/map-styles-leg" ><span class="devsite-nav-text" tooltip>Create and use map styles</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/test-style-updates" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/test-style-updates" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/test-style-updates" ><span class="devsite-nav-text" tooltip>Test map style updates</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/zoom-levels-leg" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/zoom-levels-leg" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/zoom-levels-leg" ><span class="devsite-nav-text" tooltip>Style zoom levels</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/versions" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/versions" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/versions" ><span class="devsite-nav-text" tooltip>Work with map style versions</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/taxonomy" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/taxonomy" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/taxonomy" ><span class="devsite-nav-text" tooltip>What you can style on a map</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/map-hier-leg" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/map-hier-leg" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/map-hier-leg" ><span class="devsite-nav-text" tooltip>Understand map style inheritance and hierarchy</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/overlap-leg" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/overlap-leg" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/overlap-leg" ><span class="devsite-nav-text" tooltip>Manage styles that overlap</span></a></li></ul></div></li><li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Modify map settings</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/poi-behavior-customization-leg" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/poi-behavior-customization-leg" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/poi-behavior-customization-leg" ><span class="devsite-nav-text" tooltip>Control the density of Points of interest</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/viz-leg" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/viz-leg" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/viz-leg" ><span class="devsite-nav-text" tooltip>Filter which map features to display</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/building-style-leg" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/building-style-leg" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/building-style-leg" ><span class="devsite-nav-text" tooltip>Change the style of buildings</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/landmarks-leg" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/landmarks-leg" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/landmarks-leg" ><span class="devsite-nav-text" tooltip>Change the style of landmarks</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/app-background-leg" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/app-background-leg" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/app-background-leg" ><span class="devsite-nav-text" tooltip>Change the app background color</span></a></li></ul></div></li><li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Style examples and guidelines</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/style-examples-leg" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/style-examples-leg" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/style-examples-leg" ><span class="devsite-nav-text" tooltip>Styling examples</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/design-resources-leg" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/design-resources-leg" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/design-resources-leg" ><span class="devsite-nav-text" tooltip>Design checklist</span></a></li></ul></div></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/troubleshoot" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/troubleshoot" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/troubleshoot" ><span class="devsite-nav-text" tooltip>Troubleshoot</span></a></li><li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Legacy cloud-based maps styling</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/legacy-overview" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/legacy-overview" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/legacy-overview" ><span class="devsite-nav-text" tooltip>Overview</span></a></li><li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Get Started</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/legacy-setup" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/legacy-setup" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/legacy-setup" ><span class="devsite-nav-text" tooltip>Set up and billing</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/use-style-editor" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/use-style-editor" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/use-style-editor" ><span class="devsite-nav-text" tooltip>Legacy Map Style Editor walkthrough</span></a></li></ul></div></li><li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Use legacy cloud styling</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/map-styles" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/map-styles" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/map-styles" ><span class="devsite-nav-text" tooltip>Manage legacy map styles</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/zoom-levels" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/zoom-levels" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/zoom-levels" ><span class="devsite-nav-text" tooltip>Work with legacy zoom levels</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/poi-behavior-customization" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/poi-behavior-customization" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/poi-behavior-customization" ><span class="devsite-nav-text" tooltip>Customize legacy POI behavior</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/building-style" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/building-style" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/building-style" ><span class="devsite-nav-text" tooltip>Customize legacy building style</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/cloud-customization/legacy-examples" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/cloud-customization/legacy-examples" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/cloud-customization/legacy-examples" ><span class="devsite-nav-text" tooltip>Legacy examples</span></a></li></ul></div></li></ul></div></li></ul></div></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Customize with JSON styling</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/styling" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/styling" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/styling" ><span class="devsite-nav-text" tooltip>Using the style parameter</span></a></li><li class="devsite-nav-item"><a href="/maps/documentation/maps-static/style-reference" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/style-reference" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/style-reference" ><span class="devsite-nav-text" tooltip>Style reference</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Web Services</span> </div></li> <li class="devsite-nav-item"><a href="/maps/documentation/maps-static/static-web-api-best-practices" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/static-web-api-best-practices" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/static-web-api-best-practices" ><span class="devsite-nav-text" tooltip>Best Practices</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Billing and Reporting</span> </div></li> <li class="devsite-nav-item"><a href="/maps/documentation/maps-static/usage-and-billing" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/usage-and-billing" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/usage-and-billing" ><span class="devsite-nav-text" tooltip>Usage and Billing</span></a></li> <li class="devsite-nav-item"><a href="/maps/documentation/maps-static/report-monitor" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /maps/documentation/maps-static/report-monitor" track-type="bookNav" track-name="click" track-metadata-eventdetail="/maps/documentation/maps-static/report-monitor" ><span class="devsite-nav-text" tooltip>Reporting and Monitoring</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Policies and Terms</span> </div></li> <li class="devsite-nav-item devsite-nav-external"><a href="https://cloud.google.com/maps-platform/terms/" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: https://cloud.google.com/maps-platform/terms/" track-type="bookNav" track-name="click" track-metadata-eventdetail="https://cloud.google.com/maps-platform/terms/" ><span class="devsite-nav-text" tooltip>Terms of Service</span><span class="devsite-nav-icon material-icons" data-icon="external" data-title="External" aria-hidden="true"></span></a></li> </ul> <ul class="devsite-nav-list" menu="Documentation" aria-label="Side menu" hidden> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Get Started </span> </span> </li> <li class="devsite-nav-item"> <a href="/maps/get-started" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Get Started with Google Maps Platform" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Get Started with Google Maps Platform </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/api-picker" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: API Picker" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > API Picker </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/billing-and-pricing/overview" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Billing & Pricing" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Billing & Pricing </span> </a> </li> <li class="devsite-nav-item"> <a href="https://mapsplatform.google.com/resources/trust-center" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Security & Compliance" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Security & Compliance </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/reporting-and-monitoring/overview" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Reporting & Monitoring" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Reporting & Monitoring </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/faq" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: FAQ" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > FAQ </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/support" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Support and Resources" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Support and Resources </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/support/care" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Customer Care" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Customer Care </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/incident-management" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Incident Management" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Incident Management </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Maps </span> </span> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/javascript" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Maps JavaScript API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Maps JavaScript API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/android-sdk" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Maps SDK for Android" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Maps SDK for Android </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/ios-sdk" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Maps SDK for iOS" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Maps SDK for iOS </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/flutter-package/overview" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Google Maps for Flutter" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Google Maps for Flutter </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/embed" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Maps Embed API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Maps Embed API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/maps-static" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Maps Static API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Maps Static API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/streetview" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Street View Static API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Street View Static API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/urls" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Maps URLs" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Maps URLs </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/aerial-view" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Aerial View API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Aerial View API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/elevation" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Elevation API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Elevation API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/tile" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Map Tiles API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Map Tiles API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/datasets" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Maps Datasets API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Maps Datasets API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/web-components" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Web Components (Preview)" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Web Components (Preview) </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Routes </span> </span> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/routes" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Routes API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Routes API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/navigation/android-sdk" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Navigation SDK for Android" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Navigation SDK for Android </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/navigation/ios-sdk" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Navigation SDK for iOS" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Navigation SDK for iOS </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/cross-platform/navigation" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Navigation for Flutter" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Navigation for Flutter </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/cross-platform/navigation" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Navigation for React Native" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Navigation for React Native </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/roads" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Roads API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Roads API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/directions" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Directions API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Directions API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/distance-matrix" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Distance Matrix API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Distance Matrix API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/route-optimization" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Route Optimization API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Route Optimization API </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Solutions </span> </span> </li> <li class="devsite-nav-item"> <a href="/maps/solutions" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Industry solutions" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Industry solutions </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/mobility" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Mobility services" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Mobility services </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Places </span> </span> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/places/web-service" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Places API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Places API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/places/android-sdk" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Places SDK for Android" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Places SDK for Android </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/places/ios-sdk" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Places SDK for iOS" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Places SDK for iOS </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/javascript/places" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Places Library, Maps JavaScript API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Places Library, Maps JavaScript API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/geocoding" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Geocoding API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Geocoding API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/geolocation" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Geolocation API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Geolocation API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/address-validation" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Address Validation API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Address Validation API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/timezone" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Time Zone API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Time Zone API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/places-insights" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Places Insights API (Preview)" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Places Insights API (Preview) </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Environment </span> </span> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/air-quality" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Air Quality API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Air Quality API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/pollen" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Pollen API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Pollen API </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/documentation/solar" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Solar API" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Solar API </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Additional Resources </span> </span> </li> <li class="devsite-nav-item"> <a href="/maps/api-security-best-practices" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: API Security Best Practices" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > API Security Best Practices </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/digital-signature" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Digital Signature Guide" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Digital Signature Guide </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/coverage" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Map Coverage Details" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Map Coverage Details </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/optimization-guide" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Optimization Guide" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Optimization Guide </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/software-support" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Mobile OS and software support" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Mobile OS and software support </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/launch-stages" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Launch stages" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Launch stages </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/deprecations" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Deprecations" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Deprecations </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/asset-tracking-plan" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Asset Tracking Plan" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Asset Tracking Plan </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/url-encoding" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: URL Encoding" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > URL Encoding </span> </a> </li> <li class="devsite-nav-item"> <a href="/maps/third-party-platforms/wordpress" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: WordPress Users" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > WordPress Users </span> </a> </li> </ul> <ul class="devsite-nav-list" menu="Community" aria-label="Side menu" hidden> <li class="devsite-nav-item"> <a href="https://stackoverflow.com/questions/tagged/google-maps" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: StackOverflow" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > StackOverflow </span> </a> </li> <li class="devsite-nav-item"> <a href="https://github.com/googlemaps/" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: GitHub" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > GitHub </span> </a> </li> <li class="devsite-nav-item"> <a href="https://www.youtube.com/c/GoogleMapsPlatform" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: YouTube" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > YouTube </span> </a> </li> <li class="devsite-nav-item"> <a href="https://discord.gg/f4hvx8Rp2q" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Discord" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Discord </span> </a> </li> <li class="devsite-nav-item"> <a href="https://twitter.com/GMapsPlatform" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: X (Twitter)" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > X (Twitter) </span> </a> </li> <li class="devsite-nav-item"> <a href="https://issuetracker.google.com/bookmark-groups/76561" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Issue Tracker" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Issue Tracker </span> </a> </li> <li class="devsite-nav-item"> <a href="https://devlibrary.withgoogle.com/products/maps" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Google Dev Library" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Google Dev Library </span> </a> </li> </ul> </div> </div> </nav> </devsite-book-nav> <section id="gc-wrapper"> <main role="main" class="devsite-main-content" has-book-nav > <devsite-content> <article class="devsite-article"><style> /* Styles inlined from /maps/documentation/local_extensions.css */ .version { text-align: right; } .code { color: #006000; font-family: "Courier", monospace; font-size: 100%; } .grid td { padding: 4px; border-collapse: collapse; border: 1px solid gray; } .header td { font-weight: bold; background: #EEEEEE; } .encodeBox { width: 550px; height: 40px; font-size: 14px; font-family: Courier; } .inputField { width: 160px; } #pointList { width: 300px; font-size: 12px; } #txtAddress { width: 14em; } .welcome { border: none; } .welcome td{ border: none; padding:0 10px 0 10px; } .number { background-color: #E5ECF9; text-align:center; vertical-align:middle; padding: 0 5px; } .leftpadding { padding: 0 0 0 10px; } .identifier { color: black; } /* List the contents inline to save vertical space */ .summarylist { margin-right: 4em; } .summarylist li { display: inline; margin: 0em; margin-right: 0.2em; line-height: 1.5em; } /* Self-links for Maps API for Flash */ a.self-link:link { color: #0000cc; text-decoration: none; } a.self-link:active { color: #0000cc; text-decoration: none; } a.self-link:visited { color: #0000cc; text-decoration: none; } /* Self-links for Maps API */ .self-link { cursor: pointer; } .blackbg { background: #333; } </style><style> /* Styles inlined from /maps/styles/common.css */ /* Enable Billing Modal Dialog Styles */ .devsite-enable-billing-dialog { left: 50%; margin-left: -274px; top: 25%; width: 548px; } .devsite-dialog-close { color: #747474; } #devsite-dialog-onload-billing-enabled { padding: 0; } #devsite-dialog-onload-billing-enabled .get-key-check { background: no-repeat #8cc152 center/72px url(/maps/images/lhimages/v2/check@2x.png); height: 150px; width: 100%; } #devsite-dialog-onload-billing-enabled .devsite-dialog-contents, #devsite-dialog-onload-billing-enabled .devsite-dialog-buttons { margin: 8px; } .devsite-enable-billing-dialog ol { list-style: none; margin: 40px 0; padding: 0; } .devsite-enable-billing-dialog li { counter-increment: step-counter; font-size: 14px; line-height: 16px; margin-bottom: 28px; } .devsite-enable-billing-dialog li::before { border-radius: 50%; border: 2px solid #ececec; color: #00bcd4; content: counter(step-counter); font-size: 14px; font-weight: 500; margin-right: 22px; padding: 6px 10px; } /* Style Wizard introduction */ .styleWizardIntroMain { border-radius: 3px; height: 500; width: 640; } .styleWizardIntroSixMapSamples { left: calc(50% - (500px / 2)); line-height: 1; position: relative; text-align: center; width: 500px; } .styleWizardIntroSample { border: 1px solid rgba(0,0,0,0.07); border-radius: 3px; box-shadow: 0 1px 12px 0 rgba(0,0,0,0.10); display: inline-block; height: 140px; margin: 10px; overflow: hidden; width: 140px; } .styleWizardIntroCaption { text-align: center; } /* TODO(cl/330601385) waiting on fix to be deployed */ .devsite-jsfiddle-hide { position:absolute; top: -99999px; left: -99999px; display:block; } /* Styles for /maps/solutions best practices content */ #bp-background { border-radius: 25px; background: #e8eaed; } #bp-heading span { float:left; margin-right:10px; position:relative; padding: 10px; } /* Use as <ul id="bp-bullet><li>{{ [bp|add]_bullet }}Text here... to have icons serve as the bullet symbol. */ #bp-bullet { list-style-type: none; text-indent: -20px; margin-left: 50px; } #platform-box { float: right; position: relative; width: 35%; padding: 20px 20px 0 20px; margin-left: 30px; margin-bottom: 30px; background-color: #ceead6; border-color: #e8eaed; border-style: solid; } #sb-box { float: right; position: relative; width: 25%; padding: 20px 20px 0 20px; margin-left: 30px; margin-bottom: 30px; background-color: #d2e3fc; border-color: #e8eaed; border-style: solid; } /** Table formatting used in the How to use, How to access, and Inputs and * outputs sections of the API overviews. You can leave the first column blank, * as shown in the How to access sections. For questions, contact @wildwood **/ .implementation-path tr td:first-of-type { background: var(--tenant-background-1) !important; max-width: 48px; vertical-align: top; } .implementation-path tr td:nth-of-type(2) { background: var(--tenant-background-1) !important; color: var(--tenant-primary-text-color); min-width: 200px; text-align: left; vertical-align: top; } .implementation-path tr td { color: var(--tenant-secondary-text-color); padding: 24px; } .implementation-path tr { border-top: var(--tenant-primary-border); vertical-align: top; } /** From docs-intro.css - This forms the bubbles with numbers in the above table. **/ .implementation-path .numbered { background: var(--tenant-numbered-row-background-color, #BDBDBD); border-radius: 50%; color: var(--tenant-inverted-text-color); display: inline-block; font-size: 20px; height: 36px; line-height: 36px; margin-right: 20px; text-align: center; vertical-align: top; width: 36px; position: relative; top:-8px; } </style><style> .center { text-align: center } </style> <div class="devsite-banner devsite-banner-announcement nocontent" > <div class="devsite-banner-message"> <div class="devsite-banner-message-text"> New basemap styling is coming soon to Google Maps Platform. This update to map styling includes a new default color palette, modernized pins, and improvements to map experiences and usability. All map styles will be automatically updated in March 2025. For more information on availability and how to opt in earlier, see <a href="/maps/new-map-style-opt-in">New map style for Google Maps Platform</a>. </div> </div> </div> <div class="devsite-article-meta nocontent" role="navigation"> <ul class="devsite-breadcrumb-list" aria-label="Breadcrumb"> <li class="devsite-breadcrumb-item "> <a href="https://developers.google.com/" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="" > Home </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developers.google.com/products" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="2" track-type="globalNav" track-name="breadcrumb" track-metadata-position="2" track-metadata-eventdetail="" > Products </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developers.google.com/maps" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="3" track-type="globalNav" track-name="breadcrumb" track-metadata-position="3" track-metadata-eventdetail="Google Maps Platform" > Google Maps Platform </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developers.google.com/maps/documentation" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="4" track-type="globalNav" track-name="breadcrumb" track-metadata-position="4" track-metadata-eventdetail="" > Documentation </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developers.google.com/maps/web" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="5" track-type="globalNav" track-name="breadcrumb" track-metadata-position="5" track-metadata-eventdetail="Google Maps APIs for Web" > Web </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developers.google.com/maps/documentation/maps-static" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="6" track-type="globalNav" track-name="breadcrumb" track-metadata-position="6" track-metadata-eventdetail="Maps Static API" > Maps Static API </a> </li> </ul> <devsite-thumb-rating position="header"> </devsite-thumb-rating> </div> <devsite-feedback position="header" project-name="Maps Static API" product-id="81777" bucket="" context="Static Maps API" version="t-devsite-webserver-20241114-r00-rc02.464922260396498922" data-label="Send Feedback Button" track-type="feedback" track-name="sendFeedbackLink" track-metadata-position="header" class="nocontent" project-icon="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers/images/touchicon-180-new.png" project-support-url="https://developers.google.com/maps/documentation/maps-static/support" > <button> Send feedback </button> </devsite-feedback> <h1 class="devsite-page-title" tabindex="-1"> Get Started </h1> <devsite-feature-tooltip ack-key="AckCollectionsBookmarkTooltipDismiss" analytics-category="Site-Wide Custom Events" analytics-action-show="Callout Profile displayed" analytics-action-close="Callout Profile dismissed" analytics-label="Create Collection Callout" class="devsite-page-bookmark-tooltip nocontent" dismiss-button="true" id="devsite-collections-dropdown" dismiss-button-text="Dismiss" close-button-text="Got it"> <devsite-bookmark></devsite-bookmark> <span slot="popout-heading"> Stay organized with collections </span> <span slot="popout-contents"> Save and categorize content based on your preferences. </span> </devsite-feature-tooltip> <div class="devsite-page-title-meta"><devsite-view-release-notes></devsite-view-release-notes></div> <devsite-toc class="devsite-nav" depth="2" devsite-toc-embedded > </devsite-toc> <div class="devsite-article-body clearfix "> <h2 id="introduction" data-text="Introduction" tabindex="-1">Introduction</h2> <p>The Maps Static API returns an image (either GIF, PNG or JPEG) in response to an HTTP request via a URL. For each request, you can specify the location of the map, the size of the image, the zoom level, the type of map, and the placement of optional markers at locations on the map. You can additionally label your markers using alphanumeric characters.</p> <p>A Maps Static API image is embedded within an <code translate="no" dir="ltr"><img></code> tag's <code translate="no" dir="ltr">src</code> attribute, or its equivalent in other programming languages.</p> <p>This document describes the required format of Maps Static API URLs and the available parameters. It also points out some tips and tricks in specifying your URLs.</p> <h3 id="before-you-begin" data-text="Before you begin" tabindex="-1">Before you begin</h3> <p>This document is intended for website and mobile developers who want to include Maps Static API images within a webpage or mobile application. It provides an introduction to using the API and reference material on the available parameters.</p> <p>Before you start developing with the Maps Static API, review the <a href="/maps/documentation/maps-static/get-api-key">authentication requirements</a> (you need an API key) and the <a href="/maps/documentation/maps-static/usage-and-billing"> API usage and billing</a> information (you need to enable billing on your project).</p> <h2 name="URL_Parameters" id="URL_Parameters" data-text="URL Parameters" tabindex="-1">URL Parameters</h2> <p>A Maps Static API URL must be of the following form:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr">https://maps.googleapis.com/maps/api/staticmap?<var translate="no">parameters</var></pre> <p>If your website is accessed over HTTPS, you must load Maps Static API images over HTTPS as well in order to avoid browser security alerts. HTTPS is also recommended if your requests include sensitive user information, such as a user's location:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"><strong>https:</strong>//maps.googleapis.com/maps/api/staticmap?<var translate="no">parameters</var></pre> <p>Whether using HTTP or HTTPS, certain URL parameters are required while some are optional. As is standard in URLs, all parameters are separated using the ampersand (<code translate="no" dir="ltr">&</code>) character. The list of parameters and their possible values are enumerated in this document.</p> <aside class="note" id="UrlEncoding"><strong>Important:</strong> The discussion of URL parameters uses examples that for clarity are given in their pre-escaping form. Before sending any request to the API, its parameters should be properly <a href="/maps/url-encoding">URL-encoded</a>. For example, many parameters use a pipe character (<code translate="no" dir="ltr">|</code>) as a separator, which should be encoded as <code translate="no" dir="ltr">%7C</code> in the final URL, as in the quick example at the top of this document. For more information, see <a href="/maps/documentation/maps-static/web-service-best-practices#BuildingURLs"> Building a Valid URL</a>.</aside> <p>The Maps Static API defines map images using the following URL parameters:</p> <h4 id="location" data-text="Location parameters" tabindex="-1">Location parameters</h4> <ul> <li><code translate="no" dir="ltr">center</code> (<em>required</em> if markers not present) defines the center of the map, equidistant from all edges of the map. This parameter takes a location as either a comma-separated {latitude,longitude} pair (e.g. "40.714728,-73.998672") or a string address (e.g. "city hall, new york, ny") identifying a unique location on the face of the earth. For more information, see <a href="#Locations">Locations</a>.</li> <li><code translate="no" dir="ltr">zoom</code> (<em>required</em> if markers not present) defines the <a href="#Zoomlevels">zoom level</a> of the map, which determines the magnification level of the map. This parameter takes a numerical value corresponding to the zoom level of the region desired. For more information, see <a href="#Zoomlevels">Zoom levels</a>.</li> </ul> <h4 id="map-parameters" data-text="Map parameters" tabindex="-1">Map parameters</h4> <ul> <li><code translate="no" dir="ltr">size</code> (<em>required</em>) defines the rectangular dimensions of the map image. This parameter takes a string of the form <code translate="no" dir="ltr"><em>{horizontal_value}</em>x<em>{vertical_value}</em></code>. For example, <code translate="no" dir="ltr">500x400</code> defines a map 500 pixels wide by 400 pixels high. Maps smaller than 180 pixels in width will display a reduced-size Google logo. This parameter is affected by the <a href="#scale_parameter"><code translate="no" dir="ltr">scale</code> parameter</a>; the final output size is the product of the size and scale values.</li> <li><code translate="no" dir="ltr">scale</code> (<em>optional</em>) affects the number of pixels that are returned. <code translate="no" dir="ltr">scale=2</code> returns twice as many pixels as <code translate="no" dir="ltr">scale=1</code> while retaining the same coverage area and level of detail (i.e. the contents of the map don't change). This is useful when developing for high-resolution displays. The default value is <code translate="no" dir="ltr">1</code>. Accepted values are <code translate="no" dir="ltr">1</code> and <code translate="no" dir="ltr">2</code>. See <a href="#scale_values">Scale Values</a> for more information.</li> <li><code translate="no" dir="ltr">format</code> (<em>optional</em>) defines the format of the resulting image. By default, the Maps Static API creates PNG images. There are several possible formats including GIF, JPEG and PNG types. Which format you use depends on how you intend to present the image. JPEG typically provides greater compression, while GIF and PNG provide greater detail. For more information, see <a href="#ImageFormats">Image Formats.</a></li> <li><code translate="no" dir="ltr">maptype</code> (<em>optional</em>) defines the type of map to construct. There are several possible maptype values, including <code translate="no" dir="ltr">roadmap</code>, <code translate="no" dir="ltr">satellite</code>, <code translate="no" dir="ltr">hybrid</code>, and <code translate="no" dir="ltr">terrain</code>. For more information, see <a href="#MapTypes">Maps Static API Maptypes</a>. </li> <li><code translate="no" dir="ltr">language</code> (<em>optional</em>) defines the language to use for display of labels on map tiles. Note that this parameter is only supported for some country tiles; if the specific language requested is not supported for the tile set, then the default language for that tileset will be used.</li> <li><code translate="no" dir="ltr">region</code> (<em>optional</em>) defines the appropriate borders to display, based on geo-political sensitivities. Accepts a region code specified as a two-character ccTLD ('top-level domain') value. See <a href="https://developers.google.com/maps/coverage">Google Maps Platform Coverage Details</a> for supported regions.</li> </ul> <h4 id="feature-parameters" data-text="Feature parameters" tabindex="-1">Feature parameters</h4> <ul> <li><code translate="no" dir="ltr">map_id</code> (<em>optional</em>) specifies the identifier for a specific map. The Map ID associates a map with a particular style or feature, and must belong to the same project as the API key used to initialize the map. For more information, see <a href="/maps/documentation/get-map-id">Using Map IDs</a>.</li> <li><code translate="no" dir="ltr">markers</code> (<em>optional</em>) define one or more markers to attach to the image at specified locations. This parameter takes a single marker definition with parameters separated by the pipe character (<code translate="no" dir="ltr">|</code>). Multiple markers may be placed within the same <code translate="no" dir="ltr">markers</code> parameter as long as they exhibit the same style; you may add additional markers of differing styles by adding additional <code translate="no" dir="ltr">markers</code> parameters. Note that if you supply markers for a map, you do not need to specify the (normally required) <code translate="no" dir="ltr">center</code> and <code translate="no" dir="ltr">zoom</code> parameters. For more information, see <a href="#Markers">Maps Static API Markers</a>.</li> <li><code translate="no" dir="ltr">path</code> (<em>optional</em>) defines a single path of two or more connected points to overlay on the image at specified locations. This parameter takes a string of point definitions separated by the pipe character (<code translate="no" dir="ltr">|</code>), or an encoded polyline using the <code translate="no" dir="ltr">enc:</code> prefix within the location declaration of the path. You may supply additional paths by adding additional <code translate="no" dir="ltr">path</code> parameters. Note that if you supply a path for a map, you do not need to specify the (normally required) <code translate="no" dir="ltr">center</code> and <code translate="no" dir="ltr">zoom</code> parameters. For more information, see <a href="#Paths">Maps Static API Paths</a>.</li> <li><code translate="no" dir="ltr">visible</code> (<em>optional</em>) specifies one or more <a href="#Locations">locations</a> that should remain visible on the map, though no markers or other indicators will be displayed. Use this parameter to ensure that certain features or map locations are shown on the Maps Static API.</li> <li><code translate="no" dir="ltr">style</code> (<em>optional</em>) defines a custom style to alter the presentation of a specific feature (roads, parks, and other features) of the map. This parameter takes <code translate="no" dir="ltr">feature</code> and <code translate="no" dir="ltr">element</code> arguments identifying the features to style, and a set of style operations to apply to the selected features. You can supply multiple styles by adding additional <code translate="no" dir="ltr">style</code> parameters. For more information, see the guide to <a href="/maps/documentation/maps-static/styling">styled maps</a>. </li> </ul> <h4 id="key-and-signature-parameters" data-text="Key and signature parameters" tabindex="-1">Key and signature parameters</h4> <ul> <li><code translate="no" dir="ltr">key</code> (<em>required</em>) allows you to monitor your application's API usage in the <a href="https://console.cloud.google.com" target="console" class="gc-analytics-event external" data-category="GMPMapsStaticStart" data-action="linkClick: link" data-label="keyAndSignatureParameters">Google Cloud Console</a>, and ensures that Google can contact you about your application if necessary. For more information, see <a href="/maps/documentation/maps-static/get-api-key">Use API Keys with Maps Static API</a>.</li> <li><code translate="no" dir="ltr">signature</code> (<em>recommended</em>) is a digital signature used to verify that any site generating requests using your API key is authorized to do so. Requests without a digital signature might fail. For more information, see <a href="/maps/documentation/maps-static/digital-signature">Use a Digital Signature</a>.</li> </ul> <h3 id="url-size-restriction" data-text="URL size restriction" tabindex="-1">URL size restriction</h3> <p>Maps Static API URLs are restricted to 16384 characters in size. In practice, you will probably not have need for URLs longer than this, unless you produce complicated maps with a high number of markers and paths.</p> <h2 name="Usage" id="Usage" data-text="Parameter Usage" tabindex="-1">Parameter Usage</h2> <p>The Maps Static API is relatively easy to use, as it consists solely of a parameterized URL. This section explains how to use these parameters to construct your URLs.</p> <h3 name="Locations" id="Locations" data-text="Specifying Locations" tabindex="-1">Specifying Locations</h3> <p>The Maps Static API must be able to precisely identify locations on the map, both to focus the map at the correct location (using the <code translate="no" dir="ltr">center</code> parameter) and/or to place any optional placemarks (using the <code translate="no" dir="ltr">markers</code> parameter) at locations on the map. The Maps Static API uses numbers (latitude and longitude values) or strings (addresses) to specify these locations. These values identify a <em>geocoded</em> location.</p> <p>Several parameters (such as the <code translate="no" dir="ltr">markers</code> and <code translate="no" dir="ltr">path</code> parameters) take multiple locations. In those cases, the locations are separated by the pipe (<code translate="no" dir="ltr">|</code>) character.</p> <h4 name="Latlons" id="Latlons" data-text="Latitudes and longitudes" tabindex="-1">Latitudes and longitudes</h4> <p>Latitudes and longitudes are defined using numerals within a comma-separated text string that have a precision to 6 decimal places. For example, "40.714728,-73.998672" is a valid geocode value. Precision beyond the 6 decimal places is ignored.</p> <P>Longitude values are based on their distance from Greenwich, England, home of the prime meridian. Since Greenwich is situated at 51.477222 latitude, we can enter a <code translate="no" dir="ltr">center</code> value of <code translate="no" dir="ltr">51.477222,0</code> to center the map on Greenwich:</P> <p><img border="0" src="https://maps.googleapis.com/maps/api/staticmap?center=51.477222,0&zoom=14&size=400x400&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=ciftxSv4681tGSAnes7ktLrVI3g=" alt="Greenwich, England"></p> <p>Latitude and longitude values must correspond to a valid location on the face of the earth. Latitudes can take any value between <code translate="no" dir="ltr">-90</code> and <code translate="no" dir="ltr">90</code> while longitude values can take any value between <code translate="no" dir="ltr">-180</code> and <code translate="no" dir="ltr">180</code>. If you specify an invalid latitude or longitude value, your request will be rejected as a bad request.</p> <h4 name="Addresses" id="Addresses" data-text="Addresses" tabindex="-1">Addresses</h4> <p>Most people don't speak in latitudes and longitudes; they denote locations using <em>addresses</em>. The process of turning an address into a geographic point is known as <em>geocoding</em> and the Maps Static API service can perform geocoding for you if you provide valid addresses.</p> <p>In any parameter where you may provide a latitude/longitude, you may instead specify a string indicating an <em>address</em>. Google will geocode the address and provide the Maps Static API service with a latitude/longitude value to use in placing markers or specifying locations. The string should be <a href="/maps/url-encoding" class="external">URL-encoded</a>, so addresses such as "City Hall, New York, NY" should be converted to "City+Hall,New+York,NY", for example.</p> <p>Note that addresses may reflect either precise locations, such as street addresses, polylines such as named routes, or polygonal areas such as cities, countries, or national parks. For polylinear and polygonal results, the Maps Static API server will use the center point of the line/area as the address center. If you have doubt about how an address may geocode, you can test out the address using this <a href="/maps/documentation/utils/geocoder"> Geocoding Utility</a>.</p> <aside class="note"><strong>Note</strong>: If you choose to specify locations using a method that requires geocoding, such as human-readable address strings or polylines, the request is limited to a maximum of 15 locations. This limit applies only to locations that require geocoding. It does not apply to locations specified with latitude/longitude coordinates.</aside> <p>The following example generates a static map image for Berkeley, CA:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> https://maps.googleapis.com/maps/api/staticmap?center=Berkeley,CA&zoom=14&size=400x400&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> </pre> <p><img border="0" src="https://maps.googleapis.com/maps/api/staticmap?center=Berkeley,CA&zoom=13&size=400x400&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=45D4gqkHrzXqD1o0ucV_geljI6A=" alt="Berkeley, CA"></p> <h3 name="Zoomlevels" id="Zoomlevels" data-text="Zoom levels" tabindex="-1">Zoom levels</h3> <p>Maps on Google Maps have an integer 'zoom level' which defines the resolution of the current view. Zoom levels between <code translate="no" dir="ltr">0</code> (the lowest zoom level, in which the entire world can be seen on one map) and <code translate="no" dir="ltr">21+</code> (down to streets and individual buildings) are possible within the default <code translate="no" dir="ltr">roadmap</code> view. Building outlines, where available, appear on the map around zoom level <code translate="no" dir="ltr">17</code>. This value differs from area to area and can change over time as the data evolves.</p> <p>Google Maps sets zoom level <code translate="no" dir="ltr">0</code> to encompass the entire earth. Each succeeding zoom level doubles the precision in both horizontal and vertical dimensions. More information on how this is done is available in the <a href="/maps/documentation/javascript/coordinates">Google Maps JavaScript API documentation</a>.</p> <p>Note: not all zoom levels appear at all locations on the earth. Zoom levels vary depending on location, as data in some parts of the globe is more granular than in other locations.</p> <p>If you send a request for a zoom level in which no map tiles exist, the Maps Static API will return a blank image instead.</p> <p>The following list shows the approximate level of detail you can expect to see at each zoom level:</p> <ul> <li>1: World</li> <li>5: Landmass/continent</li> <li>10: City</li> <li>15: Streets</li> <li>20: Buildings</li> </ul> <p>This example requests two maps of Manhattan at the same <code translate="no" dir="ltr">center</code> value but at zoom levels 12 and 14, respectively:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> https://maps.googleapis.com/maps/api/staticmap?center=40.714728,-73.998672&zoom=12&size=400x400&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> https://maps.googleapis.com/maps/api/staticmap?center=40.714728,-73.998672&zoom=14&size=400x400&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> </pre> <p><img border="0" src="https://maps.googleapis.com/maps/api/staticmap?center=40.714728,-73.998672&zoom=12&size=400x400&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=E8bxB4CGXI6iIqf4jXqi7cUis-Q=" alt="Manhattan Faraway">  <img border="0" src="https://maps.googleapis.com/maps/api/staticmap?center=40.714728,-73.998672&zoom=14&size=400x400&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=QHhiUnLwaKM5Nd_ZTJfZTwSWoGg=" alt="Manhattan Up Close"></p> <h3 id="Imagesizes" name="Imagesizes" data-text="Image sizes" tabindex="-1">Image sizes</h3> <p>The <code translate="no" dir="ltr">size</code> parameter, in conjunction with <code translate="no" dir="ltr">center</code>, defines the coverage area of a map. It also defines the output size of the map in pixels, when multiplied with the <code translate="no" dir="ltr">scale</code> value (which is <code translate="no" dir="ltr">1</code> by default). <p>This table shows the maximum allowable values for the <code translate="no" dir="ltr">size</code> parameter at each <code translate="no" dir="ltr">scale</code> value.</p> <table> <tr> <th><code translate="no" dir="ltr">scale=1</code></th> <th><code translate="no" dir="ltr">scale=2</code></th> </tr> <tr> <td><code translate="no" dir="ltr">640x640</code></td> <td><code translate="no" dir="ltr">640x640</code> (returns 1280x1280 pixels)</td> </tr> </table> <p>This example requests a "slice" of the earth at the equator at zoom level 1:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> https://maps.googleapis.com/maps/api/staticmap?center=0,0&zoom=1&size=400x50&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> </pre> <p><img border="0" src="https://maps.googleapis.com/maps/api/staticmap?center=0,0&zoom=1&size=400x50&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=Jm6pzAEElBmZu7LtfeO1Blst8OY=" alt="Equator"></p> <p>This example requests a small map, of size 100 x 100 pixels centered on the same region. Note the smaller Google logo:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> https://maps.googleapis.com/maps/api/staticmap?center=0,0&zoom=1&size=100x100&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> </pre> <p><img border="0" src="https://maps.googleapis.com/maps/api/staticmap?center=0,0&zoom=1&size=100x100&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=uhoTF9ISyLNeuhiVMfTd2gDqEJ4=" alt="Small Equator Map"></p> <h3 id="scale_values" data-text="Scale values" tabindex="-1">Scale values</h3> <p>The <code translate="no" dir="ltr">size</code> parameter of the Maps Static API defines the size of a map in pixels, so that a map with <code translate="no" dir="ltr">size=200x200</code> will be returned as 200 pixels by 200 pixels. On an LCD computer monitor, which typically displays about 100 pixels per inch (ppi), a 200x200 map will be about 2 inches in each dimension.</p> <p>However, mobile devices increasingly include high resolution screens with pixel densities over 300ppi, which either:</p> <ul> <li>Reduce the size of a 200x200 pixel image to only 0.7 of an inch, rendering labels and icons too small to read; or</li> <li>Scale (zoom) the image to improve legibility, resulting in a fuzzy or pixelated image.</li> </ul> <table> <tr> <th>Too small</th> <th>Too fuzzy</th> </tr> <tr> <td><img src="/static/maps/documentation/maps-static/images/s133at66.png" height="66px" width="66px"></td> <td><img src="/static/maps/documentation/maps-static/images/s66at200.png" height="200px" width="200px"></td> </tr> </table> <p>When developing for mobile devices, you can use the API's <code translate="no" dir="ltr">scale</code> parameter to return higher-resolution map images that solve the issues above. The <code translate="no" dir="ltr">scale</code> value is multiplied with the <code translate="no" dir="ltr">size</code> to determine the actual output size of the image in pixels, without changing the coverage area of the map. Default <code translate="no" dir="ltr">scale</code> value is 1; accepted values are 1 and 2.</p> <p>For example, a scale value of 2 will return the same map coverage area as a request with no scale specified, but with twice as many pixels in each dimension. This includes roads and labels, so that they're legible on high resolution, small size screens, as well as when scaled by the browser. </p> <table> <tr> <th>150x150</th> <th>150x150&scale=2</th> </tr> <tr> <td><img src="/static/maps/documentation/maps-static/images/s150.png"></td> <td><img src="/static/maps/documentation/maps-static/images/s150x2.png"></td> </tr> </table> <p>Such an image will also perform well on desktop browsers, when inserted into an <code translate="no" dir="ltr">img</code> or <code translate="no" dir="ltr">div</code> tag with the height and width set using CSS. The browser will downsize the image to the correct size, without loss of quality.</p> <p>This table shows three different image requests.</p> <ul> <li>The first is for a 100x100 image, with no scale value specified. It displays properly on the desktop, but is too small to read on a mobile device.</li> <li>The second doubles the map size. On the desktop, the CSS fits it into the specified 100x100 <code translate="no" dir="ltr">img</code> element, but in downsizing the image, roads and labels become too small. On the mobile device, the image is the right size, but again, roads and labels are illegible.</li> <li>The third request is for a 100x100 map with <code translate="no" dir="ltr">scale=2</code>. The image is returned with 200px of detail; the desktop scales it down perfectly, so that it's indistinguishable from the original 100x100 request, while the mobile browser benefits from the additional resolution returned by the API.</li> </ul> <table> <tr><th>Image requests</th></tr> <tr> <th>Device</th> <th><code translate="no" dir="ltr">100x100</code></th> <th><code translate="no" dir="ltr">200x200</code></th> <th><code translate="no" dir="ltr">100x100&scale=2</code></th> </tr> <tr> <td>Desktop<br /> (with <code translate="no" dir="ltr">height="100px"</code> and<br /> <code translate="no" dir="ltr">width="100px"</code> on the<br /> <code translate="no" dir="ltr">img</code> tag)</td> <td><img src="/static/maps/documentation/maps-static/images/s100.png"></td> <td><img src="/static/maps/documentation/maps-static/images/s200at100.png"></td> <td><img src="/static/maps/documentation/maps-static/images/s100x2at100.png"></td> </tr> <tr> <td>High Resolution<br /> (simulated)</td> <td><img src="/static/maps/documentation/maps-static/images/s100at50.png"></td> <td><img src="/static/maps/documentation/maps-static/images/s200at100.png"></td> <td><img src="/static/maps/documentation/maps-static/images/s100x2at100.png"></td> </tr> </table> <aside class="note"><strong>Tip</strong>: Mobile platforms, such as Android and iOS, enable apps to support high resolution screens by specifying separate images for each resolution. The scale parameter makes it easy to request a map image for a standard resolution screen, and the matching map for a high resolution screen, simply by setting <code translate="no" dir="ltr">scale=1</code> and <code translate="no" dir="ltr">scale=2</code> respectively.</aside> <p>For more information about developing for mobile and high resolution displays, the following reading is recommended:</p> <ul> <li><a href="https://developer.android.com/guide/practices/screens_support.html" class="external">Supporting Multiple Screens</a> in the Android developer documentation.</li> <li>Webkit.org's recommendations for developing <a href="https://webkit.org/blog/55/high-dpi-web-sites/" class="external">High DPI Web Sites</a>.</li> <li><a href="https://developer.apple.com/library/content/documentation/2DDrawing/Conceptual/DrawingPrintingiOS/SupportingHiResScreensInViews/SupportingHiResScreensInViews.html" class="external">Supporting High-Resolution Screens</a> in the iOS Developer Library.</li> </ul> <h3 name="ImageFormats" id="ImageFormats" data-text="Image formats" tabindex="-1">Image formats</h3> <p>Images may be returned in several common web graphics formats: <strong>GIF</strong>, <strong>JPEG</strong> and <strong>PNG</strong>. The <code translate="no" dir="ltr">format</code> parameter takes one of the following values:</p> <ul> <li><code translate="no" dir="ltr">png8</code> or <code translate="no" dir="ltr">png</code> (default) specifies the 8-bit <a href="https://en.wikipedia.org/wiki/Portable_Network_Graphics" class="external">PNG</a> format.</li> <li><code translate="no" dir="ltr">png32</code> specifies the 32-bit <a href="https://en.wikipedia.org/wiki/Portable_Network_Graphics" class="external">PNG</a> format.</li> <li><code translate="no" dir="ltr">gif</code> specifies the <a href="https://en.wikipedia.org/wiki/GIF" class="external">GIF</a> format.</li> <li><code translate="no" dir="ltr">jpg</code> specifies the <a href="https://en.wikipedia.org/wiki/JPEG" class="external">JPEG</a> compression format.</li> <li><code translate="no" dir="ltr">jpg-baseline</code> specifies a non-progressive <a href="https://en.wikipedia.org/wiki/JPEG" class="external">JPEG</a> compression format.</li> </ul> <p>These examples request maps in <code translate="no" dir="ltr">gif</code> and <code translate="no" dir="ltr">png</code> formats:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> https://maps.googleapis.com/maps/api/staticmap?center=40.714728,-73.998672&format=gif&zoom=14&size=400x400&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> https://maps.googleapis.com/maps/api/staticmap?center=40.714728,-73.998672&format=png&&zoom=14&size=400x400&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> </pre> <p><code translate="no" dir="ltr">jpg</code> and <code translate="no" dir="ltr">jpg-baseline</code> typically provide the smallest image size, though they do so through "lossy" compression which may degrade the image. <code translate="no" dir="ltr">gif</code>, <code translate="no" dir="ltr">png8</code> and <code translate="no" dir="ltr">png32</code> provide lossless compression.</p> <p>Most JPEG images are progressive, meaning that they load a coarser image earlier and refine the image resolution as more data arrives. This allows images to be loaded quickly in webpages and is the most widespread use of JPEG currently. However, some uses of JPEG require non-progressive (baseline) images. In such cases, you may want to use the <code translate="no" dir="ltr">jpg-baseline</code> format, which is non-progressive.</p> <h3 name="MapTypes" id="MapTypes" data-text="Map types" tabindex="-1">Map types</h3> <p>The Maps Static API creates maps in several formats, listed below:</p> <ul> <li><code translate="no" dir="ltr">roadmap</code> (default) specifies a standard roadmap image, as is normally shown on the Google Maps website. If no <code translate="no" dir="ltr">maptype</code> value is specified, the Maps Static API serves <code translate="no" dir="ltr">roadmap</code> tiles by default.</li> <li><code translate="no" dir="ltr">satellite</code> specifies a satellite image.</li> <li><code translate="no" dir="ltr">terrain</code> specifies a physical relief map image, showing terrain and vegetation.</li> <li><code translate="no" dir="ltr">hybrid</code> specifies a hybrid of the satellite and roadmap image, showing a transparent layer of major streets and place names on the satellite image.</li> </ul> <p>You can see the difference between roadmap and terrain types in this code example.</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> https://maps.googleapis.com/maps/api/staticmap?center=40.714728,-73.998672&zoom=12&size=400x400&maptype=roadmap&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> https://maps.googleapis.com/maps/api/staticmap?center=40.714728,-73.998672&zoom=12&size=400x400&maptype=terrain&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> </pre> <p><img border="0" src="https://maps.googleapis.com/maps/api/staticmap?center=40.714728,-73.998672&zoom=12&size=400x400&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=E8bxB4CGXI6iIqf4jXqi7cUis-Q=" alt="Manhattan Normal Map">  <img border="0" src="https://maps.googleapis.com/maps/api/staticmap?center=40.714728,-73.998672&zoom=12&maptype=terrain&size=400x400&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=4bPhEabKjtROEiLcgYXuJKKM5Wc=" alt="Manhattan Terrain Map"></p> <p>Hybrid maps use satellite images and prominent roadmap features to create a combination map. The following examples show satellite and hybrid map types:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> https://maps.googleapis.com/maps/api/staticmap?center=40.714728,-73.998672&zoom=12&size=400x400&maptype=satellite&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> https://maps.googleapis.com/maps/api/staticmap?center=40.714728,-73.998672&zoom=12&size=400x400&maptype=hybrid&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> </pre> <p><img border="0" src="https://maps.googleapis.com/maps/api/staticmap?center=40.714728,-73.998672&zoom=12&maptype=satellite&size=400x400&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=5tyWj9NAOGlFz33nroLk6sV4ASk=" alt="Manhattan Satellite Map">  <img border="0" src="https://maps.googleapis.com/maps/api/staticmap?center=40.714728,-73.998672&zoom=12&maptype=hybrid&size=400x400&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=Ncje4cIKr5E1UCcYvwB5aJC49c0=" alt="Manhattan Terrain Map"></p> <h3 id="StyledMaps" data-text="Styled maps" tabindex="-1">Styled maps</h3> <p>Customize the presentation of the standard Google map by applying your own styles. See the guide to <a href="/maps/documentation/maps-static/styling">styled maps</a>.</p> <h3 name="Markers" id="Markers" data-text="Markers" tabindex="-1">Markers</h3> <p>The <code translate="no" dir="ltr">markers</code> parameter defines a set of one or more markers (map pins) at a set of locations. Each marker defined within a single <code translate="no" dir="ltr">markers</code> declaration must exhibit the same visual style; if you wish to display markers with different styles, you will need to supply multiple <code translate="no" dir="ltr">markers</code> parameters with separate style information.</p> <p>The <code translate="no" dir="ltr">markers</code> parameter takes set of value assignments (<em>marker descriptors</em>) of the following format:</p> <p><code translate="no" dir="ltr">markers=<em>markerStyles</em>|<em>markerLocation1</em>| <em>markerLocation2</em>|...</code> etc.</p> <p>The set of <em>markerStyles</em> is declared at the beginning of the <code translate="no" dir="ltr">markers</code> declaration and consists of zero or more style descriptors separated by the pipe character (<code translate="no" dir="ltr">|</code>), followed by a set of one or more locations also separated by the pipe character (<code translate="no" dir="ltr">|</code>).</p> <p>Because both style information and location information is delimited via the pipe character, style information must appear first in any marker descriptor. Once the Maps Static API server encounters a location in the marker descriptor, all other marker parameters are assumed to be locations as well.</p> <h4 name="MarkerStyles" id="MarkerStyles" data-text="Marker styles" tabindex="-1">Marker styles</h4> <p>The set of marker style descriptors is a series of value assignments separated by the pipe (<code translate="no" dir="ltr">|</code>) character. This style descriptor defines the visual attributes to use when displaying the markers within this marker descriptor. These style descriptors contain the following key/value assignments:</p> <ul> <li><code translate="no" dir="ltr"><em>size:</em></code> (optional) specifies the size of marker from the set <code translate="no" dir="ltr">{tiny, mid, small}</code>. If no <code translate="no" dir="ltr">size</code> parameter is set, the marker will appear in its default (normal) size.</li> <li><p><code translate="no" dir="ltr"><em>color:</em></code> (optional) specifies a 24-bit color (example: <code translate="no" dir="ltr">color=0xFFFFCC</code>) or a predefined color from the set <code translate="no" dir="ltr">{black, brown, green, purple, yellow, blue, gray, orange, red, white}</code>.</p><p>Note that transparencies (specified using 32-bit hex color values) are not supported in markers, though they are supported for paths.</p> </li> <li><code translate="no" dir="ltr"><em>label</em>:</code> (optional) specifies a single <strong>uppercase</strong> alphanumeric character from the set {A-Z, 0-9}. (The requirement for uppercase characters is new to this version of the API.) Note that default and <code translate="no" dir="ltr">mid</code> sized markers are the only markers capable of displaying an <code translate="no" dir="ltr">alphanumeric-character</code> parameter. <code translate="no" dir="ltr">tiny</code> and <code translate="no" dir="ltr">small</code> markers are not capable of displaying an alphanumeric-character.</li> </ul> <aside class="note">Note: instead of using these markers, you may wish to use your own custom icon. (For more information, see <a href="#CustomIcons">Custom icons</a>.)</aside> <h4 name="MarkerScale" id="MarkerScale" data-text="Marker scaling" tabindex="-1">Marker scaling</h4> <p>The <code translate="no" dir="ltr">scale</code> value is multiplied with the marker image size to produce the actual output size of the marker in pixels. Default scale value is 1; accepted values are 1, 2, and 4.</p> <p>The pixel size limit on images applies <em>after</em> scaling is applied. For example, if the marker is set to <code translate="no" dir="ltr">scale:2</code>, then the marker can be larger than the maximum size of 4096 pixels, as long as it reduces to less than 4096 pixels after scaling. Use marker scaling in conjunction with <a href="#scale_values">map scaling</a> when displaying higher-resolution maps. </p> <h4 name="MarkerLocations" id="MarkerLocations" data-text="Marker locations" tabindex="-1">Marker locations</h4> <p>Each marker descriptor must contain a set of one or more locations defining where to place the marker on the map. These locations may be either specified as <a href="#Latlons">latitude/longitude</a> values or as <a href="#Addresses">addresses</a>. These locations are separated using the pipe character (<code translate="no" dir="ltr">|</code>).</p> <p class="note"><strong>Note</strong>: If you choose to specify marker locations using a method that requires geocoding, such as human-readable address strings or polylines, the request is limited to a maximum of 15 markers. This limit applies only to marker locations that require geocoding. It does not apply to marker locations specified with latitude/longitude coordinates. </p> <p>The location parameters define the marker's location on the map. If the location is off the map, that marker will not appear in the constructed image provided that <code translate="no" dir="ltr">center</code> and <code translate="no" dir="ltr">zoom</code> parameters are supplied. However, if these parameters are not supplied, the Maps Static API server will automatically construct an image which contains the supplied markers. (See <a href="#ImplicitPositioning">Implicit positioning</a>.)</p> <p>A sample marker declaration is shown here. Note that we define one set of styles and three locations:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> https://maps.googleapis.com/maps/api/staticmap?center=Williamsburg,Brooklyn,NY&zoom=13&size=400x400& markers=color:blue%7Clabel:S%7C11211%7C11206%7C11222&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> </pre> <p><img border="0" src="https://maps.googleapis.com/maps/api/staticmap?center=Williamsburg,Brooklyn,NY&zoom=13&size=400x400&markers=color:blue%7Clabel:S%7C11211%7C11206%7C11222&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=9I8O8GPILKHfPkxVaNPKu-MsYX8=" alt="Three Brooklyn Zipcodes"></p> <p>To define markers with differing styles, we need to supply multiple <code translate="no" dir="ltr">markers</code> parameters. This set of <code translate="no" dir="ltr">markers</code> parameters defines three markers: one blue marker labeled "S" at 62.107733, -145.5419, one tiny green marker at "Delta Junction, AK", and one mid-sized yellow marker labeled "C" at "Tok, AK". These markers are shown in this example:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> https://maps.googleapis.com/maps/api/staticmap?center=63.259591,-144.667969&zoom=6&size=400x400 &markers=color:blue%7Clabel:S%7C62.107733,-145.541936&markers=size:tiny%7Ccolor:green%7CDelta+Junction,AK &markers=size:mid%7Ccolor:0xFFFF00%7Clabel:C%7CTok,AK"&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> </pre> <p><img border="0" src="https://maps.googleapis.com/maps/api/staticmap?center=63.259591,-144.667969&zoom=6&size=400x400&markers=color:blue%7Clabel:S%7C62.107733,-145.541936&markers=size:tiny%7Ccolor:green%7CDelta+Junction,AK&markers=size:mid%7Ccolor:0xFFFF00%7Clabel:C%7CTok,AK&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=aBsEedpz5TL1v0E-FeVepiOcgiA=" alt="Three Alaska Towns, Different Markers"></p> <h4 id="CustomIcons" data-text="Custom icons" tabindex="-1">Custom icons</h4> <p>Rather than use Google's marker icons, you are free to use your own custom icons instead. Custom icons are specified using the <code translate="no" dir="ltr">icon</code> descriptor in the <code translate="no" dir="ltr">markers</code> parameter. For example:</p> <p><code translate="no" dir="ltr">markers=icon:<em>URLofIcon</em>|<em>markerLocation</em></code></p> <p>Specify the <code translate="no" dir="ltr">icon</code> using a URL (which should be <a href="/maps/url-encoding">URL-encoded</a>). You can use URLs created by URL-shortening services such as <code translate="no" dir="ltr">https://goo.gl</code>. Most URL-shortening services have the advantage of automatically encoding URLs.</p> <p>You may specify an anchor point for the custom icon. The anchor point sets how the icon is placed in relation to the specified <code translate="no" dir="ltr">markers</code> locations. By default, the anchor point of a custom icon is the bottom center of the icon image. You can specify a different anchor point using the <code translate="no" dir="ltr">anchor</code> descriptor in conjunction with your <code translate="no" dir="ltr">icon</code>. Set the <code translate="no" dir="ltr">anchor</code> as an x,y point of the icon (such as <code translate="no" dir="ltr">10,5</code>), or as a predefined alignment using one of the following values: <code translate="no" dir="ltr">top</code>, <code translate="no" dir="ltr">bottom</code>, <code translate="no" dir="ltr">left</code>, <code translate="no" dir="ltr">right</code>, <code translate="no" dir="ltr">center</code>, <code translate="no" dir="ltr">topleft</code>, <code translate="no" dir="ltr">topright</code>, <code translate="no" dir="ltr">bottomleft</code>, or <code translate="no" dir="ltr">bottomright</code>. For example:</p> <p><code translate="no" dir="ltr">markers=anchor:bottomright|icon:<em>URLofIcon</em>|<em>markerLocation1</em>|<em>markerLocation2</em></code></p> <p>You can use up to five unique custom icons per request. This limitation does not mean that you are limited to only 5 marked locations on your map. Each unique icon may be used with more than one <code translate="no" dir="ltr">markers</code> location on your map.</p> <p>Icon format:</p> <ul> <li>Icon images may be in PNG, JPEG or GIF formats, though PNG is recommended.</li> <li>Icons may be up to 4096 pixels maximum size (64x64 for square images).</li> </ul> <h5 id="custom-icon-examples" data-text="Custom icon examples" tabindex="-1">Custom icon examples</h5> <p><strong>Example 1</strong> creates custom icons and positions the icons using anchors.</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> https://maps.googleapis.com/maps/api/staticmap?&size=600x400&style=visibility:on &style=feature:water%7Celement:geometry%7Cvisibility:on &style=feature:landscape%7Celement:geometry%7Cvisibility:on &markers=anchor:32,10%7Cicon:https://goo.gl/5y3S82%7CCanberra+ACT &markers=anchor:topleft%7Cicon:http://tinyurl.com/jrhlvu6%7CMelbourne+VIC &markers=anchor:topright%7Cicon:https://goo.gl/1oTJ9Y%7CSydney+NSW&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span> &signature=<var translate="no">YOUR_SIGNATURE</var> </pre> <p><img border="0" src="https://maps.googleapis.com/maps/api/staticmap?&size=600x400&style=visibility:on&style=feature:water%7Celement:geometry%7Cvisibility:on&style=feature:landscape%7Celement:geometry%7Cvisibility:on&markers=anchor:32,10%7Cicon:https://goo.gl/5y3S82%7CCanberra+ACT&markers=anchor:topleft%7Cicon:http://tinyurl.com/jrhlvu6%7CMelbourne+VIC&markers=anchor:topright%7Cscale:2%7Cicon:https://goo.gl/1oTJ9Y%7CSydney+NSW&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=CVgaRf1COCMxaGukSYxc5Y4E-Rk=" alt="Three Australian towns, different custom icons positioned with anchors."> <p><strong>Example 2</strong> creates the same custom icons as example 1, but does not set the icon positions using anchors, relying on the default anchor of bottom center.</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> https://maps.googleapis.com/maps/api/staticmap?&size=600x400&style=visibility:on &style=feature:water%7Celement:geometry%7Cvisibility:on &style=feature:landscape%7Celement:geometry%7Cvisibility:on &markers=icon:https://goo.gl/5y3S82%7CCanberra+ACT &markers=icon:http://tinyurl.com/jrhlvu6%7CMelbourne+VIC &markers=icon:https://goo.gl/1oTJ9Y%7CSydney+NSW&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> </pre> <p><img border="0" src="https://maps.googleapis.com/maps/api/staticmap?&size=600x400&style=visibility:on&style=feature:water%7Celement:geometry%7Cvisibility:on&style=feature:landscape%7Celement:geometry%7Cvisibility:on&markers=icon:https://goo.gl/5y3S82%7CCanberra+ACT&markers=icon:http://tinyurl.com/jrhlvu6%7CMelbourne+VIC&markers=scale:2%7Cicon:https://goo.gl/1oTJ9Y%7CSydney+NSW&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=fH1Ig0pHZlpP4arC7KR7KPprVJg=" alt="Three Australian towns, different custom icons with default positioning."> <h3 name="Paths" id="Paths" data-text="Maps Static API paths" tabindex="-1">Maps Static API paths</h3> <p>The <code translate="no" dir="ltr">path</code> parameter defines a set of one or more locations connected by a path to overlay on the map image. The <code translate="no" dir="ltr">path</code> parameter takes set of value assignments (<em>path descriptors</em>) of the following format:</p> <p><code translate="no" dir="ltr">path=<em>pathStyles</em>|<em>pathLocation1</em>|<em>pathLocation2</em>|...</code> etc.</p> <p>Note that both path points are separated from each other using the pipe character (<code translate="no" dir="ltr">|</code>). Because both style information and point information is delimited via the pipe character, style information must appear first in any path descriptor. Once the Maps Static API server encounters a location in the path descriptor, all other path parameters are assumed to be locations as well.</p> <h4 id="PathStyles" data-text="Path styles" tabindex="-1">Path styles</h4> <p>The set of path style descriptors is a series of value assignments separated by the pipe (<code translate="no" dir="ltr">|</code>) character. This style descriptor defines the visual attributes to use when displaying the path. These style descriptors contain the following key/value assignments:</p> <ul> <li><code translate="no" dir="ltr"><em>weight:</em></code> (optional) specifies the thickness of the path in pixels. If no <code translate="no" dir="ltr">weight</code> parameter is set, the path will appear in its default thickness (5 pixels).</li> <li><p><code translate="no" dir="ltr"><em>color:</em></code> (optional) specifies a color either as a 24-bit (example: <code translate="no" dir="ltr">color=0xFFFFCC</code>) or 32-bit hexadecimal value (example: <code translate="no" dir="ltr">color=0xFFFFCCFF</code>), or from the set <code translate="no" dir="ltr">{black, brown, green, purple, yellow, blue, gray, orange, red, white}</code>.</p> <p>When a 32-bit hex value is specified, the last two characters specify the 8-bit alpha transparency value. This value varies between <code translate="no" dir="ltr">00</code> (completely transparent) and <code translate="no" dir="ltr">FF</code> (completely opaque). Note that transparencies are supported in paths, though they are not supported for markers.</p> </li> <li><code translate="no" dir="ltr"><em>fillcolor</em>:</code> (optional) indicates both that the path marks off a polygonal area and specifies the fill color to use as an overlay within that area. The set of locations following need not be a "closed" loop; the Maps Static API server will automatically join the first and last points. Note, however, that any stroke on the exterior of the filled area will not be closed unless you specifically provide the same beginning and end location.</li> <li><code translate="no" dir="ltr"><em>geodesic</em>:</code> (optional) indicates that the requested path should be interpreted as a geodesic line that follows the curvature of the earth. When false, the path is rendered as a straight line in screen space. Defaults to false.</li> </ul> <p>Some example path definitions:</p> <ul> <li>Thin blue line, 50% opacity: <code translate="no" dir="ltr">path=color:0x0000ff80|weight:1</code></li> <li>Solid red line: <code translate="no" dir="ltr">path=color:0xff0000ff|weight:5</code></li> <li>Solid thick white line: <code translate="no" dir="ltr">path=color:0xffffffff|weight:10</code></li> </ul> <p>These path styles are optional. If default attributes are desired, you may skip defining the path attributes; in that case, the path descriptor's first "argument" will consist instead of the first declared point (location).</p> <h4 name="PathPoints" id="PathPoints" data-text="Path points" tabindex="-1">Path points</h4> <p>In order to draw a path, the <code translate="no" dir="ltr">path</code> parameter must also be passed two or more points. The Maps Static API will then connect the path along those points, in the specified order. Each <em>pathPoint</em> is denoted in the <em>pathDescriptor</em> separated by the <code translate="no" dir="ltr">|</code> (pipe) character.</p> <p>The following example defines a blue path with default 50% opacity from Union Square NY to Times Square, NY.</p> <p> <img src="https://maps.googleapis.com/maps/api/staticmap?path=color:0x0000ff%7Cweight:5%7C40.737102,-73.990318%7C40.749825,-73.987963%7C40.752946,-73.987384%7C40.755823,-73.986397&size=512x512&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=dqk9wniS6FbfS04NAmGpPAFgPuw=" alt="Path from Union Sq to Times Sq"> </p> <p>The specifics of the <code translate="no" dir="ltr">path</code> parameter are:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> path=color:0x0000ff|weight:5|40.737102,-73.990318|40.749825,-73.987963|40.752946,-73.987384|40.755823,-73.986397 </pre> <p>The following example defines the same path instead defining a solid red line with 100% opacity:</p> <p> <img src="https://maps.googleapis.com/maps/api/staticmap?path=color:0xff0000ff%7Cweight:5%7C40.737102,-73.990318%7C40.749825,-73.987963%7C40.752946,-73.987384%7C40.755823,-73.986397&size=512x512&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=kRxqdeJSXXDa12Wo2-QkZxUw-dQ=" alt="Path from Union Sq to Times Sq"> </p> <p>The specifics of this <code translate="no" dir="ltr">path</code> parameter are:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> path=color:0xff0000ff|weight:5|40.737102,-73.990318|40.749825,-73.987963|40.752946,-73.987384|40.755823,-73.986397 </pre> <p>The next example defines a polygonal area within Manhattan, passed a series of intersections as locations:</p> <p> <img src="https://maps.googleapis.com/maps/api/staticmap?path=color:0x00000000%7Cweight:5%7Cfillcolor:0xFFFF0033%7C8th+Avenue+%26+34th+St,New+York,NY%7C8th+Avenue+%26+42nd+St,New+York,NY%7CPark+Ave+%26+42nd+St,New+York,NY,NY%7CPark+Ave+%26+34th+St,New+York,NY,NY&size=512x512&size=512x512&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=TMv2_RTu5BQmvuEXQ2H6bWS8mcY=" alt="Path from Union Sq to Times Sq"> </p> <p>The specifics of this <code translate="no" dir="ltr">path</code> parameter are:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> path=color:0x00000000|weight:5|fillcolor:0xFFFF0033|8th+Avenue+%26+34th+St,New+York,NY|\ 8th+Avenue+%26+42nd+St,New+York,NY|Park+Ave+%26+42nd+St,New+York,NY,NY|\ Park+Ave+%26+34th+St,New+York,NY,NY </pre> <p>Note that we set the path itself to be invisible and the polygonal area to have a 15% opacity.</p> <h4 id="EncodedPolylines" name="EncodedPolylines" data-text="Encoded polylines" tabindex="-1">Encoded polylines</h4> <p>Instead of a series of locations, you may instead declare a path as an <a href="/maps/documentation/utilities/polylinealgorithm">encoded polyline</a> by using the <code translate="no" dir="ltr">enc:</code> prefix within the location declaration of the <code translate="no" dir="ltr">path</code>. <p>The following example outlines the course of the Alaska Highway from Dawson Creek, BC to Delta Junction, AK with an encoded polyline:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> https://maps.googleapis.com/maps/api/staticmap ?size=400x400&center=59.900503,-135.478011&zoom=4 &path=weight:3%7Ccolor:orange%7Cenc:_fisIp~u%7CU%7D%7Ca@pytA_~b@hhCyhS~hResU%7C%7Cx@oig@rwg@amUfbjA%7Df%5BroaAynd@%7CvXxiAt%7BZwdUfbjAewYrqGchH~vXkqnAria@c_o@inc@k%7Bg@i%60%5Do%7CF%7DvXaj%5Ch%60%5Dovs@?yi_@rcAgtO%7Cj_AyaJren@nzQrst@zuYh%60%5Dv%7CGbldEuzd@%7C%7Cx@spD%7CtrAzwP%7Cd_@yiB~vXmlWhdPez%5C_%7BKm_%60@~re@ew%5ErcAeu_@zhyByjPrst@ttGren@aeNhoFemKrvdAuvVidPwbVr~j@or@f_z@ftHr%7BZlwBrvdAmtHrmT%7BrOt%7BZz%7DE%7Cc%7C@o%7CLpn~AgfRpxqBfoVz_iAocAhrVjr@rh~@jzKhjp@%60%60NrfQpcHrb%5Ek%7CDh_z@nwB%7Ckb@a%7BR%7Cyh@uyZ%7CllByuZpzw@wbd@rh~@%7C%7CFhqs@teTztrAupHhyY%7Dt%5Dhuf@e%7CFria@o%7DGfezAkdW%7C%7D%5BocMt_Neq@ren@e~Ika@pgE%7Ci%7CAfiQ%7C%60l@uoJrvdAgq@fppAsjGhg%60@%7ChQpg%7BAi_V%7C%7Cx@mkHhyYsdP%7CxeA~gF%7C%7D%5Bmv%60@t_NitSfjp@c%7DMhg%60@sbChyYq%7De@rwg@atFff%7D@ghN~zKybk@fl%7DA%7DcPftcAite@tmT__Lha@u~DrfQi%7DMhkSqyWivIumCria@ciO_tHifm@fl%7DA%7Brc@fbjAqvg@rrqAcjCf%7Ci@mqJtb%5Es%7C@fbjA%7BwDfs%60BmvEfqs@umWt_Nwn%5Epen@qiBr%60xAcvMr%7BZidg@dtjDkbM%7Cd_@ &key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> </pre> <p> <img src="https://maps.googleapis.com/maps/api/staticmap?size=400x400&center=59.900503,-135.478011&zoom=4&path=weight:3%7Ccolor:orange%7Cenc:_fisIp~u%7CU%7D%7Ca@pytA_~b@hhCyhS~hResU%7C%7Cx@oig@rwg@amUfbjA%7Df%5BroaAynd@%7CvXxiAt%7BZwdUfbjAewYrqGchH~vXkqnAria@c_o@inc@k%7Bg@i%60%5Do%7CF%7DvXaj%5Ch%60%5Dovs@?yi_@rcAgtO%7Cj_AyaJren@nzQrst@zuYh%60%5Dv%7CGbldEuzd@%7C%7Cx@spD%7CtrAzwP%7Cd_@yiB~vXmlWhdPez%5C_%7BKm_%60@~re@ew%5ErcAeu_@zhyByjPrst@ttGren@aeNhoFemKrvdAuvVidPwbVr~j@or@f_z@ftHr%7BZlwBrvdAmtHrmT%7BrOt%7BZz%7DE%7Cc%7C@o%7CLpn~AgfRpxqBfoVz_iAocAhrVjr@rh~@jzKhjp@%60%60NrfQpcHrb%5Ek%7CDh_z@nwB%7Ckb@a%7BR%7Cyh@uyZ%7CllByuZpzw@wbd@rh~@%7C%7CFhqs@teTztrAupHhyY%7Dt%5Dhuf@e%7CFria@o%7DGfezAkdW%7C%7D%5BocMt_Neq@ren@e~Ika@pgE%7Ci%7CAfiQ%7C%60l@uoJrvdAgq@fppAsjGhg%60@%7ChQpg%7BAi_V%7C%7Cx@mkHhyYsdP%7CxeA~gF%7C%7D%5Bmv%60@t_NitSfjp@c%7DMhg%60@sbChyYq%7De@rwg@atFff%7D@ghN~zKybk@fl%7DA%7DcPftcAite@tmT__Lha@u~DrfQi%7DMhkSqyWivIumCria@ciO_tHifm@fl%7DA%7Brc@fbjAqvg@rrqAcjCf%7Ci@mqJtb%5Es%7C@fbjA%7BwDfs%60BmvEfqs@umWt_Nwn%5Epen@qiBr%60xAcvMr%7BZidg@dtjDkbM%7Cd_@&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=OuDXfsdEX8rampeA5uy7_d5BPTY=" alt="Alaska Highway"> </p> <p>As with standard paths, encoded polyline paths may also demarcate polygonal areas if a <code translate="no" dir="ltr">fillcolor</code> argument is passed to the <code translate="no" dir="ltr">path</code> parameter.</p> <p>The following example outlines a polygonal area for Brooklyn, NY:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> https://maps.googleapis.com/maps/api/staticmap ?size=400x400&center=40.653279,-73.959816&zoom=11 &path=fillcolor:0xAA000033%7Ccolor:0xFFFFFF00%7Cenc:%7DzswFtikbMjJzZ%7CRdPfZ%7DDxWvBjWpF~IvJnEvBrMvIvUpGtQpFhOQdKpz%40bIx%7BA%7CPfYlvApz%40bl%40tcAdTpGpVwQtX%7Di%40%7CGen%40lCeAda%40bjA%60q%40v%7D%40rfAbjA%7CEwBpbAd_%40he%40hDbu%40uIzWcWtZoTdImTdIwu%40tDaOXw_%40fc%40st%40~VgQ%7C%5BuPzNtA%60LlEvHiYyLs%5EnPhCpG%7DSzCNwHpz%40cEvXg%40bWdG%60%5DlL~MdTmEnCwJ%5BiJhOae%40nCm%5B%60Aq%5DqE_pAaNiyBuDurAuB%7D%7DAy%60%40%7CEKv_%40%3F%7C%5BqGji%40lAhYyH%60%40Xiw%40tBerAs%40q%5DjHohAYkSmW%3FaNoaAbR%7DLnPqNtMtIbRyRuDef%40eT_z%40mW_Nm%7CB~j%40zC~hAyUyJ_U%7BZ%3F%3FcPvg%40%7Ds%40sHsc%40_z%40cj%40kp%40YePoNyYyb%40_iAyb%40gBw%5EbOokArcA%7DGwJuzBre%40i%5Ctf%40sZnd%40oElb%40hStW%7B%5Dvv%40%3F%3Fkz%40~vAcj%40zKa%60Atf%40uQj_Aee%40pU_UrcA &key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> </pre> <p> <img src="https://maps.googleapis.com/maps/api/staticmap?size=400x400&center=40.653279,-73.959816&zoom=11&path=fillcolor%3A0xAA000033%7Ccolor%3A0xFFFFFF00%7Cenc%3A%7DzswFtikbMjJzZ%7CRdPfZ%7DDxWvBjWpF~IvJnEvBrMvIvUpGtQpFhOQdKpz%40bIx%7BA%7CPfYlvApz%40bl%40tcAdTpGpVwQtX%7Di%40%7CGen%40lCeAda%40bjA%60q%40v%7D%40rfAbjA%7CEwBpbAd_%40he%40hDbu%40uIzWcWtZoTdImTdIwu%40tDaOXw_%40fc%40st%40~VgQ%7C%5BuPzNtA%60LlEvHiYyLs%5EnPhCpG%7DSzCNwHpz%40cEvXg%40bWdG%60%5DlL~MdTmEnCwJ%5BiJhOae%40nCm%5B%60Aq%5DqE_pAaNiyBuDurAuB%7D%7DAy%60%40%7CEKv_%40%3F%7C%5BqGji%40lAhYyH%60%40Xiw%40tBerAs%40q%5DjHohAYkSmW%3FaNoaAbR%7DLnPqNtMtIbRyRuDef%40eT_z%40mW_Nm%7CB~j%40zC~hAyUyJ_U%7BZ%3F%3FcPvg%40%7Ds%40sHsc%40_z%40cj%40kp%40YePoNyYyb%40_iAyb%40gBw%5EbOokArcA%7DGwJuzBre%40i%5Ctf%40sZnd%40oElb%40hStW%7B%5Dvv%40%3F%3Fkz%40~vAcj%40zKa%60Atf%40uQj_Aee%40pU_UrcA&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=BmZb81FDzVCcP83Hn4va4suDNpE=" alt="Brooklyn Encoded Polyline with signature"> </p> <h3 id="Viewports" name="Viewports" data-text="Viewports" tabindex="-1">Viewports</h3> <p>Images may specify a <em>viewport</em> by specifying visible locations using the <code translate="no" dir="ltr">visible</code> parameter. The <code translate="no" dir="ltr">visible</code> parameter instructs the Maps Static API service to construct a map such that the existing locations remain visible. (This parameter may be combined with existing markers or paths to define a visible region as well.) Defining a viewport in this manner obviates the need to specify an exact zoom level.</p> <p>The next example requests a map centered on Boston, MA containing both MIT and Harvard Square in Cambridge, MA:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> https://maps.googleapis.com/maps/api/staticmap?center=Boston,MA &visible=77+Massachusetts+Ave,Cambridge,MA%7CHarvard+Square,Cambridge,MA&size=512x512&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> </pre> <p><img border="0" src="https://maps.googleapis.com/maps/api/staticmap?center=Boston,MA&visible=77+Massachusetts+Ave,Cambridge,MA%7CHarvard+Square,Cambridge,MA&size=512x512&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=DGcyLpBKSulji0ECrLupzcDMcvU=" alt="Cambridge Map"></p> <h3 name="ImplicitPositioning" id="ImplicitPositioning" data-text="Implicit positioning of the map" tabindex="-1">Implicit positioning of the map</h3> <p>Normally, you need to specify <code translate="no" dir="ltr">center</code> and <code translate="no" dir="ltr">zoom</code> URL parameters to define the location and zoom level of your generated map. However, if you supply <code translate="no" dir="ltr">markers</code>, <code translate="no" dir="ltr">path</code>, or <code translate="no" dir="ltr">visible</code> parameters, you can instead let the Maps Static API determine the correct center and zoom level implicitly, based on evaluation of the position of these elements.</p> <p>If supplying two or more elements, the Maps Static API will determine a proper center and zoom level, providing generous margins for the elements contained. This example displays a map containing San Francisco, Oakland, and San Jose, CA:</p> <pre class="prettyprint lang-sh" translate="no" dir="ltr"> https://maps.googleapis.com/maps/api/staticmap?size=512x512&maptype=roadmap\ &markers=size:mid%7Ccolor:red%7CSan+Francisco,CA%7COakland,CA%7CSan+Jose,CA&key=<span data-devsite-credential-type="api_key" class="replaceable-credential">YOUR_API_KEY</span>&signature=<var translate="no">YOUR_SIGNATURE</var> </pre> <p><img border="0" src="https://maps.googleapis.com/maps/api/staticmap?size=512x512&maptype=roadmap&markers=size:mid%7Ccolor:red%7CSan+Francisco,CA%7COakland,CA%7CSan+Jose,CA&key=AIzaSyA3kg7YWugGl1lTXmAmaBGPNhDW9pEh5bo&signature=ZNdYl6ts4u-GTqI5nbRlS5AKR1Y=" alt="Road Map"></p> <h2 name="Largerimagesizes" id="Largerimagesizes" data-text="Larger image sizes" tabindex="-1">Larger image sizes</h2> <p>If you need images with sizes larger than 640 x 640 pixels (or 1280 x 1280 pixels with a scale value of 2), please <a href="/maps/documentation/maps-static/support#contact-maps-support"> contact the support team</a> and provide the following information:</p> <ol> <li>Your use case and why you need large size images.</li> <li>Whether you considered using other Google Maps Platform APIs (Maps JavaScript API, Maps Embed API, Maps SDK for Android, or Maps SDK for iOS) and why don't they meet your needs.</li> <li>Screenshots, mocks, or samples of how you will use large size images.</li> <li>Your estimated monthly usage for large size images.</li> </ol> <p>We will review your request based on the information you provide and determine if your use case complies with <a href="https://cloud.google.com/maps-platform/terms/" class="external">Google Maps Platform Terms of Service</a>.</p> <p>The maximum size we can provide is 2048 x 2048 pixels.</p> <h2 name="Moreinfo" id="Moreinfo" data-text="Troubleshooting and support" tabindex="-1">Troubleshooting and support</h2> <p>For more information on using the Maps Static API, take a look at the <a href="/maps/documentation/maps-static/support">support page</a>.</p> <p>The Maps Static API may issue an error or warning when something goes wrong. You should check for warnings in particular if you notice that something is missing from the map. It's also a good idea to check for warnings before launching a new application. Note that the warnings may not be immediately apparent because they appear in the HTTP header. For more information, see the guide to <a href="/maps/documentation/maps-static/error-messages">errors and warnings</a>.</p> </div> <devsite-recommendations display="in-page" hidden yield> </devsite-recommendations> <devsite-thumb-rating position="footer"> </devsite-thumb-rating> <devsite-feedback position="footer" project-name="Maps Static API" product-id="81777" bucket="" context="Static Maps API" version="t-devsite-webserver-20241114-r00-rc02.464922260396498922" data-label="Send Feedback Button" track-type="feedback" track-name="sendFeedbackLink" track-metadata-position="footer" class="nocontent" project-icon="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers/images/touchicon-180-new.png" project-support-url="https://developers.google.com/maps/documentation/maps-static/support" > <button> Send feedback </button> </devsite-feedback> <devsite-recommendations id="recommendations-link" yield></devsite-recommendations> <div class="devsite-floating-action-buttons"> </div> </article> <devsite-content-footer class="nocontent"> <p>Except as otherwise noted, the content of this page is licensed under the <a href="https://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 License</a>, and code samples are licensed under the <a href="https://www.apache.org/licenses/LICENSE-2.0">Apache 2.0 License</a>. For details, see the <a href="https://developers.google.com/site-policies">Google Developers Site Policies</a>. Java is a registered trademark of Oracle and/or its affiliates.</p> <p>Last updated 2024-11-26 UTC.</p> </devsite-content-footer> <devsite-notification > </devsite-notification> <div class="devsite-content-data"> <template class="devsite-thumb-rating-feedback"> <devsite-feedback position="thumb-rating" project-name="Maps Static API" product-id="81777" bucket="" context="Static Maps API" version="t-devsite-webserver-20241114-r00-rc02.464922260396498922" data-label="Send Feedback Button" track-type="feedback" track-name="sendFeedbackLink" track-metadata-position="thumb-rating" class="nocontent" project-icon="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers/images/touchicon-180-new.png" project-support-url="https://developers.google.com/maps/documentation/maps-static/support" > <button> Need to tell us more? </button> </devsite-feedback> </template> <template class="devsite-content-data-template"> [[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2024-11-26 UTC."],[],[]] </template> </div> </devsite-content> </main> <devsite-footer-promos class="devsite-footer"> <nav class="devsite-footer-promos nocontent" aria-label="Promotions"> <ul class="devsite-footer-promos-list"> <li class="devsite-footer-promo"> <a href="/maps/support#stackoverflow" class="devsite-footer-promo-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Promo Link (index 1)" > <picture> <img class="devsite-footer-promo-icon" src="/static/site-assets/logo-stack-overflow.svg" loading="lazy" alt="Stack Overflow"> </picture> <span class="devsite-footer-promo-label"> Stack Overflow </span> </a> <div class="devsite-footer-promo-description">Ask a question under the google-maps tag.</div> </li> <li class="devsite-footer-promo"> <a href="https://github.com/googlemaps/" class="devsite-footer-promo-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Promo Link (index 2)" > <picture> <img class="devsite-footer-promo-icon" src="/static/site-assets/logo-github.svg" loading="lazy" alt="GitHub"> </picture> <span class="devsite-footer-promo-label"> GitHub </span> </a> <div class="devsite-footer-promo-description">Fork our samples and try them yourself.</div> </li> <li class="devsite-footer-promo"> <a href="https://discord.gg/f4hvx8Rp2q" class="devsite-footer-promo-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Promo Link (index 3)" > <picture> <img class="devsite-footer-promo-icon" src="/static/maps/images/discord-color.png" loading="lazy" alt="Discord"> </picture> <span class="devsite-footer-promo-label"> Discord </span> </a> <div class="devsite-footer-promo-description">Chat with fellow developers about Google Maps Platform.</div> </li> <li class="devsite-footer-promo"> <a href="/maps/support#issue_tracker" class="devsite-footer-promo-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Promo Link (index 4)" > <picture> <img class="devsite-footer-promo-icon" src="/static/site-assets/developers_64dp.png" loading="lazy" alt="Issue Tracker"> </picture> <span class="devsite-footer-promo-label"> Issue Tracker </span> </a> <div class="devsite-footer-promo-description">Something wrong? Send us a bug report!</div> </li> </ul> </nav> </devsite-footer-promos> <devsite-footer-linkboxes class="devsite-footer"> <nav class="devsite-footer-linkboxes nocontent" aria-label="Footer links"> <ul class="devsite-footer-linkboxes-list"> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Learn More</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="/maps/faq" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > FAQ </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/maps/documentation/api-picker" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > API Picker </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/maps/api-security-best-practices" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)" > API security best practices </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/maps/optimize-web-services" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 4)" > Optimizing Web Service Usage </a> </li> </ul> </li> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Platforms</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="/maps/android" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > Android </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/maps/ios" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > iOS </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/maps/web" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)" > Web </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/maps/web-services" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 4)" > Web Services </a> </li> </ul> </li> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Product Info</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="/maps/pricing-and-plans" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-action="linkClick"data-label="footerMenu"data-category="pricingAndPlans"> Pricing and Plans </a> </li> <li class="devsite-footer-linkbox-item"> <a href="https://cloud.google.com/contact-maps" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="footerMenu"data-action="linkClick"data-category="contactSales"> Contact Sales </a> </li> <li class="devsite-footer-linkbox-item"> <a href="https://developers.google.com/maps/support/" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)" > Support </a> </li> <li class="devsite-footer-linkbox-item"> <a href="https://cloud.google.com/maps-platform/terms" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 4)" > Terms of Service </a> </li> </ul> </li> </ul> </nav> </devsite-footer-linkboxes> <devsite-footer-utility class="devsite-footer"> <div class="devsite-footer-utility nocontent"> <nav class="devsite-footer-sites" aria-label="Other Google Developers websites"> <a href="https://developers.google.com/" class="devsite-footer-sites-logo-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Google Developers Link"> <picture> <img class="devsite-footer-sites-logo" src="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers/images/lockup-google-for-developers.svg" loading="lazy" alt="Google Developers"> </picture> </a> <ul class="devsite-footer-sites-list"> <li class="devsite-footer-sites-item"> <a href="//developer.android.com" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Android Link" > Android </a> </li> <li class="devsite-footer-sites-item"> <a href="//developer.chrome.com/home" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Chrome Link" > Chrome </a> </li> <li class="devsite-footer-sites-item"> <a href="//firebase.google.com" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Firebase Link" > Firebase </a> </li> <li class="devsite-footer-sites-item"> <a href="//cloud.google.com" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Google Cloud Platform Link" > Google Cloud Platform </a> </li> <li class="devsite-footer-sites-item"> <a href="//ai.google.dev/" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Google AI Link" > Google AI </a> </li> <li class="devsite-footer-sites-item"> <a href="/products" class="devsite-footer-sites-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer All products Link" > All products </a> </li> </ul> </nav> <nav class="devsite-footer-utility-links" aria-label="Utility links"> <ul class="devsite-footer-utility-list"> <li class="devsite-footer-utility-item "> <a class="devsite-footer-utility-link gc-analytics-event" href="/terms/site-terms" data-category="Site-Wide Custom Events" data-label="Footer Terms link" > Terms </a> </li> <li class="devsite-footer-utility-item "> <a class="devsite-footer-utility-link gc-analytics-event" href="//policies.google.com/privacy" data-category="Site-Wide Custom Events" data-label="Footer Privacy link" > Privacy </a> </li> <li class="devsite-footer-utility-item glue-cookie-notification-bar-control"> <a class="devsite-footer-utility-link gc-analytics-event" href="#" data-category="Site-Wide Custom Events" data-label="Footer Manage cookies link" aria-hidden="true" > Manage cookies </a> </li> <li class="devsite-footer-utility-item devsite-footer-utility-button"> <span class="devsite-footer-utility-description">Sign up for the Google for Developers newsletter</span> <a class="devsite-footer-utility-link gc-analytics-event" href="/newsletter/subscribe" data-category="Site-Wide Custom Events" data-label="Footer Subscribe link" > Subscribe </a> </li> </ul> <devsite-language-selector> <ul role="presentation"> <li role="presentation"> <a role="menuitem" lang="en" >English</a> </li> <li role="presentation"> <a role="menuitem" lang="de" >Deutsch</a> </li> <li role="presentation"> <a role="menuitem" lang="es" >Español</a> </li> <li role="presentation"> <a role="menuitem" lang="es_419" >Español – América Latina</a> </li> <li role="presentation"> <a role="menuitem" lang="fr" >Français</a> </li> <li role="presentation"> <a role="menuitem" lang="id" >Indonesia</a> </li> <li role="presentation"> <a role="menuitem" lang="it" >Italiano</a> </li> <li role="presentation"> <a role="menuitem" lang="pl" >Polski</a> </li> <li role="presentation"> <a role="menuitem" lang="pt_br" >Português – Brasil</a> </li> <li role="presentation"> <a role="menuitem" lang="vi" >Tiếng Việt</a> </li> <li role="presentation"> <a role="menuitem" lang="tr" >Türkçe</a> </li> <li role="presentation"> <a role="menuitem" lang="ru" >Русский</a> </li> <li role="presentation"> <a role="menuitem" lang="he" >עברית</a> </li> <li role="presentation"> <a role="menuitem" lang="ar" >العربيّة</a> </li> <li role="presentation"> <a role="menuitem" lang="fa" >فارسی</a> </li> <li role="presentation"> <a role="menuitem" lang="hi" >हिंदी</a> </li> <li role="presentation"> <a role="menuitem" lang="bn" >বাংলা</a> </li> <li role="presentation"> <a role="menuitem" lang="th" >ภาษาไทย</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_cn" >中文 – 简体</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_tw" >中文 – 繁體</a> </li> <li role="presentation"> <a role="menuitem" lang="ja" >日本語</a> </li> <li role="presentation"> <a role="menuitem" lang="ko" >한국어</a> </li> </ul> </devsite-language-selector> </nav> </div> </devsite-footer-utility> <devsite-panel></devsite-panel> <devsite-concierge data-info-panel data-ai-panel data-api-explorer-panel > </devsite-concierge> </section></section> <devsite-sitemask></devsite-sitemask> <devsite-snackbar></devsite-snackbar> <devsite-tooltip ></devsite-tooltip> <devsite-heading-link></devsite-heading-link> <devsite-analytics> <script type="application/json" analytics>[{"dimensions": {"dimension3": false, "dimension4": "Maps Static API", "dimension1": "Signed out", "dimension5": "en", "dimension6": "en", "dimension11": false}, "gaid": "UA-24532603-1", "metrics": {"ratings_value": "metric1", "ratings_count": "metric2"}, "purpose": 1}]</script> <script type="application/json" tag-management>{"at": "True", "ga4": [{"id": "G-272J68FCRF", "purpose": 1}], "ga4p": [{"id": "G-272J68FCRF", "purpose": 1}], "gtm": [{"id": "GTM-W2H69MN", "purpose": 0}], "parameters": {"internalUser": "False", "language": {"machineTranslated": "False", "requested": "en", "served": "en"}, "pageType": "article", "projectName": "Maps Static API", "signedIn": "False", "tenant": "developers", "recommendations": {"sourcePage": "", "sourceType": 0, "sourceRank": 0, "sourceIdenticalDescriptions": 0, "sourceTitleWords": 0, "sourceDescriptionWords": 0, "experiment": ""}, "experiment": {"ids": ""}}}</script> </devsite-analytics> <devsite-badger></devsite-badger> <script nonce="jQnK4ILcXkGF8vkEMMzuDrNX8+lOTQ"> (function(d,e,v,s,i,t,E){d['GoogleDevelopersObject']=i; t=e.createElement(v);t.async=1;t.src=s;E=e.getElementsByTagName(v)[0]; E.parentNode.insertBefore(t,E);})(window, document, 'script', 'https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers/js/app_loader.js', '[1,"en",null,"/js/devsite_app_module.js","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers","https://developers-dot-devsite-v2-prod.appspot.com",null,null,["/_pwa/developers/manifest.json","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/images/video-placeholder.svg","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/developers/images/favicon-new.png","https://fonts.googleapis.com/css?family=Google+Sans:400,500|Roboto:400,400italic,500,500italic,700,700italic|Roboto+Mono:400,500,700&display=swap"],1,null,[1,6,8,12,14,17,21,25,50,52,63,70,75,76,80,87,91,92,93,97,98,100,101,102,103,104,105,107,108,109,110,112,113,116,117,118,120,122,124,125,126,127,129,130,131,132,133,134,135,136,138,140,141,147,148,149,151,152,156,157,158,159,161,163,164,168,169,170,179,180,182,183,186,191,193,196],"AIzaSyAP-jjEJBzmIyKR4F-3XITp8yM9T1gEEI8","AIzaSyB6xiKGDR5O3Ak2okS4rLkauxGUG7XP0hg","developers.google.com","AIzaSyAQk0fBONSGUqCNznf6Krs82Ap1-NV6J4o","AIzaSyCCxcqdrZ_7QMeLCRY20bh_SXdAYqy70KY",null,null,null,["Cloud__enable_cloud_dlp_service","Profiles__enable_release_notes_notifications","Cloud__enable_llm_concierge_chat","Profiles__enable_profile_collections","Analytics__enable_clearcut_logging","BookNav__enable_tenant_cache_key","MiscFeatureFlags__developers_footer_image","Profiles__enable_dashboard_curated_recommendations","MiscFeatureFlags__enable_variable_operator","CloudShell__cloud_shell_button","Profiles__enable_complete_playlist_endpoint","Profiles__enable_awarding_url","Profiles__enable_page_saving","TpcFeatures__enable_mirror_tenant_redirects","Search__enable_ai_search_summaries_restricted","CloudShell__cloud_code_overflow_menu","Cloud__enable_legacy_calculator_redirect","Search__enable_dynamic_content_confidential_banner","MiscFeatureFlags__developers_footer_dark_image","Cloud__enable_cloud_shell_fte_user_flow","MiscFeatureFlags__enable_firebase_utm","Profiles__enable_developer_profiles_callout","EngEduTelemetry__enable_engedu_telemetry","Profiles__enable_completecodelab_endpoint","Search__enable_ai_eligibility_checks","Cloud__enable_free_trial_server_call","Concierge__enable_concierge","Cloud__enable_cloud_shell","Profiles__enable_recognition_badges","Experiments__reqs_query_experiments","Cloud__enable_cloudx_ping","DevPro__enable_cloud_innovators_plus","Significatio__enable_by_tenant","TpcFeatures__enable_required_headers","MiscFeatureFlags__enable_project_variables","MiscFeatureFlags__emergency_css","Concierge__enable_concierge_restricted","Search__enable_ai_search_summaries","Search__enable_page_map","Profiles__enable_public_developer_profiles","DevPro__enable_developer_subscriptions","Cloud__enable_cloudx_experiment_ids","Search__enable_suggestions_from_borg","Concierge__enable_pushui","MiscFeatureFlags__enable_view_transitions","Profiles__require_profile_eligibility_for_signin","MiscFeatureFlags__enable_explain_this_code","Cloud__enable_cloud_facet_chat"],null,null,"AIzaSyBLEMok-5suZ67qRPzx0qUtbnLmyT_kCVE","https://developerscontentserving-pa.clients6.google.com","AIzaSyCM4QpTRSqP5qI4Dvjt4OAScIN8sOUlO-k","https://developerscontentsearch-pa.clients6.google.com",1,4,null,"https://developerprofiles-pa.clients6.google.com",[1,"developers","Google for Developers","developers.google.com",null,"developers-dot-devsite-v2-prod.appspot.com",null,null,[1,1,[1],null,null,null,null,null,null,null,null,[1],null,null,null,null,null,null,[1],[1,null,null,[1,20],"/recommendations/information"],null,null,null,[1,1,1],[1,1,null,1,1]],null,[null,null,null,null,null,null,"/images/lockup-new.svg","/images/touchicon-180-new.png",null,null,null,null,1,null,null,null,null,null,null,null,null,1,null,null,null,"/images/lockup-dark-theme-new.svg",[]],[],null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,[6,1,14,15,20,22,23,29,32,36],null,[[null,null,null,[3,7,10,2,39,17,4,32,24,11,12,13,34,15,25],null,null,[1,[["docType","Choose a content type",[["Tutorial",null,null,null,null,null,null,null,null,"Tutorial"],["Guide",null,null,null,null,null,null,null,null,"Guide"],["Sample",null,null,null,null,null,null,null,null,"Sample"]]],["product","Choose a product",[["Android",null,null,null,null,null,null,null,null,"Android"],["ARCore",null,null,null,null,null,null,null,null,"ARCore"],["ChromeOS",null,null,null,null,null,null,null,null,"ChromeOS"],["Firebase",null,null,null,null,null,null,null,null,"Firebase"],["Flutter",null,null,null,null,null,null,null,null,"Flutter"],["Assistant",null,null,null,null,null,null,null,null,"Google Assistant"],["GoogleCloud",null,null,null,null,null,null,null,null,"Google Cloud"],["GoogleMapsPlatform",null,null,null,null,null,null,null,null,"Google Maps Platform"],["GooglePay",null,null,null,null,null,null,null,null,"Google Pay & Google Wallet"],["GooglePlay",null,null,null,null,null,null,null,null,"Google Play"],["Tensorflow",null,null,null,null,null,null,null,null,"TensorFlow"]]],["category","Choose a topic",[["AiAndMachineLearning",null,null,null,null,null,null,null,null,"AI and Machine Learning"],["Data",null,null,null,null,null,null,null,null,"Data"],["Enterprise",null,null,null,null,null,null,null,null,"Enterprise"],["Gaming",null,null,null,null,null,null,null,null,"Gaming"],["Mobile",null,null,null,null,null,null,null,null,"Mobile"],["Web",null,null,null,null,null,null,null,null,"Web"]]]]]],[1,1],null,1],[[["UA-24532603-1"],["UA-22084204-5"],null,null,["UA-24532603-5"],null,null,[["G-272J68FCRF"],null,null,[["G-272J68FCRF",2]]],[["UA-24532603-1",2]],null,[["UA-24532603-5",2]],null,1],[[6,5],[1,1],[4,3],[14,11],[5,4],[12,9],[15,12],[3,2],[13,10],[16,13],[11,8]],[[2,2],[1,1]]],null,4,null,null,null,null,null,null,null,null,null,null,null,null,null,"developers.devsite.google"],null,"pk_live_5170syrHvgGVmSx9sBrnWtA5luvk9BwnVcvIi7HizpwauFG96WedXsuXh790rtij9AmGllqPtMLfhe2RSwD6Pn38V00uBCydV4m"]') </script> <devsite-a11y-announce></devsite-a11y-announce> </body> </html>

CINXE.COM

Get Started | Maps Static API | Google for Developers