R表示内のリーフレットマップをR

Question

に組み込むRで作成したrevealjs_presentationにタイル付きのリーフレットマップを追加しようとしています。このマップはioslideまたはhtml形式で正しく表示されますが、revealjs_presentation形式では問題ありません（主な問題：allフォントがはるかに大きく、マップを選択するとポリゴンの周囲に奇妙なアーチファクトがあります）。マップは他の出力フォーマットでもうまく機能するので、私は、この問題は、revealjs_presentationとリーフレットの間にある種のCSS非互換性が関係していると考えています。

2組のコードを分離するために、htmlwidgetsを使用してリーフレットマップを保存しました。このマップはうまく見えますが、iframeなどを使用してこのローカルHTMLファイルをプレゼンテーション内に埋め込む方法がないようです。私がCSSのエキスパートではないので、これをどのように並べ替えるべきかについてのガイダンスはありがたいです。誰かが、R内のrevealjs_presentation形式で正しくレンダリングするポップアップを含むインタラクティブなリーフレットマップを作成した場合、そのコードの一部を見ていただければ幸いです。何が価値があるために、リーフレットマップコードは次のとおりです。

leaflet(x) %>% 
addPolygons(popup = popup, weight = 0.7, fillColor = ~pal(quintf), 
      color = 'white', fillOpacity = 1, opacity = 1, 
      smoothFactor = 0.8) %>% 

addLegend(pal = pal, values = x$quintf, title = "CXI Activity", 
     position = 'bottom right') 

このファイルが正しく保存されます（以下の例のコード）が、iframe内にそれを参照して編んだhtmlファイルの自己完結型の自然を壊します。

saveWidget(m, file="map.html") 

Answer 1

あなたがすでに推測しているように、特大のフォントの問題を修正するには、カスタムCSSを少し含める必要があります。ポップアップのフォントとマップの凡例を修正したいとします。まず、新しいテキストファイルを開き、次を追加します。

.reveal section .leaflet-popup-content { 
    font: 20px; 
} 

.reveal section .leaflet-control { 
    font: 24px; 
} 

必要に応じて相対的なフォントサイズを調整します。あなたのRMarkdownファイルと同じディレクトリ内にファイルをleafletfont.css（またはそれを呼びたいもの）として保存します。

あなたが今やらなければならないことは、プレゼンテーションのフロントうちに新しいCSSファイルへの呼び出しを追加します：

--- 
title: "Habits" 
author: John Doe 
date: March 22, 2005 
output: 
    revealjs::revealjs_presentation 
    css: leafletfont.css 
--- 

あなたのフォントが適切なサイズでなければなりません。

P.S. ".leaflet-popup-content"と ".leaflet-control" CSSセレクタの使い方を知りましたか？マップの関連要素を右クリックすると（つまり、ChromeブラウザでHTMLにレンダリングされた場合）、[Inspect]が選択されます。