htmlwidgets在html中并排出现?
假设我有两个HTMLWidgethtmlwidgets在html中并排出现?,html,r,r-markdown,htmlwidgets,Html,R,R Markdown,Htmlwidgets,假设我有两个HTMLWidget # Load energy projection data # Load energy projection data library(networkD3) URL <- paste0( "https://cdn.rawgit.com/christophergandrud/networkD3/", "master/JSONdata/energy.json") Energy <- jsonlite::fromJSON(U
# Load energy projection data
# Load energy projection data
library(networkD3)
URL <- paste0(
"https://cdn.rawgit.com/christophergandrud/networkD3/",
"master/JSONdata/energy.json")
Energy <- jsonlite::fromJSON(URL)
# Plot
sankeyNetwork(Links = Energy$links, Nodes = Energy$nodes, Source = "source",
Target = "target", Value = "value", NodeID = "name",
units = "TWh", fontSize = 12, nodeWidth = 30)
我想把它们并排放在html页面中。我该怎么做?我可以用iframe吗?其他的 有很多方法可以回答这个问题。通常,大小和位置会因编写
htmlwidget
的作者而异,因此您可能需要进行一些实验。如果您不打算使用带有网格助手的CSS
框架,最简单的方法是将每个htmlwidget
包装在tags$div()
中,然后使用CSS
。您可能还对RStudio提供的基于flexbox的全新仪表板包感兴趣
#负载能量投影数据
#负荷能量投影数据
图书馆(网络3)
URL HOLY COW此(flexdashboard)正是我需要的。泰肯特!!哈哈,我只是在想“我打赌timelyportfolio可以回答这个问题”,然后我遇到了这个答案。如果有人关心的话,我最近用Split.js做了另一个实验。这允许调整大小。我还应该注意这个用于HTMLWidget布局的优秀新包。
library(leaflet)
data(quakes)
# Show first 20 rows from the `quakes` dataset
leaflet(data = quakes[1:20,]) %>% addTiles() %>%
addMarkers(~long, ~lat, popup = ~as.character(mag))
# Load energy projection data
# Load energy projection data
library(networkD3)
URL <- paste0(
"https://cdn.rawgit.com/christophergandrud/networkD3/",
"master/JSONdata/energy.json")
Energy <- jsonlite::fromJSON(URL)
# Plot
sn <- sankeyNetwork(Links = Energy$links, Nodes = Energy$nodes, Source = "source",
Target = "target", Value = "value", NodeID = "name",
units = "TWh", fontSize = 12, nodeWidth = 30,
width = "100%")
library(leaflet)
data(quakes)
# Show first 20 rows from the `quakes` dataset
leaf <- leaflet(data = quakes[1:20,]) %>% addTiles() %>%
addMarkers(~long, ~lat, popup = ~as.character(mag))
library(htmltools)
browsable(
tagList(list(
tags$div(
style = 'width:50%;display:block;float:left;',
sn
),
tags$div(
style = 'width:50%;display:block;float:left;',
leaf
)
))
)