座標が変更されたときに穴の開いたGoogleマップのポリゴンがありません

Question

jQueryを使用し、Googleマップの最新バージョンを使用してGoogleマップを開始しました。 WordPressでjQueryバージョン1.12.4を実装しようとしています（WPコアがこれを使用しているため）。私はGoogle Maps' Polygon with Holeに従っています。しかし、私が座標を私のものに変更したときは、まったく動かないようです。 innerCoordsは交差していませんが、outerCoordsと重複しています。

私が最初にそれが土地と水の問題であると考えていたので、私は土地から水への私のCOORDSを移動しますが、問題が解決しません。私は指の長さが長いと思ったので、私は.123（ドットの後に3桁）を最小化しましたが、問題は解決しません。実際のバミューダトライアングル、との1 - 私は他の二つの座標をコメントアウト

var map_container = $('#map'); 

if (map_container.length > 0) { 
    var latitude = 23.900460, 
     longitude = 90.341313; 
/* 
// Uttara Center (Land) 
var latitude = 23.875029, 
    longitude = 90.381631; */ 

/* 
// Bermuda Center (Water) 
var latitude = 24.886, 
    longitude = -70.268; */ 

    function initialize(lat, lng) { 
    var locationLatLng = { 
     lat: lat, 
     lng: lng 
     }, 
     mapCanvas = document.getElementById('map'), 
     mapOptions = { 
     center: locationLatLng, 
     zoom: 15, //ideal 12 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     mapTypeControlOptions: { 
      style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR, 
      position: google.maps.ControlPosition.LEFT_BOTTOM 
     }, 
     //scrollwheel: false, 
     streetViewControl: false, 
     }; 

    map = new google.maps.Map(mapCanvas, mapOptions); 

    // Define the LatLng coordinates for the polygon's outer path. 
    var outerCoords = [ 
     {lat: 23.900, lng: 90.337}, 
     {lat: 23.905, lng: 90.343}, 
     {lat: 23.898, lng: 90.342} 

     /* 
     // Uttara, Dhaka Coordinates (Land) 
     {lat: 23.875007, lng: 90.370270}, 
     {lat: 23.880893, lng: 90.383404}, 
     {lat: 23.875634, lng: 90.380571}*/ 

     /* 
     // Bermuda Triangle (Water) 
     {lat: 25.774, lng: -80.190}, 
     {lat: 18.466, lng: -66.118}, 
     {lat: 32.321, lng: -64.757}*/ 
    ]; 

    // Define the LatLng coordinates for the polygon's inner path. 
    // Note that the points forming the inner path are wound in the 
    // opposite direction to those in the outer path, to form the hole. 
    var innerCoords = [ 
     {lat: 23.899, lng: 90.341}, 
     {lat: 23.900, lng: 90.342}, 
     {lat: 23.898, lng: 90.342} 

     /* 
     // Uttara, Dhaka Coordinates (Land) 
     {lat: 23.877067, lng: 90.377367}, 
     {lat: 23.878000, lng: 90.378438}, 
     {lat: 23.876833, lng: 90.378591}*/ 

     /* 
     // Bermuda Triangle (Water) 
     {lat: 28.745, lng: -70.579}, 
     {lat: 29.570, lng: -67.514}, 
     {lat: 27.339, lng: -66.668}*/ 
    ]; 

    // Construct the polygon, including both paths. 
    var coverage = new google.maps.Polygon({ 
     paths: [outerCoords, innerCoords], 
     strokeColor: '#FFC107', 
     strokeOpacity: 0.8, 
     strokeWeight: 2, 
     fillColor: '#FFC107', 
     fillOpacity: 0.35 
    }); 

    coverage.setMap(map); 
    } 

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

：
は https://jsfiddle.net/mayeenulislam/c884wy06/

問題のコードは次のとおりです。ここでは

は、全体のコードのためのフィドルですあなたのコードをテストできるようにしてください重要なズームレベルになると思っていましたが、バミューダトライアングルで検査しました。これはズームレベルで動作しています。

私は間違っていますか？

Answer 1

私は単に内部座標の順序を変更して機能しました。あなたのinnerCoordsは、次のように変更します。

 var innerCoords = [ { 
     lat: 23.900156, 
     lng: 90.342533 
    },{ 
     lat: 23.899989, 
     lng: 90.341664 
    }, { 
     lat: 23.898037, 
     lng: 90.342983 
    } 

Answer 2

が、最近それについてのポストに答え、それはあなたの座標の順序についてのすべてです：

SO Post on coordinates order