Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. Best Way to Access Google Maps API on QML

Best Way to Access Google Maps API on QML

Scheduled Pinned Locked Moved General and Desktop
3 Posts 3 Posters 1.8k Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • carles.sole.grauC Offline
    carles.sole.grauC Offline
    carles.sole.grau
    wrote on last edited by
    #1

    Hi everyone,
    I'm trying to display a Map using the Google Maps API (GOOGLE MAPS API).
    There I see that the Javascript API using HTML is quite easy.

    With this simple HTML file you could get the Google Maps Map:

    <!DOCTYPE html>
    <html>
      <head>
        <title>Simple Map</title>
        <meta name="viewport" content="initial-scale=1.0">
        <meta charset="utf-8">
        <style>
          html, body {
            height: 100%;
            margin: 0;
            padding: 0;
          }
          #map {
            height: 100%;
          }
        </style>
      </head>
      <body>
        <div id="map"></div>
        <script>
    
    var map;
    function initMap() {
      map = new google.maps.Map(document.getElementById('map'), {
        center: {lat: -34.397, lng: 150.644},
        zoom: 8
      });
    }
    
        </script>
        <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"
            async defer></script>
      </body>
    </html>
    

    So, if I want to use this API in QML, which is the best way?
    Using a WebView to load this HTML file?
    Is there a more native way to get that?

    Thank you very much!

    kshegunovK 1 Reply Last reply
    0
    • carles.sole.grauC carles.sole.grau

      Hi everyone,
      I'm trying to display a Map using the Google Maps API (GOOGLE MAPS API).
      There I see that the Javascript API using HTML is quite easy.

      With this simple HTML file you could get the Google Maps Map:

      <!DOCTYPE html>
      <html>
        <head>
          <title>Simple Map</title>
          <meta name="viewport" content="initial-scale=1.0">
          <meta charset="utf-8">
          <style>
            html, body {
              height: 100%;
              margin: 0;
              padding: 0;
            }
            #map {
              height: 100%;
            }
          </style>
        </head>
        <body>
          <div id="map"></div>
          <script>
      
      var map;
      function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: -34.397, lng: 150.644},
          zoom: 8
        });
      }
      
          </script>
          <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"
              async defer></script>
        </body>
      </html>
      

      So, if I want to use this API in QML, which is the best way?
      Using a WebView to load this HTML file?
      Is there a more native way to get that?

      Thank you very much!

      kshegunovK Offline
      kshegunovK Offline
      kshegunov
      Moderators
      wrote on last edited by
      #2

      There's a contributed plugin (somewhere in the Showcase forum) that implements a plugin for the QtLocation module.

      Read and abide by the Qt Code of Conduct

      1 Reply Last reply
      0
      • L Offline
        L Offline
        ldanzinger
        wrote on last edited by
        #3

        Is there a reason you want to specifically use Google Maps? There are a multitude of providers already with Qt Location, including Esri, Here, and Mapbox. In addition, Esri provides a full mapping/location SDK that goes far beyond Qt Location capabilities - https://developers.arcgis.com/qt/

        1 Reply Last reply
        0

        • Login

        • Login or register to search.
        • First post
          Last post
        0
        • Categories
        • Recent
        • Tags
        • Popular
        • Users
        • Groups
        • Search
        • Get Qt Extensions
        • Unsolved