向提升服务 GMaps API v3 添加标记



我使用 Google Developers 的 GMaps 代码进行 GMaps Elevation Service。通过单击地图,它会自动打开一个信息窗口。现在我尝试集成一个标记对象。我的目标是"冻结"地图上带有高程信息的标记。但是,一步一步,首先,通过单击地图,我没有看到任何标记。我将不胜感激。谢谢!

这是代码:

 var elevator;
 var map;
var freiburg = new google.maps.LatLng(47.9971865, 7.8537668);
var marker_options = {
         map : map,
         icon : {  url : 'http://maps.google.com/mapfiles/marker.png',
                   size : new google.maps.Size(32,32),
                   anchor : new google.maps.Point(0,0),
                   origin: new google.maps.Point(0,32)
         }
  };
var infowindow = new google.maps.InfoWindow();
 //new marker object
var marker = new google.maps.Marker(marker_options);

 function initialize() {
 var mapOptions = {
 zoom: 13,
 center: freiburg,
 mapTypeId: 'terrain'
 }
 map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

 // Create an ElevationService
 elevator = new google.maps.ElevationService();
 // Add a listener for the click event and call getElevation on that location
  google.maps.event.addListener(map, 'click', getElevation);
   }
function getElevation(event) {
 var locations = [];
 // Retrieve the clicked location and push it on the array
 var clickedLocation = event.latLng;
 locations.push(clickedLocation);
  // Create a LocationElevationRequest object using the array's one value
  var positionalRequest = {
  'locations': locations
   }
  // Initiate the location request
  elevator.getElevationForLocations(positionalRequest, function(results, status) {
  if (status == google.maps.ElevationStatus.OK) {
  // Retrieve the first result
  if (results[0]) {
    //position Marker
    marker.setPosition(clickedLocation);
    // Open an info window indicating the elevation at the clicked position
    infowindow.setContent(Math.round(results[0].elevation) + ' m. N. N.');
    infowindow.setPosition(clickedLocation);
    infowindow.open(map);
  } else {
    alert('No results found');
  }
  } 
   else {
     alert('Elevation service failed due to: ' + status);
    }
     });
         }

要查看地图上的标记,您需要设置 google.maps.Marker 对象的 "map" 属性:

   marker.setMap(map);

工作示例

具有自定义图标定义的工作示例

最新更新