用JavaScript創建

Question

複雜的多邊形我想喜歡這裏創建的路線方向的多邊形：http://i.imgur.com/olGmuN6.png所以我寫這篇文章：

directionService.route(request, function(result, status) { 
    if (status == google.maps.DirectionsStatus.OK) { 
     directionsRenderer.setDirections(result); 
     var r = []; 
     var z = 0.5; 
     var bla = result.routes[0].overview_path; 
     for(var i=0 in result.routes[0].overview_path) { 
      r.push(new google.maps.LatLng(bla[i].lat()+z, bla[i].lng()-z)); 
     } 
     bla.reverse(); 
     for(var x=0 in bla) { 
      r.push(new google.maps.LatLng(bla[x].lat()-z, bla[x].lng()+z)); 
     } 

     var prva = new google.maps.Polyline({ 
      path: result.routes[0].overview_path, 
      strokeColor: "#00000", 
      strokeOpacity: 1.0, 
      strokeWeight: 2 
     }); 

     prva.setMap(map); 

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

     druga.setMap(map); 

    } else { 
     alert("Directions query failed: " + status); 
    } 
    }); 

，但在某些情況下，在某些情況下並不好，所以我的代碼產生這樣的：

BAD case: 

GOOD：

那麼，如何解決這名p通過路線方向得到好的多邊形嗎？有人有想法嗎？

我怎樣才能落實到我的代碼如下：http://i.imm.io/1gMu5.png

有一些其他的方式比這創造什麼，我需要......

Answer 1

如果我理解正確的，你想博爾登折線（或在多段線周圍製作偏移多邊形）。

對於抵消，您可以使用Javascript Clipper Library。如果你有以下的折線（路線）：

您可以用剪使下方的偏移多邊形：

這裏是代碼的重要組成部分（在JSBIN ）：

 
var paths = [[{"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}]]; 

var scale = 100; 
ClipperLib.JS.ScaleUpPaths(paths, scale); 

var solution = new ClipperLib.Paths(); 
var co = new ClipperLib.ClipperOffset(); 
co.AddPaths(paths, ClipperLib.JoinType.jtRound, ClipperLib.EndType.etOpenRound); 
co.Execute(solution, 25 * scale); 

編輯：這是一個通用的解決方案，名爲「偏移折線」。我不知道谷歌地圖或任何其他地圖軟件的祕密，所以你的問題的確切解決方案在你手中。