With Google Maps API V3, determine if a marker is inside a KML Layer boundary

问题

Is there a way to determine if a marker has entered an area covered by a KmlLayer? My .kml is mostly made up of a <Polygon> with a bunch of coordinates that define the boundary.

There is an article I found that describes some similar to what I'm looking for, created using an overlay: http://www.paulmcilwaine.com/api/google-maps-detecting-markers-in-a-particular-boundary

That method has the advantage of using getBounds(), but I am looking for a way to do this with a KmlLayer boundary. KmlLayer doesn't seem to have a handy function like getBounds(), but I do have all the coordinates available to me in the KML file itself, so I'm thinking there's a way to create my own getBounds() function. I just need a way to determine if a marker (or a latlang) is inside those coordinates in the KML file.

Thanks for any ideas!

回答1:

There is no such function on KmlLayer. However, if you can extract the polygon boundaries, and create a polygon you can use the Geometry library of the Maps API to determine if the point lies inside the polygon: https://developers.google.com/maps/documentation/javascript/reference#poly

回答2:

I had a request to provide more detail on how I implemented this. You can see an example here: http://www.usinternet.com/fiber-info/map.php

I have a couple markers on the map, and I want to test if they are inside or outside a boundary. I set them up like this:

        var userLocation = new google.maps.LatLng(44.928633,-93.298919);    //Lyndale Park

        var wendysLocation = new google.maps.LatLng(44.948056,-93.282222);  //Wendy's on Lake St

        var userMarker = new google.maps.Marker({
            position: userLocation,
            map: map,
            title:"Your Location",
            draggable: true
        });

        var wendysMarker = new google.maps.Marker({
            position: wendysLocation,
            map: map,
            title:"Wendy's on Lake St",
            draggable: true
        });

To create the polygon you need something to read the KML file and build a set of coordinates, which can then be added to the polygon's paths: property. Unfortunately it doesn't seem like you can go from KML to Polygon just using the Google Maps API, but somebody correct me if I'm wrong!

var sector3PillburyPleasant = new google.maps.KmlLayer('http://usinternet.com/fiber-info/kml/Sector3Pillbury-Pleasant.kml', kmlOptions);
            sector3PillburyPleasant.setMap(map);

            var coordsSector3PillburyPleasant = [
                new google.maps.LatLng(44.91615269014508, -93.28382953316716),
                new google.maps.LatLng(44.91619137463104, -93.28120338511586), 
                new google.maps.LatLng(44.93046751403393, -93.28114057929436),
                new google.maps.LatLng(44.93046991974436, -93.28055243604703),
                new google.maps.LatLng(44.94815274527994, -93.28053962401711),
                new google.maps.LatLng(44.94815856171297, -93.28364017122617),
            ];

            var polySector3PillburyPleasant = new google.maps.Polygon({
                paths: coordsSector3PillburyPleasant,
                strokeColor: "#FFFFFF",
                strokeOpacity: 0.0,
                fillColor: "#FFFFFF",
                fillOpacity: 0.0
            });

I parsed the polygon's path down from the KML, the coordinates that make up the path were nested like this: (the last coordinate pair isn't needed if you are closing the path.)

<kml>
<Document>
    <Placemark>
        <Polygon>
            <tessellate>1</tessellate>
            <outerBoundaryIs>
                <LinearRing>
                    <coordinates>
                        -93.28382953316716,44.91615269014508,0 -93.28120338511586,44.91619137463104,0 -93.28114057929436,44.93046751403393,0 -93.28055243604703,44.93046991974436,0 -93.28053962401711,44.94815274527994,0 -93.28364017122617,44.94815856171297,0 -93.28382953316716,44.91615269014508,0 
                    </coordinates>
                </LinearRing>
            </outerBoundaryIs>
        </Polygon>
    </Placemark>
</Document>
</kml>

Then I test whether the marker's I've got are inside or outside of the polygon:

        var markerIn = google.maps.geometry.poly.containsLocation(wendysMarker.getPosition(), polySector3PillburyPleasant);

        var markerOut = google.maps.geometry.poly.containsLocation(userMarker.getPosition(), polySector3PillburyPleasant);

        console.log(markerIn);

        console.log(markerOut);

Then you've got yourself a true or false test if you are inside or outside the KML layer, though there was a bit of a detour to turn the KML layer into a Polygon.

回答3:

Here is a great answer for how to convert KML to Google Maps V3:

How to Check if a Point is in KML Polygon (GIS Shapefile)

use a third party parser like geoxml3 or geoxml-v3 to render your KML as native Google Maps API v3 polygons, then use the way you know how. example using geoxml3

The example given converts KML to Polygons, takes an address as input, geolocates it to get the lat/long and then determines what polygon the point is in:

http://www.geocodezip.com/geoxml3_test/v3_collection-map2e.html

回答4:

Now you can get the LatLngBoundary to your KML layer straight from the API

I supose this will only work on simple KML layers, but once you load your layer you can get the boundary with getDefaultViewport and use it's contains method to check if a LatLng object is within the boundary. This is a extremely easy way to check if a pair of coordinates fits into a KML layer.

来源：https://stackoverflow.com/questions/10323150/with-google-maps-api-v3-determine-if-a-marker-is-inside-a-kml-layer-boundary

标签

google-maps-api-3

gis

kml