Dropping Custom Map Markers

[iacisme]

Hi;

Is there a way to reproduce this AwesomeIcon example in Leafmap?

Here is the image of the example in the AwesomeIcon:

I've tried to replicate this example in my project, using leafmap, but it doesn't produce the same behavior. It only outputs the most current marker added to the map. For example, I create one marker and the map output displays it. But, when I add another marker, the map displays that marker only, not both.

Here is an image of the output I get:

Here is the code I'm using to add markers to my base_map object:

Creating Nord Stream 1 Start Marker

# GPS Cordinates of the location
nord_stream_1_start_location = [60.54069235018092, 28.06686533323343] 

# Create an icon object
nordstream_1_start_icon = leafmap.ipyleaflet.AwesomeIcon(name = 'info-circle',
                                                         marker_color = 'darkblue',
                                                         icon_color = 'white',
                                                         spin = False
                                                         ) 

# Create a marker object
nord_stream_1_start_location_marker = leafmap.ipyleaflet.Marker(location = nord_stream_1_start_location,
                                                                title = "Nord Stream 1 Riser (Near Vyborg, Russia)",
                                                                draggable = False,
                                                                icon = nordstream_1_start_icon 
                                                               )

# Add marker to map
base_map.add_layer(nord_stream_1_start_location_marker)

# Create an HTML object that stores 
# a web link to additional details
# when using a pop-up
nord_stream_1_start_marker_pop_up = widgets.HTML()

# Web link
nord_stream_1_start_marker_pop_up.value = "<a href = https://en.wikipedia.org/wiki/Nord_Stream_1 > Nord Stream 1 Wikipedia </a>"

# Add pop_up to the marker
nord_stream_1_start_location_marker.popup = nord_stream_1_start_marker_pop_up

Creating Nord Stream 1 End Marker

# GPS Cordinates of the location
nord_stream_1_end_location = [54.15121427248367, 13.655603267939012]

# Create an icon object
nordstream_1_end_icon = leafmap.ipyleaflet.AwesomeIcon(name = 'info-circle',
                                                       marker_color = 'darkblue',
                                                       icon_color = 'white',
                                                       spin = False
                                                       ) 

# Create a marker object
nord_stream_1_end_location_marker = leafmap.ipyleaflet.Marker(location = nord_stream_1_end_location,
                                                              title = "Nord Stream 1 Riser (Near Lubim, Germany)",
                                                              draggable = False,
                                                              icon = nordstream_1_end_icon
                                                              )

# Add marker to map
base_map.add_layer(nord_stream_1_end_location_marker)

# Create an HTML object that stores 
# a web link to additional details
# when using a pop-up
nord_stream_1_end_marker_pop_up = widgets.HTML()

# Web link
nord_stream_1_end_marker_pop_up.value = "<a href = https://en.wikipedia.org/wiki/Nord_Stream_1 > Nord Stream 1 Wikipedia </a>"

# Add pop_up to the marker
nord_stream_1_end_location_marker.popup = nord_stream_1_end_marker_pop_up

When I add the first Map marker, it shows up at the right location on the map, but as soon as I add the second one, I lose the first map marker and it only shows the end location.

I've tested a modified version of this code to run in ipyleaflet and it works fine - meaning it shows both the start and end markers, so I know that's not the issue.

Is it possible to do the same thing leafmap?

Thank you, and Merry Christmas!

--Igor

[giswqs]

The default layer name would be 'Untitled'. The later layer with the same name will overwrite the previous. Specify the name parameter should resolve the issue.

from ipyleaflet import AwesomeIcon, Marker
from leafmap import Map

center = (38.91342738235981, -77.03912909142674)

icon1 = AwesomeIcon(
    name='bus',
    marker_color='red',
    icon_color='black',
    spin=False
)

marker1 = Marker(icon=icon1, location=(center[0], center[1] - 0.05), name='marker1')

icon2 = AwesomeIcon(
    name='gear',
    marker_color='green',
    icon_color='darkgreen',
    spin=True
)

marker2 = Marker(icon=icon2, location=(center[0], center[1] + 0.05), name='marker2')

m = Map(center=center, zoom=13)

m.add_layer(marker1)
m.add_layer(marker2)

m

[iacisme]

Wow.

Thank you very much for that little bit of information. It fixed my issue!

I appreciate your help.

Merry Christmas, and all the very best in this new year!

Cheers.

--Igor

[giswqs]

You might also be interested in this example: https://leafmap.org/notebooks/50_marker_cluster/

[rh-afk]

Hi @giswqs I just use the example above using your example data for world cities unfortunately there is error.

Actually I want to plot from my dataframe or csv file into the leafmap and when click the marker there are several information can be pop up and show up.

How we can get those ? kindly please advise.

thanks

[giswqs]

The input data must have a group column with values corresponding to costom icons.

If you simply want to plot data without custom icons, see https://leafmap.org/notebooks/34_add_points_from_xy/

[rh-afk]

Perfect, thanks @giswqs . One more question can I select which information can be displayed when clicked the marker? If we have many column in dataframe/csv file , pop up information will be all of that columns in that data.
For example:

I only want to display name and region when I click the marker

Thanks

[giswqs]

https://leafmap.org/leafmap/#leafmap.leafmap.Map.add_points_from_xy

[rh-afk]

Perfect , thanks @giswqs