2013-06-29 115 views
-3

我在我的代碼中遇到了一些問題,首先我想從兩個文本框中獲取給定地址/城市名稱的latlng,之後我將它轉換爲位置的latlng,位置的latlng,最後我想在這兩個點上的這些點和標記之間畫一個折線,但是現在我試圖在這些點之間劃一條線。但仍然不工作這個代碼也沒有在控制檯中的任何錯誤。代碼在這裏是爲了您的幫助。獲取latlng並在兩個latlng之間畫一條折線

function getRoute(){ 
var from_text = document.getElementById("travelFrom").value; 
var to_text = document.getElementById("travelTo").value; 

if(from_text == ""){ 
    alert("Enter travel from field")  
    document.getElementById("travelFrom").focus(); 
} 
else if(to_text == ""){ 
    alert("Enter travel to field"); 
    document.getElementById("travelTo").focus(); 
} 
else{ 
    //google.maps.event.addListener(map, "", function (e) { 
    var myLatLng = new google.maps.LatLng(28.6667, 77.2167);               
    var mapOptions = { 
     zoom: 3, 
     center: myLatLng, 
     mapTypeId: google.maps.MapTypeId.TERRAIN 
    };               
    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);               
     var geocoder = new google.maps.Geocoder(); 
     var address1 = from_text; 
     var address2 = to_text; 
     var from_latlng,to_latlng; 
      //var prepath = path; 
      //if(prepath){ 
      // prepath.setMap(null); 
      //} 
      geocoder.geocode({ 'address': address1}, function(results, status) { 
        if (status == google.maps.GeocoderStatus.OK) 
        { 
         // do something with the geocoded result 
       // alert(results[0].geometry.location); 
         from_latlng = results[0].geometry.location; 

        // from_lat = results[0].geometry.location.latitude; 
         // from_lng = results[0].geometry.location.longitude; 

        // alert(from_latlng); 
        } 
      }); 
      geocoder.geocode({ 'address': address2}, function(results, status) { 
        if (status == google.maps.GeocoderStatus.OK) 
        { 
         // do something with the geocoded result 
         to_latlng = results[0].geometry.location; 
        // to_lat = results[0].geometry.location.latitude; 
        // to_lng = results[0].geometry.location.longitude; 
         // results[0].geometry.location.longitude 
        // alert(to_latlng) 
        } 
      }); 
      setTimeout(function(){ 
        var flightPlanCoordinates = [ 
         new google.maps.LatLng(from_latlng), 
         new google.maps.LatLng(to_latlng)   
        ]; 
        //alert("123") 
        var polyline; 
        polyline = new google.maps.Polyline({ 
         path: flightPlanCoordinates, 
         strokeColor: "#FF0000", 
         strokeOpacity: 1.0, 
         strokeWeight: 2 
        }); 
        polyline.setMap(map);  
        // assign to global var path 
       // path = polyline; 
     },4000); 
    // }); 
    } 

}

+0

可能重複的[如何在Google地圖中連接兩個點..?](http://stackoverflow.com/questions/15773388/how-to-connect-two-points-in-google-map ) – geocodezip

+0

是的,我發現這個問題的答案url是工作的例子:http://www.geocodezip.com/v3_SO_drawLineFroGeocodedResults.html – Anup

+0

但仍然問題是我的代碼中的錯誤是什麼? – Anup

回答

0
/*This is script*/ 

    var x=0; 
    var map; 
    var prepath; 
    var path = null; 
    var current_lat = 28.6667; 
    var current_lng = 77.2167; 
function initialize() { 
    var myLatLng = new google.maps.LatLng(28.6667, 77.2167); 
    var mapOptions = { 
    zoom: 3, 
    center: myLatLng, 
    mapTypeId: google.maps.MapTypeId.TERRAIN 
    }; 

    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
    //alert("sdf") 

google.maps.event.addListener(map, "click", function (e) { 
    //delete old 
     //alert("sdf123") 
    prepath = path; 
    if(prepath){ 
     prepath.setMap(null); 
    } 
    current_lat = e.latLng.lat(); 
    current_lng = e.latLng.lng(); 

    var flightPlanCoordinates = [    
      new google.maps.LatLng(39.9100, 116.4000),    
      new google.maps.LatLng(35.6833, 139.7667)    
    ]; 
    var polyline; 
    polyline = new google.maps.Polyline({ 
     path: flightPlanCoordinates, 
     strokeColor: "#FF0000", 
     strokeOpacity: 1.0, 
     strokeWeight: 2 
    }); 
    //new polyline 
    polyline.setMap(map); 
    // assign to global var path 
    path = polyline; 
    }); 

} 


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


/*this is html*/ 

<div id="map-canvas"></div> 
    <div id="textboxContainer" style="width:100%; height:40px; top:0; position:absolute;"> 
     From : <input type="text" name="travelFrom" id="travelFrom"> &nbsp; To : <input type="text" name="travelTo" id="travelTo" onBlur="getRoute()"> 
    </div> 
+0

這是一個完整的工作示例,您需要添加html在腳本標記之間的HTML和腳本 – Anup

0

的一個問題是

var flightPlanCoordinates = [ 
     new google.maps.LatLng(from_latlng), 
     new google.maps.LatLng(to_latlng)   
    ]; 

from_latlng和to_latlng已經google.maps.LatLng物件。

+0

是的,你是對的,我改變了,並更新與問題 – Anup

相關問題