Legend location in a DualMap

[Gustacro]

Please add a code sample or a nbviewer link, copy-pastable if possible

# Your code here
# Add Dual-basemap
m = folium.plugins.DualMap(location=target_city, zoom_start = 9, tiles= 'openstreetmap')

# layer definition
layer_1= folium.features.Choropleth(
    geo_data= gjson
    ,name= 'column_1'
    ,key_on='feature.properties.postcode'
    ,data= zipcodes_geom
    ,columns= ['postcode', 'column_1']
    ,fill_color='YlGnBu'
    ,highlight=True
    ,legend_name='column_1'
    )
# popup window
tooltip_1= folium.features.GeoJsonTooltip(['postcode', 'column_1'])
layer_1.geojson.add_child(tooltip_1) # add it to the layer

#===========================================================================
layer_2= folium.features.Choropleth(
    geo_data= gjson
    ,name= 'column_2'
    ,key_on='feature.properties.postcode'
    ,data= zipcodes_geom
    ,columns= ['postcode', 'column_2']
    ,fill_color='BuPu'
    ,highlight=True
    ,legend_name='column_2'
    )
# popup window
tooltip_2 = folium.features.GeoJsonTooltip(['postcode', 'column_2'])
layer_2.geojson.add_child(tooltip_2) # add to the layer
#=============================================================
# dual map
# fg_both = folium.FeatureGroup(name='postcode_both').add_to(m)
fg_1= folium.FeatureGroup(name='column_1').add_to(m.m1)
fg_2= folium.FeatureGroup(name='column_2').add_to(m.m2)

layer_1.geojson.add_to(fg_1)
layer_2.geojson.add_to(fg_2)

# adding figure 1 and 2 to the basemap
fg_1.add_to(m.m1)
fg_2.add_to(m.m2)
#===========================
# add Layer control to Dual basemapa
# add legend for layer 1
folium.LayerControl(collapsed=True).add_to(m)
colormap_1= cm.linear.YlGnBu_06.scale(0,180)
colormap_1= colormap_1.to_step(index=[0,30,60,90,120,150,180])
colormap_1.caption= 'column_1'
colormap_1.add_to(m.m1)
# add legend for layer 2
colormap_2= cm.linear.PuBu_06.scale(0,180)
colormap_2= colormap_2.to_step(index=[0,14,29,43,58,72,87])
colormap_2.caption= 'column_2'
colormap_2.add_to(m.m2)
#===========================
# display map
display(m)

Problem description

Creating a Dual Map with two different geojson:
At the moment of adding the legends to the basemap (m), if I add one legend and define where to locate it could be grid 1(m.m1) or grid 2(m.m2) "It Works fine", but if I add the second legend, they get stack one on top of other, no mater that I assigned them to a different grid.
Also, It's there a way to move the legend to a different position in the basemap?

Expected Output

Would be that each grid of the Dual Map (basemap) contain one geojson and one legend.

Output of folium.__version__

0.8.3

[Conengmo]

Hi @Gustacro, thanks for bringing this to our attention. The DualMap plugin is not entirely robust and has some quirks, such as this one apparently. I don't know of an immediate way to solve this. If you have the time, help looking into this is welcome. Otherwise I suppose we should accept that having color legends is unsupported behavior for the DualMap plugin, until someone has time to look into this.

[Conengmo]

@Gustacro I just remembered I made a change to the DualMap plugin that hasn't been released yet. Could you perhaps install folium from our git master branch and see if that solves your issue?

[Gustacro]

@Conengmo , I'm still getting the same result with folium version 0.9.1+14.gf05f3ce
Any ideas? maybe something to fix in my code?

Paste my code here

#Add Dual-basemap
m = folium.plugins.DualMap(location=target_city, zoom_start = 9, tiles= 'openstreetmap')

#layer definition
layer_1= folium.features.Choropleth(
geo_data= gjson
,name= 'dualMap'
,threshold_scale= threshold_col2
,key_on='feature.properties.postcode'
,data= zipcodes_geom
,columns= ['col1', 'col2']
,fill_color='YlGnBu'
,highlight=True
,legend_name='col2'
,reset=True
)
#popup window
tooltip_1= folium.features.GeoJsonTooltip(['col1', 'col2'])
layer_1.geojson.add_child(tooltip_1) # add it to the layer
#==============================================
layer_2= folium.features.Choropleth(
geo_data= gjson
,name= 'col3'
,threshold_scale=threshold_col3
,key_on='feature.properties.postcode'
,data= zipcodes_geom
,columns= ['col1', 'col3']
,fill_color='BuPu'
,highlight=True
,legend_name='col3'
,reset=True
)
#popup window
tooltip_2 = folium.features.GeoJsonTooltip(['col1', 'col3'])
layer_2.geojson.add_child(tooltip_2) # add to the layer
#=======================================================
#dual map
#fg_both = folium.FeatureGroup(name='postcode_both').add_to(m)
fg_1= folium.FeatureGroup(name='col2').add_to(m.m1)
fg_2= folium.FeatureGroup(name='col3').add_to(m.m2)

layer_1.geojson.add_to(fg_1)
layer_2.geojson.add_to(fg_2)

##dual map
fg_1.add_to(m.m1)
fg_2.add_to(m.m2)
#======================================
#add legend for layer 1
colormap_1= cm.linear.YlGnBu_06.scale(0,180)
colormap_1= colormap_1.to_step(index=[0,30,60,90,120,150,180])
colormap_1.caption= 'column_1'
colormap_1.add_to(m.m2)

#add legend for layer 2
colormap_2= cm.linear.PuBu_06.scale(0,180)
colormap_2= colormap_2.to_step(index=[0,14,29,43,58,72,87])
colormap_2.caption= 'column_2'
colormap_2.add_to(m.m1)

#=======================================
#Add layer control (layers widget) to the basemap
folium.LayerControl(collapsed=True).add_to(m)

#Add fullscreen widget
#Only shows the legend in one of the frames
folium.plugins.Fullscreen(
position='topleft',
title='Expand me',
title_cancel='Exit me',
force_separate_button=True
).add_to(m.m2)

#display map
display(m)