Agfdhyk

I'm working on a Google Maps Javascript API program and am having some trouble setting up arrays as I had intended.

Context:
When the map is initialized, a Geojson file is read and from its info a bunch of Markers (red pins) are created. Once created, these markers are then grouped into a Cluster. Also note that each of these entries has a ClientType which is 1 of ~6 strings such as 'Sales' or 'Utility'

Desire:
One variable for the Clusters, var mapClusters with the indecies as the ClientTypes. For example, mapClusters['Utility'] would return the one cluster, of ~6 in the array, which clusters the markers with ClientType=Utility.

I then want one more variable for the Markers, var mapMarkers. For example, mapMarkers['Sales'][3] would be the 4th marker in the Sales group. The order of objects in this 'sales' group does NOT matter.

Code:

var mapMarkers = [ ['Utility'], ['Court'], ['Sales'], ['Licensing'], ['Other'], ['Prospect'] ]; //2d array, ex: mapMarkers['Sales'][3]

var mapClusters = ; //1d array, ex: mapClusters['Utility']



....



( at the end of initMap() )

( for each entry in the GeoJson, generate var Marker for it and show on map. var clientType = the string value from the Geojson, such as 'Sales' )

mapMarkers[clientType].push(marker);



....



( after all markers have been generated, called for each Client Type )

mapClusters[clientType] = new MarkerCluster(...); //is null until first time this is called

Errors:
I am having trouble particularly with the "mapMarkers[clientType].push(marker)" and getting an error "Uncaught TypeError: Cannot read property 'push' of undefined". I also am not sure if mapClusters is being used the proper way either, but have not reached that part of the code at run-time to get any specific error.

Thanks for the help!

It seems you have a wrong initialization of the mapMarkers variable for the purposes you expect. The way you initialize that variable is generating an array of arrays (each with length equal to 1), i.e, every array has one string inside. As you can check on next example, where I show how to manipulate that structure:

var mapMarkers = [ ['Utility'], ['Court'], ['Sales'], ['Licensing'], ['Other'], ['Prospect'] ];



// Display the structure format:

console.log(mapMarkers);



// Display first array inside.

console.log("First array of mapMarkers: ", mapMarkers[0]);



// Display the first element of the first array.

console.log("First element inside first array: ", mapMarkers[0][0]);



// Push new element on first array.

mapMarkers[0].push("Hello");

console.log(mapMarkers);

For your particular goal, it is better to use the next initialization, that represents an object with properties, where each property contains an empty array (at initialization):

var mapMarkers = {'Utility': , 'Court': , 'Sales': , 'Licensing': , 'Other': , 'Prospect': };

Using the previous initialization, you can manipulate the structure the way you expect, as you can check on the next example:

var mapMarkers = {"Utility": , "Court": , "Sales": , "Licensing": , "Other": , "Prospect": };



// Display the structure format:

console.log(mapMarkers);



// Display the array saved on the "Utility" property.

console.log("Utility array: ", mapMarkers["Utility"]);



// Push new elements on "Sales" array.

mapMarkers["Sales"].push("Sale1");

mapMarkers["Sales"].push("Sale2");

mapMarkers["Sales"].push("Sale3");



// Display the "Sales" array.

console.log("Sales Array: ", mapMarkers["Sales"]);



// Display second element of "Sales" array.

console.log("Second element of Sales array: ", mapMarkers["Sales"][1]);



// Display the structure after adding elements:

console.log(mapMarkers);