开发者

Geocode Javascript problem

I wonder whether someone may be able to help me please.

Because of loading issues, I've moved the map options code to my HTML form, rather than it being in a separate Javascript file.

The problem is that I now can't get the Geocode functionality to work. I've added my code below. I'm sure it must be something simple, but I'm a little perplexed by this. I just wondered whether it would be at all possible please that someone could let me know where I've gone wrong.

Many thanks

function geocode() {

    // This is defining the global variables
    var geocoder, marker;

    // This is making the link with the 'Search For Location' HTML form
    var form = document.getElementById('searchforlocationform');

    // This is catching the forms submit event
    form.onsubmit = function() {

    // This is getting the Address from the HTML forms 'Address' text box
    var address = document.getElementById('inputaddress').value;

    // This is making the Geocoder call
    getCoordinates(address);

    // This is preventing the form from doing a page submit
    return false;
    }
    }
    function geocodePosition(pos) {
    geocoder.geocode({
    latLng: pos
    }, 

    function(responses) {
        if (responses && responses.length > 0) {
    updateMarkerAddress(responses[0].formatted_address);
    } else {
    updateMarkerAddress('Cannot determine address at this location.');
    }
    });
    }

    //New Code
    function updateMarkerStatus(str) {
    document.getElementById('markerStatus').innerHTML = str;
    }

    //Changed 'address' to 'returnedaddress'
    function updateMarkerAddress(str) {
    document.getElementById('returnedaddress').value= str;
    }

    // This creates the function that will return the coordinates for the address
    function getCoordinates(address) {

    // This checks to see if there is already a geocoded object. If not, it creates one
    if(!geocoder){geocoder = new google.maps.Geocoder();}

    // This is creating a GeocoderRequest object
    var geocoderRequest = {address: address}

    // This is making the Geocode request
    geocoder.geocode(geocoderRequest, function(results, status) {

     // Check if status is OK before proceeding
    if (status == google.maps.GeocoderStatus.OK) {

    // Center the map on the returned location
    map.setCenter(results[0].geometry.location);

    // Check to see if we've already got a Marker object
    if (!marker) {
    map.setZoom(16); 
    marker = new google.maps.Marker({
    map: map, draggable:true
    });
    }

    // Setting the position of the marker to the returned location
    marker开发者_如何学JAVA.setPosition(results[0].geometry.location);

    // Add dragging event listeners.
    google.maps.event.addListener(marker, function() {
    updateMarkerAddress;
    });

    //This fills out the 'Latitude' and 'Longitude' text boxes on the HTML form
    document.getElementById('osgb36lat').value= results[0].geometry.location.lat();
    document.getElementById('osgb36lon').value= results[0].geometry.location.lng();

    //This allows the marker to be draggable and tells the 'Latitude' and 'Longitude' text boxes on the HTML form to update with the new co-ordinates as the marker is dragged
    google.maps.event.addListener(marker,'dragend',     
    function() {    
    updateMarkerStatus;
    geocodePosition(marker.getPosition());
    document.getElementById('osgb36lat').value = marker.position.lat();         
    document.getElementById('osgb36lon').value = marker.position.lng();

    });

    // Update current position info.
    latLng = [marker.position.lat(), marker.position.lng()].join(', ');
    geocodePosition(marker.getPosition());



    var point = marker.getPosition();
    map.panTo(point);   
    }  
    } 
)
    }


<script type="text/javascript">
        (function() {
            window.onload = function(){
                var latlng = new google.maps.LatLng(54.312195845815246,-4.45948481875007);
                var options = {
                zoom: 6,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                mapTypeControl: true,
                mapTypeControlOptions: {
                style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
                position: google.maps.ControlPosition.TOP_RIGHT
                },
                navigationControl: true,
                navigationControlOptions: {
                style: google.maps.NavigationControlStyle.ZOOM_PAN,
                position: google.maps.ControlPosition.TOP_LEFT
                },
                scaleControl: true,
                scaleControlOptions: {
                position: google.maps.ControlPosition.BOTTOM_LEFT
        } 
                }; 
                var map = new google.maps.Map(document.getElementById('map'), options);
            }
        })();

    </script>


You seen to be trying to call updateMarkerAddress with updateMarkerAddress; and updateMarkerStatus with updateMarkerStatus;, here you are missing (/*some param*/). What are the loading issues? Maybe if you show your html someone could help with that too.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜