Googleマップ：ドロップダウンでマップマーカーの位置を変更する

Question

マップマーカーの位置をドロップダウンの変化に基づいて変更したい場合は、私が行っていることは、ドロップダウンイベントで緯度や経度を取得して、これらの座標を現在のマーカー、これは私のコード

$("#location").change(function() { 
    var addr = ($('#location').val()); 

    var geocoder = new google.maps.Geocoder(); 
    geocoder.geocode({ 'address': addr }, function (results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
      alert("location : " + results[0].geometry.location.lat() + " " + results[0].geometry.location.lng()); 
      geoMarker.setMarkerOptions({ 
       duration: duration, 
       easing: $('#easingOption').val() 
      }); 
     } else { 
      alert("Something got wrong " + status); 
     } 
    }); 
}); 

HTMLです：

<select id="location"> 
    <option>Dubai</option> 
    <option>Sharjah</option> 
</select> 

それは現在の座標を警告するが、私は私のマーカーの位置にこれらの座標を渡すん方法を知っておく必要があり

Answer 1

あなたが.setPosition()を探しているように見える：

var latlng = new google.maps.LatLng(-24.397, 140.644); 
marker.setPosition(latlng); 

Answer 2

あなたはジオコード操作の結果に基づいて、マーカーの位置を設定する必要があります。

$("#location").change(function() { 
    var addr = ($('#location').val()); 

    var geocoder = new google.maps.Geocoder(); 
    geocoder.geocode({'address': addr 
    }, function(results, status) { 
    if (status == google.maps.GeocoderStatus.OK) { 
     map.setCenter(results[0].geometry.location); 
     geoMarker.setPosition(results[0].geometry.location); 
    } else { 
     alert("Something got wrong " + status); 
    } 
    }); 
}); 

proof of concept fiddle

コードスニペット：

var geocoder; 
 
var map; 
 
var geoMarker; 
 

 
function initialize() { 
 
    var map = new google.maps.Map(
 
    document.getElementById("map_canvas"), { 
 
     center: new google.maps.LatLng(37.4419, -122.1419), 
 
     zoom: 13, 
 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }); 
 
    geoMarker = new google.maps.Marker(); 
 
    geoMarker.setPosition(map.getCenter()); 
 
    geoMarker.setMap(map); 
 

 
    $("#location").change(function() { 
 
    var addr = ($('#location').val()); 
 

 
    var geocoder = new google.maps.Geocoder(); 
 
    geocoder.geocode({ 
 
     'address': addr 
 
    }, function(results, status) { 
 
     if (status == google.maps.GeocoderStatus.OK) { 
 
     map.setCenter(results[0].geometry.location); 
 
     geoMarker.setPosition(results[0].geometry.location); 
 
     } else { 
 
     alert("Something got wrong " + status); 
 
     } 
 
    }); 
 
    }); 
 

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

html, 
 
body, 
 
#map_canvas { 
 
    height: 100%; 
 
    width: 100%; 
 
    margin: 0px; 
 
    padding: 0px 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<select id="location"> 
 
    <option>Dubai</option> 
 
    <option>Sharjah</option> 
 
</select> 
 
<div id="map_canvas"></div>