2

私はgMapjavascriptで作成しました。

地図を読み込んでいる間、地図と一緒にマーカーも読み込みます。 マーカー読み込みボタンをクリックしてからマーカーを読み込みたいです。どうやってするか?

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);

2つのメソッドの違いはこちらGoogle Maps v3の「marker.setVisible(false)」と「marker.setMap(null)」の違いは?

于 2013-06-05T10:02:27.880 に答える