2013-10-17 78 views
0

在這裏,我有這樣的代碼和可變多邊形:陣列以JSON數據轉換與JavaScript

var directionsDisplay; 
    var directionsService = new google.maps.DirectionsService(); 
    var map; 
      var bermudaTriangle; 
      var directionsPoints; 
      var example; 
      var rez; 

    function initialize() { 
     directionsDisplay = new google.maps.DirectionsRenderer(); 
     var chicago = new google.maps.LatLng(41.850033, -87.6500523); 
     var mapOptions = { 
     zoom:7, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     center: chicago 
     } 
     map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
     directionsDisplay.setMap(map); 
    } 

    function calcRoute() { 
     var start = document.getElementById('start').value; 
     var end = document.getElementById('end').value; 
     var request = { 
      origin:start, 
      destination:end, 
      travelMode: google.maps.DirectionsTravelMode.DRIVING 
     }; 
     directionsService.route(request, function(response, status) { 
     if (status == google.maps.DirectionsStatus.OK) { 
       directionsDisplay.setDirections(response); 
      directionsPoints= response.routes[0].overview_path; 

//In this format I must transform directionsPoints 
      example= [[{"X":72,"Y":59.45},{"X":136,"Y":66},{"X":170,"Y":99},{"X":171,"Y":114},{"X":183,"Y":125},{"X":218,"Y":144},{"X":218,"Y":165},{"X":226,"Y":193},{"X":254,"Y":195},{"X":283,"Y":195},{"X":292,"Y":202},{"X":325,"Y":213},{"X":341,"Y":234},{"X":397,"Y":245},{"X":417,"Y":248}]]; 
      function draw() { 
     var polygons = response.routes[0].overview_path; 
     var scale = 100; 
     reverse_copy(polygons); 
     polygons = scaleup(polygons, scale); 
     var cpr = new ClipperLib.Clipper(); 
     var delta = 25; 
     var joinType = ClipperLib.JoinType.jtRound; 
     var miterLimit = 2; 
     var AutoFix = true; 
     var svg, offsetted_polygon, 
     cont = document.getElementById('map-canvas'); 
     offsetted_polygon = cpr.OffsetPolygons(polygons, delta * scale, joinType, miterLimit, AutoFix); 
     console.log(JSON.stringify(offsetted_polygon)); 


     svg = polys2path(offsetted_polygon, scale); 
      rez= polys2path(offsetted_polygon, scale); 


      bermudaTriangle = new google.maps.Polygon({ 
     paths: svg, 
     strokeColor: '#FF0000', 
     strokeOpacity: 0.8, 
     strokeWeight: 2, 
     fillColor: '#FF0000', 
     fillOpacity: 0.35 
     }); 

     bermudaTriangle.setMap(map); 

    } 
    // helper function to scale up polygon coordinates 
    function scaleup(poly, scale) { 
     var i, j; 
     if (!scale) scale = 1; 
     for(i = 0; i < poly.length; i++) { 
     for(j = 0; j < poly[i].length; j++) { 
      poly[i][j].lb *= scale; 
      poly[i][j].mb *= scale; 
     } 
     } 
     return poly; 
    } 

    // converts polygons to SVG path string 
    function polys2path (poly, scale) { 
     var path = "", i, j; 
     if (!scale) scale = 1; 
     for(i = 0; i < poly.length; i++) { 
     for(j = 0; j < poly[i].length; j++){ 
      if (!j) path += "M"; 
      else path += "L"; 
      path += (poly[i][j].lb/scale) + ", " + (poly[i][j].mb/scale); 
     } 
     path += "Z"; 
     } 
     return path; 
    } 

    function reverse_copy(poly) { 
     // Make reverse copy of polygons = convert polyline to a 'flat' polygon ... 
     var k, klen = poly.length, len, j; 
     for (k = 0; k < klen; k++) { 
     len = poly[k].length; 
     poly[k].length = len * 2 - 2; 
     for (j = 1; j <= len - 2; j++) { 
      poly[k][len - 1 + j] = { 
      lb: poly[k][len - 1 - j].lb, 
      mb: poly[k][len - 1 - j].mb 
      } 
     } 
     } 
    } 


     } 
     }); 
    } 

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

所以,當你在代碼中看到上面我必須變換不定

var polygons = response.routes[0].overview_path; 

成格式例如:

example= [[{"X":72,"Y":59.45},{"X":136,"Y":66},{"X":170,"Y":99},{"X":171,"Y":114},{"X":183,"Y":125},{"X":218,"Y":144},{"X":218,"Y":165},{"X":226,"Y":193},{"X":254,"Y":195},{"X":283,"Y":195},{"X":292,"Y":202},{"X":325,"Y":213},{"X":341,"Y":234},{"X":397,"Y":245},{"X":417,"Y":248}]]; 

因此我如何將polygons變換爲example

這裏是完整的代碼:http://jsbin.com/uTATePe/21/edit

+1

您的代碼存在錯誤。 'draw'沒有被調用 - 我認爲是因爲它是一個嵌套函數... – Andy

+0

我該如何解決這個問題? –

+0

您應該在代碼的某處添加'draw();'來執行函數,否則它將不起作用。在這裏發佈之前,你還應該做一些代碼格式化**。 – yarl

回答

0

檢查jQuery.each()實施例和this anwser推入example陣列。

+0

是的,但請告訴我我的例子如何將 –

+0

你可以在jsbin上發佈代碼? –

+0

但是'polygons'裏面有什麼?添加一些代碼。 – yarl