Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Using containsLocation with a google.maps.Data.polygon

I have a google.maps.Data layer with a polygon feature:

state = new google.maps.Data();
state.loadGeoJson('static/geojson/ga_state.geojson', {
    idPropertyName: 'name'
});
state.setStyle({
    clickable: false,
    visible: false,
});
state.setMap(map);

Within this feature collection is a polygon representing the state of Georgia:

ga = state.getFeatureById('Georgia')

I can get the geometry of this feature:

gaGeom = ga.getGeometry()

But when I pass either of these objects and also the raw array to google.maps.geometry.polygon.containsFeature(), I get an error that the object does not contain the get() fuction:

google.maps.geometry.poly.containsLocation(p.getPosition(), ga)
Uncaught TypeError: b.get is not a function(…)

google.maps.geometry.poly.containsLocation(p.getPosition(), gaGeom)
Uncaught TypeError: b.get is not a function(…)

google.maps.geometry.poly.containsLocation(p.getPosition(), gaGeom.getArray())
Uncaught TypeError: b.get is not a function(…)

How can I get a google.maps.Data.Polygon to either convert to a google.maps.Polygon or to work with this function?

EDIT:

I have found a way to construct a google.maps.Polygon from a google.maps.Data.Polygon as:

//gaGeom is the feature.geometry from the data layer
poly = new google.maps.Polygon({paths:gaGeom.getAt(0).getArray()})

But surely there has to be a cleaner way to construct the google.maps.Polygon?

like image 671
camdenl Avatar asked Feb 08 '23 18:02

camdenl


1 Answers

The google.maps.geometry.poly.containsLocation method takes a point (a google.maps.LatLng) and a polygon (a google.maps.Polygon).

containsLocation(point:LatLng, polygon:Polygon)
Return Value: boolean Computes whether the given point lies inside the specified polygon.

  • ga = state.getFeatureById('Georgia') returns a "feature"
  • gaGeom = ga.getGeometry() returns a "Geometry"
  • gaGeom.getArray() returns an "Array" of LinearRings

None of which is a google.maps.Polygon. You can make a google.maps.Polygon from the Array (as I see you have discovered while I wrote this).

proof of concept

code:

function initialize() {
  var map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  var state = new google.maps.Data();
  var poly;
  state.addListener('addfeature', function(evt) {
    if (evt.feature.getId() == "Georgia") {
      var ga = state.getFeatureById('Georgia');
      var gaGeom = ga.getGeometry();
      //gaGeom is the feature.geometry from the data layer
      poly = new google.maps.Polygon({
        paths: gaGeom.getAt(0).getArray(),
        map: map,
        clickable: false
      });
    }
  });
  var infoWindow = new google.maps.InfoWindow();
  google.maps.event.addListener(map, 'click', function(evt) {
    infoWindow.setPosition(evt.latLng);
    if (google.maps.geometry.poly.containsLocation(evt.latLng, poly)) {
      infoWindow.setContent("INSIDE POLY<br>" + evt.latLng.toUrlValue(6));
    } else {
      infoWindow.setContent("OUTSIDE POLY<br>" + evt.latLng.toUrlValue(6));
    }
    infoWindow.open(map);
  });

  state.loadGeoJson("http://www.geocodezip.com/GeoJSON/gz_2010_us_040_00_500k.json.txt", {
    idPropertyName: 'NAME'
  });
  state.setStyle({
    clickable: false,
    visible: false,
  });
  state.setMap(map);

  var geocoder = new google.maps.Geocoder();
  geocoder.geocode({
    'address': "State of Georgia"
  }, function(results, status) {
    if (status === google.maps.GeocoderStatus.OK) {
      map.fitBounds(results[0].geometry.viewport);
    } else {
      alert('Geocode was not successful for the following reason: ' + status);
    }
  });
}
google.maps.event.addDomListener(window, "load", initialize);
like image 70
geocodezip Avatar answered Feb 13 '23 02:02

geocodezip