2017-07-13 1 views
0

Ich initiierte meine Google Maps mit jQuery, und mit der neuesten Version von Google Maps. Versuch, in WordPress mit jQuery Version 1.12.4 zu implementieren (als WP-Core verwendet dies). Ich folge dem Google Maps' Polygon with Hole. Aber wann immer ich die Koordinaten zu meinen ändere, scheint es überhaupt nicht zu funktionieren. Die innerCoords schneiden sich nicht, sondern überlappen die outerCoords.Google Maps Polygon mit Loch funktioniert nicht, wenn Koordinaten geändert

Ich dachte zuerst es eine Frage des Landes sein könnte und Wasser, so zog ich meine coords zwischen Land und Wasser, aber das Problem weiterhin besteht. Ich dachte, dass meine Koordinaten lang sind, also minimierte ich sie .123 (3 Ziffern nach Punkt), aber das Problem bleibt bestehen.

Hier ist ein Fiddle für den gesamten Code:
https://jsfiddle.net/mayeenulislam/c884wy06/

Der betreffende Code ist wie folgt:

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)); 
} 

ich aus den beiden anderen Koordinaten kommentiert - die tatsächliche Bermuda-Dreieck, und einer von meine Ländereien - damit Sie den Code testen können. Ich dachte, es könnte die Zoom-Stufe sein, die zählt, aber ich habe mit dem Bermuda-Dreieck eine inspiziert - sie arbeitet auf jeder Zoomstufe.

Was mache ich falsch?

Antwort

0

Ich habe einfach die Reihenfolge der inneren Koordinaten geändert und es hat funktioniert. Ändern Sie Ihre innerCoords mit den folgenden:

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

Vielen Dank. Das löst mein Problem, beantwortet aber die Frage nicht. 3 zufällige Punkte können leicht als im oder gegen den Uhrzeigersinn gezählt werden. Für mich sind diese zufälligen Punkte immer 1-2-3, können niemals 1-3-2 sein. Wo liege ich falsch? –

Verwandte Themen