question reading MarkerOptions stored in array

62 views
Skip to first unread message

Johnny

unread,
Dec 17, 2011, 3:25:18 AM12/17/11
to Google Maps JavaScript API v3
I think it is better to start a new discussion as the nature of the
problem I have has changed.

I want to be able to control which set of markers to show by using
checkboxes. Therefore I load them into different arrays using
markerOptions, attempting to place them on the map and add listener to
them one by one. Not sure if that's the way it should be done but it
seems logical to me. Nevertheless, I get the markers placed on the
map, but when click on the marker it doesn't open right. Can't seem
to retrieve the url from the array. Here's short chunk of my code.
Please help.

For some reasons, it only works in IE, not FF, Chrome or Safari.
Another thing I need to solve...

http://www.strathcona-health.ca/vsb/maps/ourschoolsmap0.7.html

....
for (var i = 0; i < locations.length; i++) {
var school = locations[i];
var myLatLng = new google.maps.LatLng(school[1], school[2]);
var myMarkerOptions = {
position: myLatLng,
map: map,
icon: image,
shape: shape,
zIndex: school[5],
optimized: false,
url: '../schoolmap/school.aspx?s=' + school[3],
title: school[0] + ' at ' + school[4],
contentinfo: school[0]
};
// select which array to push data into
if (schoollevel == 'e') {
ElementaryMarkerArray.push(myMarkerOptions);
}
....
// set markers
function setMarkers(locations) {
for (i = 0; i < locations.length; i++) {
var marker = new google.maps.Marker(locations[i]);
// get
var url = $('#map_canvas').gmap('option', 'url');
google.maps.event.addListener(marker, 'click', function () {
window.open(url);
});
//
}; // end for statement
};// end function

Rossko

unread,
Dec 17, 2011, 5:24:14 AM12/17/11
to Google Maps JavaScript API v3
> I want to be able to control which set of markers to show by using
> checkboxes.  Therefore I load them into different arrays using
> markerOptions

as per your other thread, the usual way is to create and store the
marker objects themselves(not options) one time only. This allows you
to hide and show them ad infinitum, without recreating.
You can assign custom properties to marker objects, such as a url,
class or identifier, so long as you take care not to clash with an
existing Google property.

Chad Killingsworth

unread,
Dec 17, 2011, 11:46:39 AM12/17/11
to google-map...@googlegroups.com

You can assign custom properties to marker objects, such as a url,
class or identifier, so long as you take care not to clash with an
existing Google property.

Eek take care doing that. Those property names can and do change without notice. Something that used to work can suddenly break when you do this. It's much better to create a wrapper object to hold extra parameters when possible. 

Marcelo

unread,
Dec 17, 2011, 12:06:25 PM12/17/11
to Google Maps JavaScript API v3
On Dec 17, 9:46 am, Chad Killingsworth

<chadkillingswo...@missouristate.edu> wrote:
>
> Eek take care doing that. Those property names can and do change without
> notice. Something that used to work can suddenly break when you do this.
> It's much better to create a wrapper object to hold extra parameters when
> possible.

I add properties to API objects all the time. I feel quite confident
that Google are not about to come up with a property called
google.maps.Polygon.marcelo_index ;-)

--
Marcelo - http://maps.forum.nu
--

Johnny

unread,
Dec 17, 2011, 1:18:24 PM12/17/11
to Google Maps JavaScript API v3
In my previous implementation, I created the markers, add to array and
add listeners, one at a time. By the time all markers are placed on
the map, my arrays are all setup. All is good until I uncheck a
checkbox, click on a marker to go to another page, then return to the
map by click 'Back' on the browser. In that situation, the checkbox I
unchecked remain unchecked which means some markers should not be
shown, but all markers are created together with map initilization.
Link is as followed.

http://www.strathcona-health.ca/vsb/maps/ourschoolsmap0.7.1.html

Then I changed the scripts so that it checks the checkbox's checked
status before creating the markers. In the same scenario, the markers
will not be shown. But then they cannot be shown again because the
array for these markers is not filled.

http://www.strathcona-health.ca/vsb/maps/ourschoolsmap0.7.2.html

So I searched and tried to use MarkerOptions and store the markers
options in the arrays first and then show the markers later. I have
changed the property from url to MyUrl in my revised code. Same
issue. I used FireBug to confirm the value of MyUrl's are in the
array. But how do I get them out?

http://www.strathcona-health.ca/vsb/maps/ourschoolsmap0.7.html

I'm not sure if I'm going the wrong way by trying to work my way thru
js. Or there is something else in Map API that I should look into...
Any help would be appreciated. Many many thanks.

Johnny

unread,
Dec 17, 2011, 1:18:58 PM12/17/11
to Google Maps JavaScript API v3
What is wrapper object please?

On Dec 17, 8:46 am, Chad Killingsworth

Andrew Leach

unread,
Dec 17, 2011, 1:23:57 PM12/17/11
to google-map...@googlegroups.com
On 17 December 2011 18:18, Johnny <johnny...@gmail.com> wrote:
> In my previous implementation, I created the markers, add to array and
> add listeners, one at a time.  By the time all markers are placed on
> the map, my arrays are all setup.  All is good until I uncheck a
> checkbox, click on a marker to go to another page, then return to the
> map by click 'Back' on the browser.  In that situation, the checkbox I
> unchecked remain unchecked which means some markers should not be
> shown, but all markers are created together with map initilization.
> Link is as followed.
>
> http://www.strathcona-health.ca/vsb/maps/ourschoolsmap0.7.1.html
>
> Then I changed the scripts so that it checks the checkbox's checked
> status before creating the markers.  In the same scenario, the markers
> will not be shown.  But then they cannot be shown again because the
> array for these markers is not filled.
>
> http://www.strathcona-health.ca/vsb/maps/ourschoolsmap0.7.2.html

So: create all the markers and *then* use the checkboxes to display them.

Chad Killingsworth

unread,
Dec 17, 2011, 3:03:07 PM12/17/11
to google-map...@googlegroups.com
True. You are pretty safe doing that. In reality, I've never seen Closure-compiler renamed variables make it past two letters in length, so anything significantly longer than that is probably safe.

Chad Killingsworth

unread,
Dec 17, 2011, 3:04:14 PM12/17/11
to google-map...@googlegroups.com
Something like this:

var MyMarkerInfo = {
  marker: new google.maps.Marker(opt_opts),
  extraInfo: myExtraInformation
};

K Lo

unread,
Dec 18, 2011, 2:39:43 PM12/18/11
to Google Maps JavaScript API v3
That's the plan. So I gotten as far as putting all markers' options
in arrays and displaying them afterward. But in my test I can't get
some of the info from the array, such as MyUrl, and add listener to
the markers while they are being created. I must have this feature on
the markers.

On Dec 17, 10:23 am, Andrew Leach <andrew.leac...@gmail.com> wrote:

Rossko

unread,
Dec 18, 2011, 2:56:29 PM12/18/11
to Google Maps JavaScript API v3
> That's the plan.  So I gotten as far as putting all markers' options
> in arrays and displaying them afterward.

Don't do that. Save your markers in an array.

K Lo

unread,
Dec 18, 2011, 4:15:36 PM12/18/11
to Google Maps JavaScript API v3
Like so?

var MyMarkerInfo = {
marker: new google.maps.Marker(opt_opts),
extraInfo: myExtraInformation }


how do i place the markers on the map and add listener for
window.open(myURL) then?

Andrew Leach

unread,
Dec 18, 2011, 6:35:56 PM12/18/11
to google-map...@googlegroups.com
On 18 December 2011 21:15, K Lo <klo...@gmail.com> wrote:
> Like so?

No: an array of markers is just that, an array containing markers.

var markers;
var marker = new google.maps.Marker(...);
marker.myAttribute = myAttributeValue; // if you need this
markers.push(marker);

If you want to add a listener to each marker, use a closure:

var marker = createMarker(...); // probably global
marker.myAttribute = myAttributeValue; // if you need this
markers.push(marker);
...
function createMarker(...)
var marker=new google.maps.Marker(...); // local variable
google.maps.event.addListener(marker, 'click', function() { ... });
return marker;

Chad Killingsworth

unread,
Dec 18, 2011, 6:49:27 PM12/18/11
to google-map...@googlegroups.com, andrew....@gmail.com

marker.myAttribute = myAttributeValue; // if you need this

This behavior really shouldn't be recommended. In most cases it's just as easy to do:

var markerInfo = createMarker(...); // probably global
markerInfo.myAttribute = myAttributeValue; // if you need this
markers.push(markerInfo);

...
function createMarker(...) {
var marker=new google.maps.Marker(...); // local variable
google.maps.event.addListener(marker, 'click', function() { ... });
return {marker: marker};
}

This way custom properties won't ever collide with pre-existing marker properties which can and do change.

K Lo

unread,
Dec 20, 2011, 11:21:38 AM12/20/11
to Google Maps JavaScript API v3
... still working on it. will post update once I get somewhere...
Reply all
Reply to author
Forward
0 new messages