Languages

Menu
Sites
Language
Showing google maps on wearable

I'm writing a Web application targetting a Gear S3 (running Tizen 2.3.2.3), and I'm wondering if it is possible to use google map APIs to show a map in the app.
Any experience to shared, good or bad ?

Thanks

Pascal

 

View Selected Answer

Responses

5 Replies
Mark as answer
Pascal Rapicault

For the record, here is the simplest code that can display a google map on tizen wearable.
This is the code as provided by google in their sample, don't forget to get an API key to access google map.

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <title>Simple Map</title>
    <meta charset="utf-8">
    <style>
      /* Always set the map height explicitly to define the size of the div
       * element that contains the map. */
      #map {
        height: 100%;
      }
      /* Optional: Makes the sample page fill the window. */
       html, body {
         height: 100%;
         margin: 0;
         padding: 0;
       }
    </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="http://maps.googleapis.com/maps/api/js?key=<GoogleAPIKey>&callback=initMap"></script>
  </body>
</html>
 

You also need to modify the config.xml to include

    <access origin="http://googleapis.com" subdomains="true"></access>
    <access origin="http://gstatic.com" subdomains="true"></access>
    <access origin="http://google.com" subdomains="true"></access>
    <access origin="*" subdomains="true"></access>
    <tizen:privilege name="http://tizen.org/privilege/internet"/>

John Ixion

On wearables I would recommend Mapzen, which is based on OpenStreetMap: is much better for walking, running or cycling :)

 

Check it out: http://www.openstreetmap.org/

 

Mapzen API Key: https://developer.tizen.org/development/guides/native-application/location-and-sensors/maps-and-maps-service/getting-mapzen-api-key

 

 

Pascal Rapicault

Olivier, I looked at what you suggested but can't find doc to use it in a web application. Did I miss something?
 

John Ixion

you'll find the mapzen docs here

 

https://mapzen.com/documentation/

Pascal Rapicault

Thanks!