使用 gps 标记和 gps 轨迹创建文件答案

【问题标题】：Create file with gps markers and gps tracks使用 gps 标记和 gps 轨迹创建文件
【发布时间】：2013-12-31 14:51:07
【问题描述】：

我想制作一个文件，我可以在其中显示我的 GPS 轨迹并在我拍摄照片的位置设置标记。我制作了 2 个脚本：一个显示我的 GPS 轨迹，一个显示我的标记。

如何将它们合并在一起，以便同时显示 GPS 轨迹和标记？

我的足迹：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps GPX Test - async</title>
<style type="text/css">
 v\:* {
 behavior:url(#default#VML);
 }
</style>
<!-- Make the document body take up the full screen -->
<style type="text/css">
 html, body {width: 100%; height: 100%}
 body {margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-bottom: 0px}
 </style>
  <script type="text/javascript"   src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js">                                                   
 </script>
 <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
 <script src="loadgpx.js" type="text/javascript"></script>
 <script type="text/javascript">
 //<![CDATA[

 function loadGPXFileIntoGoogleMap(map, filename) {
 $.ajax({url: filename,
  dataType: "xml",
  success: function(data) {
  var parser = new GPXParser(data, map);
  parser.setTrackColour("#ff0000");     // Set the track line colour
  parser.setTrackWidth(3);          // Set the track line width
  parser.setMinTrackPointDelta(0.001);      // Set the minimum distance between track points
  parser.centerAndZoom(data);
  parser.addTrackpointsToMap();         // Add the trackpoints
  parser.addWaypointsToMap();           // Add the waypoints
   }
  });
  }
 $(document).ready(function() {
 var mapOptions = {
 zoom: 8,
 mapTypeId: google.maps.MapTypeId.HYBRID
 };
 var map = new google.maps.Map(document.getElementById("map"),
 mapOptions);
 tur = "halsnas030610.xml";
 loadGPXFileIntoGoogleMap(map, tur);
  });
 //]]>

</script>
</head>
<body>
<div id="map" style="width: 100%; height: 100%;"></div>
</body>
</html>

我的标记：

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
  <title>Google Maps Multiple Markers</title>
  <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script> 
</head>
<body>
<div id="map" style="width: 1000px; height: 1000px;"></div>

<script type="text/javascript">
var locations = [
      ['P1030728.jpg', 55.96160, 11.85141],
      ['P1070731.jpg', 55.97566, 11.85472],
      ['P1030743.jpg', 55.9475, 11.85306],
      ['P1030735.jpg', 55.97917, 11.85844],     
    ];
var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 13,
    center: new google.maps.LatLng(55.9475, 11.85306),
     mapTypeId: google.maps.MapTypeId.ROADMAP
});

var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i = 0; i < locations.length; i++) {
 marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
        map: map
  });
 google.maps.event.addListener(marker, 'click', (function(marker, i) {
 return function() {
 infowindow.setContent(locations[i][0]);
 infowindow.open(map, marker);
 }
 })(marker, i));
 }
</script>
</body>
</html>

【问题讨论】：

标签： google-maps gps

【解决方案1】：

您缺少以下行：google.maps.event.addDomListener(window, 'load', load)。它现在有效吗？告诉我们怎么做。

【讨论】：

行： - 然后它就可以工作了。