Google Maps APIを使用してポリゴンを結合する

以下に示すように、私は2つのポリゴンを持っています。基本的にそれぞれの座標を持つ2つの三角形。参照：Google Maps APIを使用してポリゴンを結合する

function initialize() { 
 
    // Define the LatLng coordinates for the polygon's path. 
 
    var bounds = new google.maps.LatLngBounds(); 
 
    var i; 
 

 
    var polygonCoords = [ 
 
    new google.maps.LatLng(25.774252, -80.190262), 
 
    new google.maps.LatLng(18.466465, -66.118292), 
 
    new google.maps.LatLng(32.321384, -64.757370) 
 
    ]; 
 
    
 

 
    for (i = 0; i < polygonCoords.length; i++) { 
 
    bounds.extend(polygonCoords[i]); 
 
    } 
 

 
    var map = new google.maps.Map(document.getElementById("map_canvas2"), { 
 
    zoom: 4, 
 
    center: bounds.getCenter(), 
 
    mapTypeId: "roadmap" 
 
    }); 
 

 

 
    var triangle1 = new google.maps.Polygon({ 
 
    paths: polygonCoords, 
 
    strokeColor: '#0000ff', 
 
    strokeOpacity: 0.8, 
 
    strokeWeight: 2, 
 
    fillColor: '#0000ff', 
 
    fillOpacity: 0.35 
 
    }); 
 
    triangle1.setMap(map); 
 
    
 
    var polygonCoords2 = [ 
 
    new google.maps.LatLng(25.774252, -80.190262), 
 
    new google.maps.LatLng(18.466465, -66.118292), 
 
    new google.maps.LatLng(14.979063, -83.500871) 
 
    ]; 
 

 
    var triangule2 = new google.maps.Polygon({ 
 
    paths: polygonCoords2, 
 
    strokeColor: '#0000ff', 
 
    strokeOpacity: 0.8, 
 
    strokeWeight: 2, 
 
    fillColor: '#0000ff', 
 
    fillOpacity: 0.35 
 
    }); 
 
    triangule2.setMap(map); 
 
    
 
}

#map { 
 
    height: 100%; 
 
} 
 

 

 
/* Optional: Makes the sample page fill the window. */ 
 

 
html, 
 
body { 
 
    height: 100%; 
 
    margin: 0; 
 
    padding: 0; 
 
}

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js"></script> 
 

 
<body onload="initialize()"> 
 
    <div id="map_canvas2" style="height: 100vh; width:100vw"></div> 
 
</body>

私はリスクは、このように4つの側面または4点の座標で多角形を作り、両者の間の真ん中に表示されないように、2つの三角形をマージしたいと思います。これを行う最善の方法は何でしょうか？

出典

2017-07-21 Viana

でpaths: polygonCoords,を交換していることが予想されることにある座標1つに統合される（つまり、プエルトリコとフロリダのポイント）は、常に異なるポリラインの一部である同じ座標ですか？それは理にかなったことを望む –

おそらく、配列をマージして重複を削除できますか？何かのように：

var newPolygon = polygonCoords.concat(polygonCoords2);

そして、重複した座標を取り除く（私はthisポストからこのコードを取った）：

var sorted_arr = newPolygon.slice().sort(); // You can define the comparing function here. 
            // JS by default uses a crappy string compare. 
            // (we use slice to clone the array so the 
            // original array won't be modified) 
var results = []; 
for (var i = 0; i < newPolygon.length - 1; i++) { 
    if (sorted_arr[i + 1] == sorted_arr[i]) { 
     results.push(sorted_arr[i]); 
    } 
}

その後paths: results,

出典

2017-07-21 21:41:41 taurus

Google Maps APIを使用してポリゴンを結合する

答えて

関連する問題