2

gMap我在 javascript中创建了一个。

在加载地图时，标记也会与地图一起加载。我想在单击加载标记按钮后加载标记。怎么做？

JS：

var geocoder = new google.maps.Geocoder();

function geocodePosition(pos) {
  geocoder.geocode({
    latLng: pos
  }, function(responses) {
    if (responses && responses.length > 0) {

    } 
  });
}
function updateMarkerPosition(latLng) {
  document.getElementById('info').innerHTML = [
    latLng.lat(),
    latLng.lng()
  ].join(', ');
}
function initialize() {
  var latLng = new google.maps.LatLng(-29.3456, 151.4346);
  var map = new google.maps.Map(document.getElementById('mapCanvas'), {
    zoom: 8,
    center: latLng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  });
  var marker = new google.maps.Marker({
    position: latLng,
    title: 'Position',
    map: map,
    draggable: true
  });


  updateMarkerPosition(latLng);
  geocodePosition(latLng); 
   google.maps.event.addListener(marker, 'drag', function() {

    updateMarkerPosition(marker.getPosition());
  });
}

google.maps.event.addDomListener(window, 'load', initialize);

html:

<div id="info"></div>
<div id="mapCanvas"></div>
<button>Load MArker</button>
4

1 回答 1

1 
var geocoder = new google.maps.Geocoder();

function geocodePosition(pos) {
  geocoder.geocode({
    latLng: pos
  }, function(responses) {
    if (responses && responses.length > 0) {

    } 
  });
}
function updateMarkerPosition(latLng) {
  document.getElementById('info').innerHTML = [
    latLng.lat(),
    latLng.lng()
  ].join(', ');
}
function initialize() {
  var latLng = new google.maps.LatLng(-29.3456, 151.4346);
  var map = new google.maps.Map(document.getElementById('mapCanvas'), {
    zoom: 8,
    center: latLng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  });
  var marker = new google.maps.Marker({
    position: latLng,
    title: 'Position',
    map: null,   //<-- it will be created but not shown.
    draggable: true
  });


  updateMarkerPosition(latLng);
  geocodePosition(latLng); 
   google.maps.event.addListener(marker, 'drag', function() {

    updateMarkerPosition(marker.getPosition());
  });

 $('button').click(function(){
    marker.setMap(map);   //<-- assign the map, in other words .. show it.
});
}

google.maps.event.addDomListener(window, 'load', initialize);

第二个选项

var geocoder = new google.maps.Geocoder();

function geocodePosition(pos) {
  geocoder.geocode({
    latLng: pos
  }, function(responses) {
    if (responses && responses.length > 0) {

    } 
  });
}
function updateMarkerPosition(latLng) {
  document.getElementById('info').innerHTML = [
    latLng.lat(),
    latLng.lng()
  ].join(', ');
}
function initialize() {
  var latLng = new google.maps.LatLng(-29.3456, 151.4346);
  var map = new google.maps.Map(document.getElementById('mapCanvas'), {
    zoom: 8,
    center: latLng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  });
  var marker = new google.maps.Marker({
    position: latLng,
    title: 'Position',
    map: map,   
    draggable: true,
    visible: false   //<-- default value is true
  });


  updateMarkerPosition(latLng);
  geocodePosition(latLng); 
   google.maps.event.addListener(marker, 'drag', function() {

    updateMarkerPosition(marker.getPosition());
  });

 $('button').click(function(){
    marker.setVisible(true);   //<--  show it.
});
}

google.maps.event.addDomListener(window, 'load', initialize);

在此处查看两种方法的区别 Google Maps v3 中的“marker.setVisible(false)”和“marker.setMap(null)”有什么区别？

于 2013-06-05T10:02:27.880 回答