Different infowindow with each polygon

2,722 views
Skip to first unread message

Sareth

unread,
Feb 4, 2011, 4:08:47 AM2/4/11
to Google Maps JavaScript API v3
Sorry for my English.
Maybe somebody can help me.
I'm new in Javascript and it is my first job. I have this code:

function addpolygon(n11,n12,n21,n22,n31,n32,n41,n42,n51,n52,info){
var Coords = [
new google.maps.LatLng(n11,n12),
new google.maps.LatLng(n21,n22),
new google.maps.LatLng(n31,n32)];
if (n41 != "" && n42 != "") {
Coords.push(new google.maps.LatLng(n41,n42))}
if (n51 != "" && n52 != "") {
Coords.push(new google.maps.LatLng(n51,n52))}

NewPolygon = new google.maps.Polygon({
paths: Coords,
strokeColor: "#FF0000",
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: "#FF0000",
fillOpacity: 0.35
});

NewPolygon.setMap(map);

polygonsArray.push(NewPolygon);

// Add a listener for the click event
google.maps.event.addListener(NewPolygon, 'rightclick',
showInfo);

infowindow = new google.maps.InfoWindow();
infowindow.setContent(info);
}

function showInfo(event){
infowindow.setPosition(event.latLng);
infowindow.open(map);
}

function deletePolygons() {
if (polygonsArray) {
for (j in polygonsArray) {
polygonsArray[j].setMap(null);
}
polygonsArray.length = 0;
}
}

I call function "addpolygon" every time when want to create new
polygon with some coords and different info. I push polygons in array
to delete them in future. When I click on polygon, I have the same
infowindow for each polygon, what I must to do if I want to show
different info's with each polygon?

Paulo Fernandes

unread,
Feb 4, 2011, 8:44:20 AM2/4/11
to google-map...@googlegroups.com
Hi

Next time try to post a link, this is part of guidelines.

You need to define variables to each polygon that you want to display. 
For example:
var polygon1 = new google.maps.Polygon();
var polygon2 = new google.maps.Polygon();
var polygon3 = new google.maps.Polygon();

google.maps.event.addListener(polygon1, 'rightclick', showInfo1);
google.maps.event.addListener(polygon2, 'rightclick', showInfo2);
google.maps.event.addListener(polygon3, 'rightclick', showInfo3);


[]s

geoco...@gmail.com

unread,
Feb 4, 2011, 8:45:43 AM2/4/11
to Google Maps JavaScript API v3
On Feb 4, 1:08 am, Sareth <imbasar...@gmail.com> wrote:
> Sorry for my English.
> Maybe somebody can help me.
> I'm new in Javascript and it is my first job. I have this code:
>

READ THIS FIRST: Posting Guidelines
http://groups.google.com/group/google-maps-js-api-v3/t/2b3f101fd509919e

>
> I call function "addpolygon" every time when want to create new
> polygon with some coords and different info. I push polygons in array
> to delete them in future. When I click on polygon, I have the same
> infowindow for each polygon, what I must to do if I want to show
> different info's with each polygon?

Examples:
http://www.geocodezip.com/v3_polygon_example_clickable_squares.html
and
http://www.geocodezip.com/v3_polygon_exampleD.html
(the orange polygons are clickable)

-- Larry

Michael Oakley

unread,
Feb 4, 2011, 4:16:09 PM2/4/11
to google-map...@googlegroups.com
Hi.
I notice on your example (http://www.geocodezip.com/v3_polygon_example_clickable_squares.html) after you click on the middle polygon, you can't click on the small polygon. (at least while the middle polygon infowindow is open)  The small polygon seems to hide in the infowindow shadow.  Is there a way to disable the infowindow shadow? Or is there a way for the small polygon to still receive click events while hidden in an infowindow shadow?
Thanks,
Michael


geoco...@gmail.com

unread,
Feb 4, 2011, 4:26:33 PM2/4/11
to Google Maps JavaScript API v3
That is a general problem with the v3 API. Someone should probably
file an issue (if there isn't one already).

-- Larry

> Thanks,
> Michael

Sareth

unread,
Feb 5, 2011, 3:33:29 AM2/5/11
to Google Maps JavaScript API v3


On 4 фев, 15:44, Paulo Fernandes <paulofernande...@gmail.com> wrote:

> Next time try to post a link, this is part of guidelines.

About link, I develop program and integrate Google Maps into this
program, so here no any link.

> You need to define variables to each polygon that you want to display.
> For example:
> var polygon1 = new google.maps.Polygon();
> var polygon2 = new google.maps.Polygon();
> var polygon3 = new google.maps.Polygon();
>
>  google.maps.event.addListener(polygon1, 'rightclick', showInfo1);
>  google.maps.event.addListener(polygon2, 'rightclick', showInfo2);
>  google.maps.event.addListener(polygon3, 'rightclick', showInfo3);

I do not know how much there will be polygons, user can create any
number of polygons, anywhere he wants, so your method does not
suitable in this case.
But still thanks for your answer.

Sareth

unread,
Feb 5, 2011, 3:58:25 AM2/5/11
to Google Maps JavaScript API v3


On 4 фев, 15:45, "geocode...@gmail.com" <geocode...@gmail.com> wrote:

> Examples:http://www.geocodezip.com/v3_polygon_example_clickable_squares.html
> andhttp://www.geocodezip.com/v3_polygon_exampleD.html
> (the orange polygons are clickable)
>
>   -- Larry

Sorry, but can you explain me, what I must insert in my code, to do
the same in my map. I don't understand anything in this examples
because I novice in JavaScript and Google API v3

geoco...@gmail.com

unread,
Feb 5, 2011, 10:14:59 AM2/5/11
to Google Maps JavaScript API v3
I would suggest going through some javascript tutorials[1] then. It
might even be worth going through Mike Williams' tutorial for v2 of
the maps API[2], many of the javascript concepts are explained there,
and v2 will be easier for a novice to get working.

[1] http://www.google.com/search?q=javascript%20tutorials
[2] http://econym.org.uk/gmap/

-- Larry
Reply all
Reply to author
Forward
0 new messages