mardi 30 mai 2017

(Ember-cli-g-maps) - Changing markers properties dinamically

This is my first question here, so I hope do it in the right way.

I'm trying to use ember-cli-g-maps in my project. The tool is great, but I'm having great dificulties in making one of my requirements work.

The chalange is: I create a set of markers setting the "draggable" property to false.

Template



Controller

for (let i=0; i< data.stops.length; i++)
{
    let stop = data.stops[i];
    markers.pushObject(
              {
                id: stop.id,  // Recommended
                lat: stop.coordinate[0],
                lng: stop.coordinate[1],
                draggable: false,
                icon: 
               });
  }

The markers are added correctly in the map.

But I want to make all markers draggable when the user press a button .

This is how I trying to do it.

enableMarkersDrag()
{
    for (var i=0; i<this.get('markers').length; i++)
    {
      this.get('markers')[i].draggable = true;
    }
},

This doesn't work immediatelly, but it does when I make some change in the "markers" array, adding or removing an item. It is a MuttableArray.

I understand why. This is because the observer is observing the array, not the properties inside the array.

But I believe that 'add' and 'remove' an item just to trigger the observer is not the right way to do it. Do you guys know the clean way of doing this?

Thanks in advance;




Aucun commentaire:

Enregistrer un commentaire