2016-04-22 5 views
0

Ich habe dieses Stück Javascript, das ein Suchformular hat und ermöglicht es dem Benutzer, eine Postleitzahl einzugeben und es gibt die Breiten- und Längengradwerte dieser Postleitzahl zurück und lokalisiert sie genau auf einer Karte. Wie kann ich die Karte loswerden und die Seite so öffnen, dass nur die Werte für den Breiten- und den Längengrad angezeigt werden? Ich habe versucht zu löschen, was ich dachte, war alles mit der Karte zu tun, aber es völlig versagt zu arbeiten, so hoffe ich, jemand kann mir helfen!Wie entferne ich die Karte in diesem Code?

Code:

<style type="text/css"> 
    #map 
    { 
    height:400px; 
    width:400px; 
    display:block; 
    } 
</style> 
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=MY-API"></script> 
<script type="text/javascript"> 

    function getPosition(callback) { 
    //set up our geoCoder 
    var geocoder = new google.maps.Geocoder(); 

    //get our postcode value 
    var postcode = document.getElementById("postcode-bar").value; 

    //send value to google to get a longitude and latitude value 
    geocoder.geocode({'address': postcode}, function(results, status) { 

     //callback with a status and result 
     if (status == google.maps.GeocoderStatus.OK) { 
     //send the values back in a JSON string 
     callback({ 
      latt: results[0].geometry.location.lat(), 
      long: results[0].geometry.location.lng() 
     }); 
     } 
    }); 
    } 
function setup_map(latitude, longitude) { 

    //create a JSON object with the values to mark the position 
    var _position = { lat: latitude, lng: longitude}; 

    //add our default mapOptions 
    var mapOptions = { 
     zoom: 16    //zoom level of the map 
     center: _position  //position to center 
    } 

    //load a map within the "map" div and display 
    var map = new google.maps.Map(document.getElementById('map'), mapOptions); 

    //add a marker to the map with the position of the longitude and latitude 
    var marker = new google.maps.Marker({ 
     position: mapOptions.center, 
     map: map 
    }); 
} 
window.onload = function() { 

    //first setup the map, with our default location of London 
    setup_map(51.5073509, -0.12775829999998223); 

    document.getElementById("form").onsubmit = function() { 

     //when form is submitted, wait for a callback with the longitude and latitude values 
     getPosition(function(position){ 

     //log the position returned 
     var text = document.getElementById("text") 
     text.innerHTML = "Marker position: { Longitude: "+position.long+ ", Latitude:"+position.latt+" }"; 

     //update the map with the new position 
     setup_map(position.latt, position.long); 
     }); 
    } 
} 

</script> 

</head> 
<body> 


<div id="postcode-search" class="input-group"> 

    <form action="javascript:void(0)" id="form"> 

    <input id="postcode-bar" class="form-control" placeholder="Enter your postcode" type="text"></input> 
    <span class="input-group-btn"> 
     <button class="btn btn-default" id="postcode-btn" type="button">Go</button> 
    </span> 

    </form> 

</div> 

<div id="map"></div> 
<div id="text"></div> 

+0

Der entsandte Code funktioniert nicht wie. 'Uncaught SyntaxError: Unexpected identifier' – geocodezip

+0

Da Sie keinen Zugriff auf meine API haben, aber meine Frage jetzt beantwortet wird, danke. –

Antwort

1

nicht setup_map() Funktion ausführen.

window.onload = function() { 

//first setup the map, with our default location of London 
setup_map(51.5073509, -0.12775829999998223); 

document.getElementById("form").onsubmit = function() { 

    //when form is submitted, wait for a callback with the longitude and latitude values 
    getPosition(function(position){ 

    //log the position returned 
    var text = document.getElementById("text") 
    text.innerHTML = "Marker position: { Longitude: "+position.long+ ", Latitude:"+position.latt+" }"; 

    //update the map with the new position 
    setup_map(position.latt, position.long); 
    }); 
} 
} 

zu

window.onload = function() { 
    //first setup the map, with our default location of London 
    // setup_map(51.5073509, -0.12775829999998223); 

    document.getElementById("form").onsubmit = function() { 

     //when form is submitted, wait for a callback with the longitude and latitude values 
     getPosition(function(position){ 

     //log the position returned 
     var text = document.getElementById("text") 
    text.innerHTML = "Marker position: { Longitude: "+position.long+ ", Latitude:"+position.latt+" }"; 


    //update the map with the new position 
    //setup_map(position.latt, position.long); 
    }); 
} 
} 

Sie könnten die Funktion löschen, aber man weiß ja nie, wenn Sie es brauchen könnte ..

+0

Funktioniert gut, danke. –

+0

Ich bin froh, dass ich helfen konnte :) – Filchev

Verwandte Themen