创建按钮点击事件(Google地图)

时间:2013-08-28 18:03:58

标签: javascript google-maps button mouseclick-event

我正在使用嵌入在我网页上的Google地图。我想要的是创建一个按钮点击事件,然后在用户将地址输入到名为txtBoxMaps的文本框后,他们可以单击一个显示新位置的按钮。我尝试使用:google.maps.event.addDomListener(window,'click',Initialize);但它似乎什么也没做。

以下是我的代码:

<script type="text/javascript">

function Initialize() {

var mapOptions = {
            center: new google.maps.LatLng(-33.01, 27.9),
            zoom: 13,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        var map = new google.maps.Map(document.getElementById('GMap1'), mapOptions);

        var input = document.getElementById('txtBoxMaps');

        });

    }

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



</script>



<input type="text" id="txtBoxMaps"/>

        <div id="GMap1" style="height: 240px; width:570px" ></div>

1 个答案:

答案 0 :(得分:0)

您需要将侦听器放在按钮上,然后使用您的代码在该点获取字段中的值,如下所示: var input = document.getElementById('txtBoxMaps').value;

此时,您可以对该地址进行地理编码,并将地图的中心设置为新位置。

function getGeocode() {
  var input = document.getElementById("txtBoxMaps").value;
  geocoder.geocode( { 'address': input}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      map.setCenter(results[0].geometry.location);
    }
  });

请参阅此处的地理编码文档:https://developers.google.com/maps/documentation/javascript/geocoding