Dynamic Legend

[dmoulton]

I am creating charts that get data from a service before they are built. That is also true of the data that builds the legend. I can't seem to create a legend unless I use static data at the top of my controller, before the service is called that gets the data. I also tried creating an empty legend and then populating it with the received data, but the legend remains blank. Am I going about this wrong?

[tombatossals]

Yess, the legend attribute is very basic, doesn't watch for changes to the data structure.

It could be easy to implement this, if you can provide me an example of how this must work we can code it together.

You can start your code based on this example: http://tombatossals.github.io/angular-leaflet-directive/examples/legend-example.html

[CloudNiner]

Not sure if you're actively working on this, but I have a similar use case for a project where a legend must be dynamically added/removed as layers are toggled on/off. The current legend directive does not support this as far as I can tell.

I'd be willing to work towards building a proof of concept for improving the legend control and would likely start with the use case I described above (as that's what we need). If you have any other ideas/suggestions for improvements let me know!

[cameronlowry]

If you bind legend to a scope variable it does render the new legend if you change the scope variable dynamically. The problem I faced was that the previous legend is not removed from the map. I managed to get around this issue by first removing the legend each time it needs to be re-rendered.

<leaflet ... legend="legend" ...></leaflet>

$scope.legend = {
    position: 'bottomleft'
};

$('.legend.leaflet-control').remove();

$scope.legend = {
    position: 'bottomleft',
    colors: [...],
    labels: [...]
};

Not at all ideal but it works.

[bpblanken]

I was having this issue as well. There was a cursory fix implemented (issue #454), but I was still having issues.

It is possible to enable deep object checking. It's a cost-intensive measure, but may be worthwhile if a dynamic legend is required in the project. Just set the third parameter to true:

leafletScope.$watch('legend', function(legend) {...},true) 

[tombatossals]

The legend functionality can be greatly improved, I agree. Don't have time now for this, but we accept PR.