0

住所を示すために地図上に 1 つのデフォルト マーカーを配置したいのですが、ユーザーはユーザー マーカーを正しいと思われる場所にドラッグできます。(いくつかの地図修正状況で適用されます...)

<script type="text/javascript"><!--
var geocoder;
var map;
var point;
function mapLoad() {
geocoder = new google.maps.Geocoder();
var myOptions = {
  zoom: 16,
  mapTypeControl: false, 
  mapTypeId: google.maps.MapTypeId.ROADMAP
}

map = new google.maps.Map(document.getElementById("map"), myOptions);
var address = "LS2 2RD"; //default postcode
geocoder.geocode( { 'address':address,region:"UK",language:"en"}, function(results, status) {
  if (status == google.maps.GeocoderStatus.OK) {
    point=results[0].geometry.location;
    map.setCenter(point);
    var defaultMarker = new google.maps.Marker({map: map, position: point}); //default marker
    var marker = new google.maps.Marker({
        map: map, 
        position: point,
  draggable: true
    }); //The marker for users to drag

    var DefaultContent ='<h4>Default Location</h4><h6>You can drag it to anywhere you think it is right or confirm here is the right place</h6><div class="confirm"><input type="button" value="This location is correct"></div>'
    var DefaultInfo = new google.maps.InfoWindow({content: DefaultContent,maxWidth:200});
    DefaultInfo.open(map,marker); //default infowindow

      var TargetContent='<h4>New Location</h4><h6>Are you sure here is the right place?</h6><div class="confirm"><input type="button" value="Yes, I confirm" />'+
      '<input type="button" value="Cancel" onclick="clsMark()" /></div>'; //here cancel button is not working
      var infobox = new google.maps.InfoWindow({content: TargetContent}); //after drag ended, the new infowindow

google.maps.event.addListener(marker, 'drag', function(){
        DefaultInfo.close();
        });
google.maps.event.addListener(marker, 'dragend', function() {
      infobox.open(map, marker);
    });

function clsMark(){if (infobox != null) {infobox.close();}//if user cancel, clear the infowindow, and put the marker back to default position
        marker.setPosition(point);}

  } else {
    alert("Geocode was not successful for the following reason: " + status);
  }
});

}

問題は、情報ウィンドウでこれらのボタンを機能させることができないことです。次を使用してクリックイベントをボタンにバインドできません。

google.maps.event.addListener(buttonID, 'click', function(){...}

上記のコードと同じように、ボタンに onclick を追加すると、関数が定義されていないというエラーが発生します。この場合、「clsMark が定義されていません」と表示されます。

そのため、情報ウィンドウでボタンを機能させる方法がまったくわかりません。私を助けてください...

4

1 に答える 1