R内のリーフレットにカスタム絶対位置を持つ凡例を作成するShiny

Question

リーフレットとシャイニーを使用してRでWebマップを作成しています。マップの右上にabsolutePanelがあります。これは、凡例の位置を正方形のコーナーではなく、absolutePanelの左側に配置したいと考えています。

リーフレットは、addLegendタグの「位置」属性の有効な入力として四隅の1つだけを受け入れます。以前はカスタムCSSタグをUIページのヘッダーに追加していましたが、凡例をフォーマットするためのCSSドキュメントを調べていますが、リーフレットで作成された凡例の位置を実際にオーバーライドするための適切なスクリプトを思いつくことができません。私が知る限り、位置は.leaflet .legendスクリプトのどこかに設定されています。

これは、Rスクリプトで生成されたWebドキュメントを変更するのではなく、これを解決することをお勧めします。この問題は他のどこでも解決されていません。私はこれのための解決策を調理するよりも、CSSと光沢に優れた人がいますか？前もって感謝します。

単純化し、再現可能なサンプルスクリプトは、伝説に絶対位置を割り当てることで（間違った）の試行で：

library(shiny) 
library(leaflet) 

data = data.frame(x = c(1,2,3), y = c(1,2,3)) 

ui <- fluidPage(
    tags$head(tags$style(
    type = "text/css", 
    "#controlPanel {background-color: rgba(255,255,255,0.8);", 
    ".leaflet .legend { 
    position = absolute; 
    top = 10px; 
    right = 100px;}" 
)), 

    leafletOutput(outputId = "map", width="100%"), 
    absolutePanel(top = 10, right = 10, height = 100, id = "controlPanel", 
       strong("Put Legend To the Left of Me")) 
) 

server <- function(session, input, output) { 

    output$map <- renderLeaflet({ 
    leaflet() %>% 
     addMarkers(data = data, lat = data$x, lng = data$y) %>% 
     addLegend(colors = data$x, labels = data$y, title = "Legend") 
    }) 
} 

shinyApp(ui, server) 

Answer 1

あり、あなたの配置を修正するためにいくつかの簡単なCSSですが、これは非常に構成されています。

最初に、スニペットのCSSが無効でした（最初のルールでは中括弧を使用しません）。しかし、それ自体の配置は、絶対位置が常にそうであるように、維持するのは難しいだろうと思います。ただし、マージンを調整して（適切な場合は上に、上の場合も同様に）対応するパネルを移動します。これは常にピクセル単位で行われることに注意してください。 controlPanelと凡例パネルは決して同じdivには含まれないので、自然なやり方で決して互いに調整することはありません。そのため、contentPanelに幅を固定して、重複が発生しないようにしてください。あなたは異なるフォントサイズを持っています。

library(shiny) 
library(leaflet) 

data = data.frame(x = c(1,2,3), y = c(1,2,3)) 

ui <- fluidPage(
    tags$head(tags$style(
    type = "text/css", 
    "#controlPanel {background-color: rgba(255,255,255,0.8);}", 
    ".leaflet-top.leaflet-right .leaflet-control { 
     margin-right: 210px; 
    }" 
)), 

    leafletOutput(outputId = "map", width="100%"), 
    absolutePanel(top = 10, right = 10, height = 100, width=210, id = "controlPanel", 
       strong("Put Legend To the Left of Me")) 
) 

server <- function(session, input, output) { 

    output$map <- renderLeaflet({ 
    leaflet() %>% 
     addMarkers(data = data, lat = data$x, lng = data$y) %>% 
     addLegend(colors = data$x, labels = data$y, title = "Legend") 
    }) 
} 

shinyApp(ui, server) 

ファンタスティック