通过在文本框上输入纬度和经度来显示网页内的地图

时间:2014-04-22 10:05:01

标签: java javascript html google-maps

我试过这个

脚本

var locationmap=10.521649, 76.215076";
var map;
    var geocoder; 
    function InitializeMap() {
        var input = document.getElementById('locationmap'),
        locationmap = input.value;
     alert("locationmap"+locationmap);
        var latlng = new google.maps.LatLng(locationmap);
        var myOptions =
        {
            zoom: 8,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            disableDefaultUI: true
        };
        map = new google.maps.Map(document.getElementById("map"), myOptions);
    }

    function FindLocaiton() {
        geocoder = new google.maps.Geocoder();
        InitializeMap();

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

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

    } 
 window.onload = InitializeMap; 

和html代码是

<div id="wb_Text8" style="position:absolute;left:34px;top:518px;width:97px;height:16px;z-index:18;text-align:left;">
                    <span style="color:#000000;font-family:Arial;font-size:13px;">Location Map :</span>
                </div>
                <input type="text" th:field="*{location_Map}" id="locationmap" style="position:absolute;left:157px;top:511px;width:193px;height:23px;line-height:23px;z-index:20;" name="Editbox3" value="" />
                <div id="map" style="height: 253px">
                </div>

此处网页首次加载显示正确的地图。但是,当我改变lat&amp;在文本框内部,地图不是chagne

如果您对此有所了解请分享到这里..

0 个答案:

没有答案