niszetの日記

細かい情報を載せていくブログ

Rのleafletパッケージで生成したmapにJavaScriptで制御するための方法

SOは何でも載ってるなぁ…

動的に扱いたいページを作成したいが、ShinyはShinyServerなどを準備できない、公開等もしたくないようなケースに、生成したleafletの地図にJavaScriptで触りたい場合がある。ほとんどないと思うけど、ある。

普通のやり方では出来ないため(elementIdを指定してもダメだった)、調べたら出てきた。

stackoverflow.com

この記事によれば、leafletのオブジェクトをhtmlwidgets::onRender に渡して、下記のようにすれば、JavaScript側からはmapとしてアクセス出来るとのこと。

output$map <- renderLeaflet({
    leaflet() %>%
        addProviderTiles("CartoDB.Positron") %>%
        htmlwidgets::onRender("
            function(el,x) {
                map = this;
            }
        ")
})

実際、

 <script language="javascript" type="text/javascript">
        function OnLinkClick() {
            map.setView([48.45653, 8.90068], 8);
            return false;
        }
  </script>
<a href="javascript:OnLinkClick();">ジャンプ</a>

のようなコードで、リンクをクリックするとRのleafletパッケージで生成した地図に対してsetViewが動作することを確認した。あとはこれに引数として座標を与えられれば任意の座標に飛ぶことが出来る。