Shiny-Leaflet custom marker icons

[Stéphane Doyen]

Hi all,

First off, congrats to the Rstudio team for this amazing Shiny!

I have been unsuccessfully trying to get custom icons to the markers following the structure here: https://github.com/jcheng5/leaflet-shiny/pull/14/files?short_path=04c6e90

My code goes like this: map$addMarker(51.5, -0.12,options=list(icon=list(iconUrl='image.png')).

I have tried to drop the image in the www folder of the app, the root folder of the app, use absolute path (e.g., /Users/xxx/Downloads/R/map) or even Html link through image hosting service.

The only workaround I've found was to directly overwrite the "marker-icon.png" in the library folder with my own image, but that's far less practical than the override feature explained in the link above.

Can someone help?

Thanks in advance!

[Stéphane Doyen]

Hi all,

Just bumping this topic as I still haven't found a solution to add custom markers to using the leaflet package for Shiny.

Thanks!

[Yihui Xie]

The new leaflet package https://github.com/rstudio/leaflet supports
this; see Section 3 in the documentation (I used the R logo as the
icon): http://rstudio.github.io/leaflet/ Note, however, the usage of
this package is completely different with the old one at
https://github.com/jcheng5/leaflet-shiny Please also note that your
custom icon image.png should probably be put under the www directory
of your app. I'm not 100% sure if it will work, but I guess it will.

Regards,
Yihui

[Vivek Patil]

Yihui, It does work, but if I have to change the icon based on the value of a variable (say 3 icons for 3 different levels of a variable), how would one tweak that JS code? Thanks.

--
You received this message because you are subscribed to the Google Groups "Shiny - Web Framework for R" group.
To unsubscribe from this group and stop receiving emails from it, send an email to shiny-discus...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/shiny-discuss/CANROs4fmQneyfidbjbs_KZf_MaJF52HkJ9AG32tWBsP0%2BD0nHQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

[Yihui Xie]

I guess you can compose the JavaScript object using R string functions
like paste(), e.g.

addMarkers(..., icon = JS(paste('L.icon({
iconUrl:', x, ',
iconSize: [40, 40]
})')))

where you decide what x is.

Regards,
Yihui

[Stéphane Doyen]

Thanks, I'll give it a try!

One thing perhaps would have to give the package an other name than "leaflet" so both https://github.com/jcheng5/leaflet-shiny and https://github.com/rstudio/leaflet could cohabit more easily?

[Vivek Patil]

I am glad you bought this up. I got lucky working on two different computers, but that was going to be a problem. Perhaps "leaflet-shiny" from Joe's repository and "leaflet" from rstudio's repo? 

On Wed, Jan 7, 2015 at 11:02 AM, Stéphane Doyen <stephan...@freemavens.com> wrote:

Thanks, I'll give it a try!

One thing perhaps would have to give the package an other name than "leaflet" so both https://github.com/jcheng5/leaflet-shiny and https://github.com/rstudio/leaflet could cohabit more easily?

--

You received this message because you are subscribed to the Google Groups "Shiny - Web Framework for R" group.
To unsubscribe from this group and stop receiving emails from it, send an email to shiny-discus...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/shiny-discuss/7f100409-4cca-4cda-82fa-e3319dc6d11c%40googlegroups.com.

[Yihui Xie]

Your code for the previous leaflet-shiny package should still work
with the new leaflet package, since we have also moved all the
functions from the old package. However, please keep in mind that the
old package is unlikely to be maintained any more, and the new package
may provide different functions to interact with Leaflet maps. For
now, the new package is good for maps that do not interact with shiny
(e.g. you just draw a map but do not change the map elements
dynamically using R), but this will be improved in future.

Regards,
Yihui

[Jane Yang]

Hi Yihui,

I echo Stephane's congratulations -- Shiny is a great tool! In combining the leaflet package with Shiny, I found an interesting quirk. When I plotted the code below outside of Shiny, the points all mapped correctly. However, after wrapping in Shiny, it seems that the lng and lat vectors were swapped, such that I needed to specify lng = ~lat, lat = ~long.

In addition, the custom marker no longer imports after being wrapped in Shiny. Is there perhaps something I've done with the JS() command below that is not compatible with Shiny? Again, run in RStudio's console, this code works nicely but once wrapped in shinyServer(), it stops behaving.

m <- leaflet(data = tab) %>% addTiles() %>% 

                    fitBounds(lng1 = long[1], lat1 = lat[1], # long and lat are both length 2 vectors; combined, they are essentially a bbox

                        lng2 = long[2], lat2 = lat[2]) %>%

                    addPolygons(lng = ~long, lat = ~lat,

                        fill = T, fillColor = d.fill(), fillOpacity = 0.7, 

                        stroke = T, color = "grey", weight = 2, opacity = 0.5)

                

                if (!is.null(input$layers)) {

                    if (grepl("oaf", input$layers)) {

                        m <- m %>% 

                            addMarkers(data = o, lng = ~long, lat = ~lat), # o is a separate dataframe with a set of coordinates

                                 icon = JS("L.icon({

                                     iconURL: 'http://upload.wikimedia.org/wikipedia/commons/a/a6/One_Acre_Fund_leaf.jpg',

                                     iconSize: [10, 10]})"))

                    }

                }

Thank you!
Jane

[Joe Cheng]

I hope this isn't an insultingly obvious suggestion--but is it possible that in the Shiny scenario, your "o" data object has its lng and lat data swapped?

I will let Yihui comment about the custom markers...

--

You received this message because you are subscribed to the Google Groups "Shiny - Web Framework for R" group.
To unsubscribe from this group and stop receiving emails from it, send an email to shiny-discus...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/shiny-discuss/c0579a93-e2a5-498c-b6ea-1dba2bdafed6%40googlegroups.com.

[Jane Yang]

Hi Joe,

Not insulting at all, but also not the case. I've checked and triple checked those variables and they are definitely correct.

Thanks,
Jane

Sent from my phone. Please excuse any typos.

[Joe Cheng]

I'm sorry but I'm not able to reproduce this issue (my test below). It would be super helpful if you could provide a small runnable example that demonstrates the problem.

library(leaflet)

library(shiny)

df <- data.frame(

  lat = 0,

  lng = 110:120

)

# static version

leaflet() %>% addTiles() %>% addMarkers(data = df, lat = ~lat, lng = ~lng)

# shiny version

shinyApp(

  ui = fluidPage(

    leafletOutput("map")

  ),

  server = function(input, output, session) {

    output$map <- renderLeaflet({

      leaflet() %>% addTiles() %>% addMarkers(data = df, lat = ~lat, lng = ~lng)

    })

  }

)

[Joe Cheng]

Great, thanks for the update. Glad you were able to work it out.

On Tue, Feb 3, 2015 at 4:52 AM, Jane Yang <jane.ju...@gmail.com> wrote:

Hi Joe,

I re-ran all of my data prep codes all over again and you actually were right. Somehow in all of my testing sessions, I'd had versions of the o dataset that had a corrected version of the lat/long designations, but didn't save that version of o to dataset I loaded into Shiny.

Thanks for your help! 

Jane

P.S. Oh -- by the way, the issue with the custom markers was that I had iconURL instead of iconUrl.