I am trying to assign a click event to each polygon stored in my array so
that when clicked the map zooms into the bounds of that specific polygon.
As it stands now, when clicked the map zoomes in to Kansas, which is not
near any of the polygons in my test file. The polygons display correctly,
the click event is just not working and I think it has something to do with
the way I am using the array to store them. Here is the function that reads
in the XML file and creates the polygons. If you have time please review it
and let me know if I have a coding error or if I am trying to use polygons
or the array in a manner that is not supported. Thank you.
function processXML(xmlDoc) {
if (!xmlDoc) {
alert("Invalid XML file");
return;
}
var regions = [];
var regionBounds = [];
var regionPolys = [];
var regionTransparentPolys = [];
var regionLabels = [];
regions = xmlDoc.documentElement.getElementsByTagName("region");
for (var i = 0; i < regions.length; i++) {
var points = [];
for (var j = 0; j < regions[i].childNodes.length; j++){
var vertex = new
GLatLng(parseFloat(regions[i].childNodes[j].getAttribute("lat")),
parseFloat(regions[i].childNodes[j].getAttribute("lng")));
points.push(vertex);
}
points.push(points[0]);
var regionID = regions[i].getAttribute("id")
regionBounds[regionID] = points;
}
for (var k in regionBounds){
if (regionBounds[k].length > 0 ){
var zone = new GPolygon(regionBounds[k], "#ff0000", 3, 0.5, "#0000ff",
0.3, {clickable:true});
var zoneTransparent = new GPolygon(regionBounds[k], "#ff0000", 3, 0.5,
"#0000ff", 0.0, {clickable:false});
regionPolys[k] = zone;
regionTransparentPolys[k] = zoneTransparent;
map.addOverlay(regionPolys[k]);
var labelAnchorPoint = zone.getBounds().getCenter();
regionLabels[k] = new ELabel(labelAnchorPoint, k , "style1");
regionLabels[k].pixelOffset=new GSize(-40,0);
map.addOverlay(regionLabels[k]);
var points2 = [];
points2 = regionBounds[k];
GEvent.addListener(regionPolys[k], "click", function(zoomToZone) {
var bounds = new GLatLngBounds();
for (var q = 0; q < points2.length; q++){
bounds.extend(points2[q])
}
map.setZoom(map.getBoundsZoomLevel(bounds));
// map.setCenter(bounds.getCenter());
map.removeOverlay(regionPolys[k]);
map.removeOverlay(regionLabels[k]);
// map.addOverlay(regionTransparentPolys[k]);
});
}
}
}
And here is sample of my XML file:
<regions>
<region id="EWA">
<vertex lat="49.001589" lng="-120.846486"/>
<vertex lat="45.197487" lng="-115.466422"/>
<vertex lat="45.380297" lng="-115.344087"/>
<vertex lat="44.600895" lng="-119.661347"/>
<vertex lat="44.728007" lng="-119.804428"/>
<vertex lat="44.590489" lng="-119.904091"/>
<vertex lat="44.65455" lng="-120.113484"/>
<vertex lat="44.757084" lng="-119.981409"/>
<vertex lat="44.881296" lng="-120.106073"/>
<vertex lat="46.385117" lng="-121.520241"/>
<vertex lat="46.384318" lng="-121.387264"/>
<vertex lat="48.490819" lng="-121.057011"/>
<vertex lat="48.727902" lng="-120.663121"/>
</region>
<region id="WWA">
<vertex lat="49.001589" lng="-120.846486"/>
<vertex lat="48.727902" lng="-120.663121"/>
<vertex lat="48.03042" lng="-121.169789"/>
<vertex lat="46.886935" lng="-121.50894"/>
<vertex lat="46.721443" lng="-121.386509"/>
<vertex lat="46.384318" lng="-121.387264"/>
<vertex lat="46.385117" lng="-121.520241"/>
<vertex lat="48.699724" lng="-123.241813"/>
<vertex lat="48.74414" lng="-122.713585"/>
<vertex lat="48.998458" lng="-122.744256"/>
</region>
<region id="WOR">
<vertex lat="43.956267" lng="-118.816799"/>
<vertex lat="43.885562" lng="-118.819398"/>
<vertex lat="42.325074" lng="-124.427834"/>
<vertex lat="42.603493" lng="-124.398159"/>
<vertex lat="42.839295" lng="-124.550751"/>
<vertex lat="43.521269" lng="-124.250568"/>
<vertex lat="46.181297" lng="-123.968193"/>
<vertex lat="45.714448" lng="-120.390145"/>
<vertex lat="45.736762" lng="-120.642546"/>
<vertex lat="45.513532" lng="-120.379624"/>
<vertex lat="45.455346" lng="-120.522396"/>
<vertex lat="44.776166" lng="-120.393372"/>
<vertex lat="44.752989" lng="-120.218379"/>
<vertex lat="44.728007" lng="-119.804428"/>
<vertex lat="44.600895" lng="-119.661347"/>
<vertex lat="43.960258" lng="-119.648179"/>
</region>
</regions>
Again, thanks for your time.
--
You received this message because you are subscribed to the Google Groups
"Google Maps JavaScript API v3" group.
To post to this group, send email to google-maps-js-api-v3@googlegroups.com.
To unsubscribe from this group, send email to
google-maps-js-api-v3+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-maps-js-api-v3?hl=en.
