使用編碼多段線的多邊形中的孔

-1

我們看到有關此問題的衝突文檔，但可以使用編碼多段線來渲染複雜多邊形（那些帶孔/圓環）？使用編碼多段線的多邊形中的孔

我認爲顛倒纏繞方向應該可行，但開發人員告訴我們編碼折線不支持這一點。

任何幫助，非常感謝。

來源

2016-03-03 Silver Facechamp

嗨，歡迎SO。你在編程什麼語言？代碼在哪裏？ –

JavaScript .... extJS框架。 –

你能提供一個例子嗎？你是否嘗試過分別編碼外邊界和內孔？ – geocodezip

這是可能的，你需要編碼/解碼獨立的內部和外部路徑。

var donut = new google.maps.Polygon({ 
      paths: [google.maps.geometry.encoding.decodePath(encodedOP), 
      google.maps.geometry.encoding.decodePath(encodedIP)], 
      strokeColor: "#0000FF", 
      strokeOpacity: 0.8, 
      strokeWeight: 2, 
      fillColor: "#FF0000", 
      fillOpacity: 0.35 
      });

代碼片段：

function initialize() { 
 
    var myOptions = { 
 
    zoom: 7, 
 
    center: new google.maps.LatLng(-33.9, 151.2), 
 
    mapTypeControl: true, 
 
    mapTypeControlOptions: { 
 
     style: google.maps.MapTypeControlStyle.DROPDOWN_MENU 
 
    }, 
 
    navigationControl: true, 
 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    } 
 
    map = new google.maps.Map(document.getElementById("map_canvas"), 
 
    myOptions); 
 

 
    var encodedOP = "~a|mEsmnd\\{[email protected][email protected]@~l^[email protected]|[email protected]@[email protected]@[email protected][email protected]`[email protected]@[email protected]@|[email protected]@~l^`[email protected]@[email protected]`[email protected]@_m^[email protected]}[email protected]@[email protected]`[email protected][email protected]{jaAslD{[email protected]@[email protected]@[email protected]}[email protected]@_m^[email protected]{[email protected]"; 
 
    var encodedIP = "pp`mEwaa_\\lpZqgBlpZpgBpnYvtH`lW`vNtkT|cTzpPzwXn`L`l\\``Gb|^xuA|d`@yuA|d`@a`Gb|^o`L`l\\{pPzwXukT|cTalW`vNqnYvtHmpZpgBmpZqgBqnYwtHalWavNukT}cT{pP{wXo`Lal\\a`Gc|^yuA}d`@xuA}d`@``Gc|^n`Lal\\zpP{wXtkT}cT`lWavNpnYwtH"; 
 
    var donut = new google.maps.Polygon({ 
 
    paths: [google.maps.geometry.encoding.decodePath(encodedOP), 
 
     google.maps.geometry.encoding.decodePath(encodedIP) 
 
    ], 
 
    strokeColor: "#0000FF", 
 
    strokeOpacity: 0.8, 
 
    strokeWeight: 2, 
 
    fillColor: "#FF0000", 
 
    fillOpacity: 0.35 
 
    }); 
 
    donut.setMap(map); 
 

 

 
} 
 

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

html, 
 
body, 
 
#map_canvas { 
 
    height: 100%; 
 
    width: 100%; 
 
    margin: 0px; 
 
    padding: 0px 
 
}

<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry"></script> 
 
<div id="map_canvas"></div>

來源

2016-03-03 23:50:56 geocodezip

謝謝。我非常感謝幫助。 –

谷歌地圖的路徑編碼能夠一維陣列，而不是二維陣列（我的意思是陣列<陣列>是不可能的）。

但繪製一個有孔的多邊形需要兩個維數組。（你可能知道）

所以代碼應該是這樣的：

var exteriorBoundary = google.maps.geometry.encoding.decode("<encoded polyline string>"; 
var hole = google.maps.geometry.encoding.decode("<another encoded polyline string>"; 

var polygon = new google.maps.Polygon({ 
    paths: [exteriorBoundary, hole], 
    map: map, 
    ... 
});

來源

2016-03-03 22:02:17 wf9a5m75

使用編碼多段線的多邊形中的孔

回答

相關問題