Custom Icon in Cluster

[bed777]

Hi guys,
I want to set a custom icon for a cluster.
Now I explain myself better:

I have many marker...grouped in a cluster, and I want that the icon
shown corrisponds to the icon of the marker that have the date more
recent. (marker.date)

Any hints o suggest?

Maybe ClusterIcon.prototype.createCss = function (pos) {} ?


Thanks in advance.

Regards.

[Gary Little]

You should be able to do this by creating a custom calculator function
and a custom styles array (which includes urls of icons to use).

This function is not documented in the MarkerClusterer reference
(although it is in the MarkerClustererPlus reference). Here is the
description from the MarkerClustererPlus reference at
http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclustererplus/docs/reference.html

"The [calculator] function used to determine the text to be displayed
on a cluster marker and the index indicating which style to use for
the cluster marker. The input parameters for the function are (1) the
array of markers represented by a cluster marker and (2) the number of
cluster icon styles. It returns a ClusterIconInfo object. The default
calculator returns a text property which is the number of markers in
the cluster and an index property which is one higher than the lowest
integer such that 10^i exceeds the number of markers in the cluster,
or the size of the styles array, whichever is less. The styles array
element used has an index of index minus 1. For example, the default
calculator returns a text value of "125" and an index of 3 for a
cluster icon representing 125 markers so the element used in the
styles array is 2."


Gary

[bed777]

Yes, also I thought about rewriting it, but i have no idea on how can
I do it.
Can you add more hints? The function that i must rewrite is calculator
that receive two parameters?

Thanks in advance.

On Aug 18, 12:49 am, Gary Little <g...@luxcentral.com> wrote:
> You should be able to do this by creating a custom calculator function
> and a custom styles array (which includes urls of icons to use).
>
> This function is not documented in the MarkerClusterer reference
> (although it is in the MarkerClustererPlus reference). Here is the

> description from the MarkerClustererPlus reference athttp://google-maps-utility-library-v3.googlecode.com/svn/trunk/marker...

[Gary Little]

Here's the default calculator function that illustrates what such a
function looks like. You're going to have to examine the array of
markers to determine which one has the most recent date then set the
"index" result to the appropriate index (plus 1) in the styles array
that you provide. The use the setCalculator function to activate your
calculator.

/**
* The default function for determining the label text and style
* for a cluster icon.
*
* @param {Array.<google.maps.Marker>} markers The array of markers
represented by the cluster.
* @param {number} numStyles The number of marker styles available.
* @return {ClusterIconInfo} The information resource for the cluster.
* @constant
* @ignore
*/
function myCalculator(markers, numStyles) {
var index = 0;
var count = markers.length.toString();

var dv = count;
while (dv !== 0) {
dv = parseInt(dv / 10, 10);
index++;
}

index = Math.min(index, numStyles);
return {
text: count,
index: index
};
};

[bed777]

Thanks Gary I'll try soon. :)

[bed777]

Which is the best way to rewrite that function? I think edit the
function CALCULATOR in the source is not the better solution.
Must I append my custom function in mcOptions like that: ?

var mcOptions = {
CALCULATOR: function(markers, numStyles){ // my custom functions ? }
};


Thanks again.

[Gary Little]

No, you don't have to edit the source. Just define a function in the
usual way in your source code (with markers and numStyles parameters),
then call myClusterer.setCalculator(myCalculatorFunction) to tell the
clusterer to use it. You should also call myClusterer.repaint() after
changing the calculator.

If you're using MarkerClustererPlus you can also define the calculator
in your mcOptions as you've suggested (but the property name is lower
case), but keep in mind that this will not work if you are using the
original MarkerClusterer.

Gary

[bed777]

Thanks another.