aboutsummaryrefslogtreecommitdiffstats
path: root/examples/declarative/modelviews/webview/inlinehtml/qml/content/Mapping/map.html
blob: a98da5430fe7d60954256986c49226147352014e (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
  var geocoder
  var map
  function goToLatLng(latlng,bounds) {
    if (map) {
        map.setCenter(latlng)
        map.fitBounds(bounds)
    } else {
        var myOptions = {
          zoom: 8,
          center: latlng,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    }
  }
  function initialize() {
    geocoder = new google.maps.Geocoder();
    if (window.qml.address) {
        goToAddress()
    } else {
        goToLatLng(new google.maps.LatLng(window.qml.lat,window.qml.lng));
    }
    if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(function(position) {
        initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
        window.qml.lat = initialLocation.lat;
        window.qml.lng = initialLocation.lng;
        goToLatLng(initialLocation);
      });
    }
  }
  function goToAddress() {
      if (geocoder) {
        var req = {
            address: window.qml.address,
        }
        if (map)
            req.bounds = map.getBounds()
        window.qml.status = "Loading";
        geocoder.geocode(req, function(results, status) {
          if (status == google.maps.GeocoderStatus.OK) {
            window.qml.status = "Ready";
            goToLatLng(results[0].geometry.location,results[0].geometry.bounds);
          } else {
            window.qml.status = "Error";
          }
        });
      }
  }
</script>
</head>
<body onload="initialize()" leftmargin="0px" topmargin="0px" marginwidth="0px" marginheight="0px">
  <div id="map_canvas" style="width:100%; height:100%"></div>
</body>
</html>