allow markers to be given custom data

[aesnyder]

Not sure if this is best posted on SO but, I'd like to be able to add custom data to my markers for use in the calulator method in the clusterOptions.

My markers which are passed to the 'models' attribute of the 'markers' directive look something like this:

[ {
   coords:
    latitude: 71. 3434,
    longitude: 51.234234,
   dollars: 100
}, 
 {
   coords:
    latitude: 61. 34,
    longitude: 31.244,
   dollars: 200
}]

The problem is that I think that angular-google-maps strips off the extra data from the each of the models, so in the calculator method I cannot access the dollars attribute.

clusterOptions:
  calculator: (markers, styles) ->
    # cannot access markers[0].dollars 

Here is where I instantiate the directive, if that helps:

google-map(
  center='map.center'
  zoom='map.zoom'
  events='map.events'
  control='map.control'
  draggable='true'
  options='map.options'
)
  markers(
    models='markers'
    coords="'coords'"
    icon="'icon'"
    options="'options'"
    doCluster="true"
    clusterOptions='map.clusterOptions'
  )

The reason for this is that for the app I'm working on we'd like to have the clusters sized by/and the text to show the dollars associated with the models in the cluster.

I tried diving into the codebase but couldn't find exactly where the models are reconstructed into google maps marker objects as I suspect this is where we would want to pass any additional values on.

Thoughts?

[nmccready]

I think you didn't complete your thought. :P

[aesnyder]

I'm writing it out now :) thanks!

[aesnyder]

Okay @nmccready, I think I got it all out there :dancer:

[nmccready]

We should'nt be modifying your model at all. If we are it is unintended.

As for:

clusterOptions:
  calculator: (markers, styles) ->
    # cannot access markers[0].dollars 

Is markers a gMarker or a real model object? Again the scope of the problem is very hard to consume it would be easier if you could produce the same issue in a plunkr.

[aesnyder]

I hear you on the plunkr, I'll try to have one whipped up by tomorrow.

At this point:

markers(
    models='markers'

markers is just an array of objects with a coords property and a dollars property,

at this point (I do no modification)

clusterOptions:
  calculator: (markers, styles) ->
    # cannot access markers[0].dollars 

markers appears to be a gMarker without the dollars property

[nmccready]

Right but how does calculator hook in? This is a custom function right?

[aesnyder]

Ah, no its part of the google-maps-clusterer api

[nmccready]

Oh yeah looking at it now.

[aesnyder]

http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclustererplus/docs/reference.html

"The 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. A calculator may also return a title property that contains the text of the tooltip to be used for the cluster marker. If title is not defined, the tooltip is set to the value of the title property for the MarkerClusterer. The default value is MarkerClusterer.CALCULATOR."

[aesnyder]

Thanks for taking a look, and the quick response times :)

[nmccready]

Yeah to be safe we're using 2.1.1 so this url http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerclustererplus/2.1.1/docs/reference.html

[nmccready]

Ok in this case the markers you are receiving are definitely not models. They are raw gMarkers (what is really on the map) . There are a few internal hooks and options which angular-google-maps hooks (steps in the way) and reroutes the models along with the same callback. However in this case it is not being done yet.

[aesnyder]

Do you want to point me, I thought the raw g markers should have the associated model information along with them.

[aesnyder]

Will I ever learn to stop hitting enter?

Do you want to point me where this re-routing should take place? I'm happy to open a PR for ya.

Second note I thought that gMarkers should be able to have extra data associated -- so if we just push the entire model object into the gMarker we could avoid re-routing... no?

[nmccready]

Your quickest solution before angular-google-maps does anything. Is to make a hashmap or PropMap of your markers. So

#object properties are the id # of the marker
markerMap = 1: someMarker, 2: someMarker2

#or use agm PropMap
markerMap = new PropMap()

markerMap.put marker1["id"],  marker1
#or
markerMap.push marker1,  "id"

clusterOptions:
  calculator: (markers, styles) ->
    markers.forEach (m) ->
      markerMap[m.key].dollars

This is exactly how a lot of stuff is being handled in the plural directives.

[aesnyder]

Yeah I actually have this in play as a workaround!

[aesnyder]

But I really wouldn't mind contributing

[nmccready]

m.key should be there ... if it is not then we got issues.

[nmccready]

agm adds key to all gMarkers .. dangerous.. but hey its javascript

[nmccready]

So you would have to do something very similar to this. https://github.com/angular-ui/angular-google-maps/blob/master/src/coffee/directives/api/models/parent/markers-parent-model.coffee#L56-L62

[nmccready]

https://github.com/angular-ui/angular-google-maps/blob/master/src/coffee/directives/api/models/parent/markers-parent-model.coffee#L148-L158

[aesnyder]

sweet, I'll give it a go.

thanks a lot

[nmccready]

If your contributing can you work off develop? This would be a tough merge.

[aesnyder]

im not sure what you mean by that -- is develop a branch?

[nmccready]

yup develop branch. I'm working on getting 2.0.0 out. It is pretty stable, I use it for my work.

[nmccready]

if you wanted to reduce MarkersParentModel's foot print those cluster event handlers and options callbacks could probably be placed in events-helper.coffee

[aesnyder]

okay cool so develop branch is 2.0?

are there any api changes in 2.0 I should be aware of?

[nmccready]

yes

• the big one is everything is

https://github.com/angular-ui/angular-google-maps/blob/develop/example/example.html#L42-L90

Also you can use the GoogleMapsApi provider to load the google maps library async. In fact I suggest it. If you put it in html.. I am not entirely sure if google maps gets loaded twice or not. So to be sure use the async.

Provider - Your settings, to use weather .. version etc https://github.com/angular-ui/angular-google- maps/blob/develop/example/assets/scripts/controllers/example.js#L8-L14

Promise to let you know google maps is ready. Its argument is google.maps = maps . https://github.com/angular-ui/angular-google-maps/blob/develop/example/assets/scripts/controllers/example.js#L33-L40

[aesnyder]

:thumbsup:

[aesnyder]

@nmccready I noticed that calculator is now passing a prop map - i think this could be closed