Google for Developers

Before using this code on your site, you need to finish account setup to get an API key. Otherwise the code won't run in your environment.

Get new API key

Set up account in 2 mins at no charge

<body>
<gmp-place-details size="large">
</gmp-place-details>

<script>
  (g => {var h, a, k, p = "The Google Maps JavaScript API", c = "google", l = "importLibrary", q = "__ib__", m = document, b = window; b = b[c] || (b[c] = {}); var d = b.maps || (b.maps = {}), r = new Set, e = new URLSearchParams, u = () => h || (h = new Promise(async (f, n) => {await (a = m.createElement("script")); e.set("libraries", [...r] + ""); for (k in g) e.set(k.replace(/[A-Z]/g, t => "_" + t[0].toLowerCase()), g[k]); e.set("callback", c + ".maps." + q); a.src = `https://maps.${c}apis.com/maps/api/js?` + e; d[q] = f; a.onerror = () => h = n(Error(p + " could not load.")); a.nonce = m.querySelector("script[nonce]")?.nonce || ""; m.head.append(a)})); d[l] ? console.warn(p + " only loads once. Ignoring:", g) : d[l] = (f, ...n) => r.add(f) && u().then(() => d[l](f, ...n))})({
    key: "AIzaSyB41DRUbKWJHPxaFjMAwdrzWzbVKartNGg",
    v: "alpha",
    // Use the 'v' parameter to indicate the version to use (weekly, beta, alpha, etc.).
    // Add other bootstrap parameters as needed, using camel case.
  });
</script>
</body>

<html>

<head>
  <meta charset='UTF-8' />
  <style>
    gmp-place-details {
      width: 400px;
    }
  </style>
</head>

<body>
  <gmp-place-details size="large"></gmp-place-details>

<script>
    (g => {var h, a, k, p = "The Google Maps JavaScript API", c = "google", l = "importLibrary", q = "__ib__", m = document, b = window; b = b[c] || (b[c] = {}); var d = b.maps || (b.maps = {}), r = new Set, e = new URLSearchParams, u = () => h || (h = new Promise(async (f, n) => {await (a = m.createElement("script")); e.set("libraries", [...r] + ""); for (k in g) e.set(k.replace(/[A-Z]/g, t => "_" + t[0].toLowerCase()), g[k]); e.set("callback", c + ".maps." + q); a.src = `https://maps.${c}apis.com/maps/api/js?` + e; d[q] = f; a.onerror = () => h = n(Error(p + " could not load.")); a.nonce = m.querySelector("script[nonce]")?.nonce || ""; m.head.append(a)})); d[l] ? console.warn(p + " only loads once. Ignoring:", g) : d[l] = (f, ...n) => r.add(f) && u().then(() => d[l](f, ...n))})({
      key: "YOUR_API_KEY",
      v: "alpha"
    });

async function init() {
      await google.maps.importLibrary("places");
      document.querySelector("gmp-place-details").configureFromPlace({id: "ChIJMZm5fjtD1moR8ZSw6UUU0SQ"});
    }
    init();
  </script>
</body>

</html>