dc-leaflet legend feature (creates a static legend based on range of the data)

legend snipptets

function drawChoropleth(data,geojson) {
                choroChart = dc.leafletChoroplethChart("#choro-map .map")                
                  .dimension(regionDimension)
                  .group(avgRegionGroup)
                  .valueAccessor(function(p) { return p.value.average; })
                  .width(800)
                    .height(400)
                  .center([47.00, 2.00])
                  .zoom(5)
                  .geojson(geojson)                  
                  .colors(colorbrewer.YlGn[9]) //the colorbrewer palette of your choice
                  .colorAccessor(function(d,i) { return d.value.average; })
                  .featureKeyAccessor(function(feature) {                    
                    return feature.properties.name;
                  })
                  .renderPopup(true)
                  .popup(function(d,feature) {                    
                    return feature.properties.name+" : "+d.value.average;
                  });

                choroChart.on("preRender", function(chart) {
                    chart.colorDomain(d3.extent(chart.group().all(), chart.valueAccessor()));
                });
                choroChart.on("preRedraw", function(chart) {
                    //get eventRange upon page load before any charts have been clicked             
                    if (indexChart.filters().length == 0 && categoryChart.filters().length == 0
                        && datasetChart.filters().length == 0 && stackedYearChart.filters().length == 0
                        && seasonsChart.filters().length == 0)
                    {
                        eventRange = d3.extent(chart.group().all(), chart.valueAccessor());   
                        eventRange[0] = 0; //make min always 0
                        chart.colorDomain(eventRange);  
                    }
                });            
            }
            
  //dc-leaflet.js:
  var _legend = L.control({position: 'bottomleft'});
  var eventRange;
  var numCharts = 0;

  _legend.onAdd = function (map) {      
      this._div = L.DomUtil.create('div', 'info legend');
      this.update();      
      return this._div;
  };

  _legend.update = function () {    

    //**Dirty hack** Display legend only when all 6 dc charts are cycled through
    numCharts++;

    if (numCharts == 6) {
      minValue = choroChart.colorDomain()[0];
      maxValue = choroChart.colorDomain()[1];
      colorLength = choroChart.colors().range().length;
      delta = (maxValue - minValue)/colorLength; 
      palette = choroChart.colors().range(); 

      //define grades for legend colours
      //use equation defined in dc.js colorCalculator fn
      grades = [];
      grades[0] = minValue;
      for (var i= 1; i < colorLength; i++) {
        grades[i] = Math.round((0.5 + (i - 1)) * delta + minValue);
      }
      
      var div = L.DomUtil.create('div', 'info legend'),          
          labels = [];            

      // loop through our density intervals and generate a label with a colored square for each interval
      for (var i = 0; i < grades.length; i++) {
          this._div.innerHTML +=
              '<i style="background:' + palette[i] + '"></i> ' +
              grades[i] + (grades[i + 1] ? '&ndash;' + grades[i + 1] + '<br>' : '+');
      }
    }    
  };
  
   _chart.doRender = function() {
    _map = L.map(_chart.root().node(),_mapOptions);
    if (_defaultCenter && _defaultZoom)
      _map.setView(_chart.toLocArray(_defaultCenter), _defaultZoom);
      
    _chart.tiles()(_map);
    _chart.info().addTo(_map);
    _chart.legend().addTo(_map);
    _chart._postRender();
    
    return _chart.doRedraw();
  }
  
  _chart.legend = function(_) {
    if (!arguments.length) return _legend;
    _legend = _;
    return _chart;
  }
  
dc.leafletChoroplethChart = function(parent, chartGroup) {
  ...
  _chart.doRedraw = function() {
    _geojsonLayer.clearLayers();
    _dataMap=[];
    _chart.computeOrderedGroups().forEach(function (d,i) {          
      _dataMap[_chart.keyAccessor()(d)] = {'d':d,'i':i};
    });    
    _geojsonLayer.addData(_chart.geojson());

    _chart.legend().update();
  }
  
  ...
  
}