SveltR
A blogdown boilerplate for creating truly epic visualizations
This is a boilerplate for using blogdown (R Markdown x Hugo) as a static site generator and SvelteJS as your reactive app engine. This project is released under the MIT license. Please make sure you understand its implications and guarantees.
Enjoy!! 🦊
This page is the product of an R Markdown document and an embedded Svelte app. The <div id="tech-app"></div> HTML tag embedded in this page contains the “tech-app” id attribute which is a DOM element id that TestApp.svelte has been instructed to find in order to instantiate the interactive graphics above. To learn more about developing SvelteJS applications see https://svelte.dev/tutorial/basics. Markdown is a simple formatting syntax for authoring HTML, PDF, and MS Word documents. For more details on using R Markdown see http://rmarkdown.rstudio.com.
You can embed an R code chunk like this:
print(mean(1 : 5))## [1] 3Sys.getenv("R_HOME")## [1] "/usr/local/lib64/R"r_profiles <- c(file.path(Sys.getenv("R_HOME"), "etc", "Rprofile.site"),
file.path(Sys.getenv("R_HOME"), "etc", "Rprofile"),
file.path(Sys.getenv("R_HOME"), "library", "base", "R", "Rprofile") )
Filter(file.exists, r_profiles)## [1] "/usr/local/lib64/R/etc/Rprofile.site"
## [2] "/usr/local/lib64/R/library/base/R/Rprofile".libPaths()## [1] "/usr/local/lib64/R/library"Including Plots
You can also embed (static) plots, for example:
Note that the echo = FALSE parameter was added to the code chunk to prevent printing of the R code that generated the plot. Otherwise, the code chunk will be printed on the page, like this plotly example:
options(warn = -1)
if (!require("plotly")) {
install.packages(c("plotly"))
library(plotly)
}## Loading required package: plotly## Loading required package: ggplot2##
## Attaching package: 'plotly'## The following object is masked from 'package:ggplot2':
##
## last_plot## The following object is masked from 'package:stats':
##
## filter## The following object is masked from 'package:graphics':
##
## layoutfig <- plot_ly(midwest, x = ~percollege, color = ~state, type = "box")
figUse R’s geospatial packages to plot data on maps. For the following example, you will need to have installed the following native libraries on the host operating system: pandoc gdal geos proj udunits2:
## Loading required package: maptools## Loading required package: sp## Checking rgeos availability: TRUE## Loading required package: rgdal## rgdal: version: 1.2-20, (SVN revision 725)
## Geospatial Data Abstraction Library extensions to R successfully loaded
## Loaded GDAL runtime: GDAL 2.3.2, released 2018/09/21
## Path to GDAL shared files: /usr/share/gdal
## GDAL binary built with GEOS: TRUE
## Loaded PROJ.4 runtime: Rel. 5.2.0, September 15th, 2018, [PJ_VERSION: 520]
## Path to PROJ.4 shared files: (autodetected)
## Linking to sp version: 1.2-7## Loading required package: rgeos## rgeos version: 0.3-26, (SVN revision 560)
## GEOS runtime version: 3.7.1-CAPI-1.11.1 27a5e771
## Linking to sp version: 1.2-7
## Polygon checking: TRUE
## integer(0)Embedding JSON data in HTML
If the output target is HTML, R has some methods for turning R data into JavaScript or JSON data and printing the results within HTML tags:
head(mtcars)## mpg cyl disp hp drat wt qsec vs am gear carb
## Mazda RX4 21.0 6 160 110 3.90 2.620 16.46 0 1 4 4
## Mazda RX4 Wag 21.0 6 160 110 3.90 2.875 17.02 0 1 4 4
## Datsun 710 22.8 4 108 93 3.85 2.320 18.61 1 1 4 1
## Hornet 4 Drive 21.4 6 258 110 3.08 3.215 19.44 1 0 3 1
## Hornet Sportabout 18.7 8 360 175 3.15 3.440 17.02 0 0 3 2
## Valiant 18.1 6 225 105 2.76 3.460 20.22 1 0 3 1<script> tag contained within a <div id="car_data_in_html">.
require(jsonlite)## Loading required package: jsonlite# print without tabs so R markdown will add it to the DOM tree of the resulting page
cat(paste('<div id="car_data_in_html"><script type="application/json">', toJSON(mtcars), '\n</script>\n</div>', sep=""))<div id="car_data_in_html">
<script type="application/json">[{"mpg":21,"cyl":6,"disp":160,"hp":110,"drat":3.9,"wt":2.62,"qsec":16.46,"vs":0,"am":1,"gear":4,"carb":4,"_row":"Mazda RX4"},{"mpg":21,"cyl":6,"disp":160,"hp":110,"drat":3.9,"wt":2.875,"qsec":17.02,"vs":0,"am":1,"gear":4,"carb":4,"_row":"Mazda RX4 Wag"},{"mpg":22.8,"cyl":4,"disp":108,"hp":93,"drat":3.85,"wt":2.32,"qsec":18.61,"vs":1,"am":1,"gear":4,"carb":1,"_row":"Datsun 710"},{"mpg":21.4,"cyl":6,"disp":258,"hp":110,"drat":3.08,"wt":3.215,"qsec":19.44,"vs":1,"am":0,"gear":3,"carb":1,"_row":"Hornet 4 Drive"},{"mpg":18.7,"cyl":8,"disp":360,"hp":175,"drat":3.15,"wt":3.44,"qsec":17.02,"vs":0,"am":0,"gear":3,"carb":2,"_row":"Hornet Sportabout"},{"mpg":18.1,"cyl":6,"disp":225,"hp":105,"drat":2.76,"wt":3.46,"qsec":20.22,"vs":1,"am":0,"gear":3,"carb":1,"_row":"Valiant"},{"mpg":14.3,"cyl":8,"disp":360,"hp":245,"drat":3.21,"wt":3.57,"qsec":15.84,"vs":0,"am":0,"gear":3,"carb":4,"_row":"Duster 360"},{"mpg":24.4,"cyl":4,"disp":146.7,"hp":62,"drat":3.69,"wt":3.19,"qsec":20,"vs":1,"am":0,"gear":4,"carb":2,"_row":"Merc 240D"},{"mpg":22.8,"cyl":4,"disp":140.8,"hp":95,"drat":3.92,"wt":3.15,"qsec":22.9,"vs":1,"am":0,"gear":4,"carb":2,"_row":"Merc 230"},{"mpg":19.2,"cyl":6,"disp":167.6,"hp":123,"drat":3.92,"wt":3.44,"qsec":18.3,"vs":1,"am":0,"gear":4,"carb":4,"_row":"Merc 280"},{"mpg":17.8,"cyl":6,"disp":167.6,"hp":123,"drat":3.92,"wt":3.44,"qsec":18.9,"vs":1,"am":0,"gear":4,"carb":4,"_row":"Merc 280C"},{"mpg":16.4,"cyl":8,"disp":275.8,"hp":180,"drat":3.07,"wt":4.07,"qsec":17.4,"vs":0,"am":0,"gear":3,"carb":3,"_row":"Merc 450SE"},{"mpg":17.3,"cyl":8,"disp":275.8,"hp":180,"drat":3.07,"wt":3.73,"qsec":17.6,"vs":0,"am":0,"gear":3,"carb":3,"_row":"Merc 450SL"},{"mpg":15.2,"cyl":8,"disp":275.8,"hp":180,"drat":3.07,"wt":3.78,"qsec":18,"vs":0,"am":0,"gear":3,"carb":3,"_row":"Merc 450SLC"},{"mpg":10.4,"cyl":8,"disp":472,"hp":205,"drat":2.93,"wt":5.25,"qsec":17.98,"vs":0,"am":0,"gear":3,"carb":4,"_row":"Cadillac Fleetwood"},{"mpg":10.4,"cyl":8,"disp":460,"hp":215,"drat":3,"wt":5.424,"qsec":17.82,"vs":0,"am":0,"gear":3,"carb":4,"_row":"Lincoln Continental"},{"mpg":14.7,"cyl":8,"disp":440,"hp":230,"drat":3.23,"wt":5.345,"qsec":17.42,"vs":0,"am":0,"gear":3,"carb":4,"_row":"Chrysler Imperial"},{"mpg":32.4,"cyl":4,"disp":78.7,"hp":66,"drat":4.08,"wt":2.2,"qsec":19.47,"vs":1,"am":1,"gear":4,"carb":1,"_row":"Fiat 128"},{"mpg":30.4,"cyl":4,"disp":75.7,"hp":52,"drat":4.93,"wt":1.615,"qsec":18.52,"vs":1,"am":1,"gear":4,"carb":2,"_row":"Honda Civic"},{"mpg":33.9,"cyl":4,"disp":71.1,"hp":65,"drat":4.22,"wt":1.835,"qsec":19.9,"vs":1,"am":1,"gear":4,"carb":1,"_row":"Toyota Corolla"},{"mpg":21.5,"cyl":4,"disp":120.1,"hp":97,"drat":3.7,"wt":2.465,"qsec":20.01,"vs":1,"am":0,"gear":3,"carb":1,"_row":"Toyota Corona"},{"mpg":15.5,"cyl":8,"disp":318,"hp":150,"drat":2.76,"wt":3.52,"qsec":16.87,"vs":0,"am":0,"gear":3,"carb":2,"_row":"Dodge Challenger"},{"mpg":15.2,"cyl":8,"disp":304,"hp":150,"drat":3.15,"wt":3.435,"qsec":17.3,"vs":0,"am":0,"gear":3,"carb":2,"_row":"AMC Javelin"},{"mpg":13.3,"cyl":8,"disp":350,"hp":245,"drat":3.73,"wt":3.84,"qsec":15.41,"vs":0,"am":0,"gear":3,"carb":4,"_row":"Camaro Z28"},{"mpg":19.2,"cyl":8,"disp":400,"hp":175,"drat":3.08,"wt":3.845,"qsec":17.05,"vs":0,"am":0,"gear":3,"carb":2,"_row":"Pontiac Firebird"},{"mpg":27.3,"cyl":4,"disp":79,"hp":66,"drat":4.08,"wt":1.935,"qsec":18.9,"vs":1,"am":1,"gear":4,"carb":1,"_row":"Fiat X1-9"},{"mpg":26,"cyl":4,"disp":120.3,"hp":91,"drat":4.43,"wt":2.14,"qsec":16.7,"vs":0,"am":1,"gear":5,"carb":2,"_row":"Porsche 914-2"},{"mpg":30.4,"cyl":4,"disp":95.1,"hp":113,"drat":3.77,"wt":1.513,"qsec":16.9,"vs":1,"am":1,"gear":5,"carb":2,"_row":"Lotus Europa"},{"mpg":15.8,"cyl":8,"disp":351,"hp":264,"drat":4.22,"wt":3.17,"qsec":14.5,"vs":0,"am":1,"gear":5,"carb":4,"_row":"Ford Pantera L"},{"mpg":19.7,"cyl":6,"disp":145,"hp":175,"drat":3.62,"wt":2.77,"qsec":15.5,"vs":0,"am":1,"gear":5,"carb":6,"_row":"Ferrari Dino"},{"mpg":15,"cyl":8,"disp":301,"hp":335,"drat":3.54,"wt":3.57,"qsec":14.6,"vs":0,"am":1,"gear":5,"carb":8,"_row":"Maserati Bora"},{"mpg":21.4,"cyl":4,"disp":121,"hp":109,"drat":4.11,"wt":2.78,"qsec":18.6,"vs":1,"am":1,"gear":4,"carb":2,"_row":"Volvo 142E"}]
</script>
</div>Note the specification of the type="application/json" attribute, which prevents the browser from evaluating the contents of the <script> tag as JavaScript (if that is intended) and allows some other code block to call:
<script>
var data = JSON.parse(document.getElementById('car_data_in_html').children[0].innerHTML);
</script>Run Python with Reticulate
It is also possible to include Python code chunks in R Markdown, by first loading the reticulate package (in R):
# Load reticulate package for running python
if (!require("reticulate")) {
install.packages("reticulate")
reticulate::conda_create(envname = "r-reticulate")
reticulate::conda_python(envname = "r-reticulate")
reticulate::use_condaenv(condaenv = "r-reticulate", required = TRUE)
reticulate::py_install("matplotlib")
} else {
reticulate::conda_list()
}## Loading required package: reticulate## name
## 1 r-reticulate
## python
## 1 /home/revlin/.local/share/r-miniconda/envs/r-reticulate/bin/pythonpy_sys <- reticulate::import("sys")
print(py_sys$path)## [1] ""
## [2] "/home/revlin/.local/share/r-miniconda/envs/r-reticulate/bin"
## [3] "/home/revlin/.local/share/r-miniconda/envs/r-reticulate/lib/python36.zip"
## [4] "/home/revlin/.local/share/r-miniconda/envs/r-reticulate/lib/python3.6"
## [5] "/home/revlin/.local/share/r-miniconda/envs/r-reticulate/lib/python3.6/lib-dynload"
## [6] "/home/revlin/.local/share/r-miniconda/envs/r-reticulate/lib/python3.6/site-packages"
## [7] "/usr/local/lib64/R/library/reticulate/python"cat(list.files(py_sys$path)[grepl("matplot", list.files(py_sys$path))])## matplotlib matplotlib-3.3.3-py3.6-nspkg.pth matplotlib-3.3.3.dist-info… and then writing the python code;
data = {"foo": {"bar": "baz"}}
string = "Reticulate"
for index, letter in enumerate(string):
print((letter, index))## ('R', 0)
## ('e', 1)
## ('t', 2)
## ('i', 3)
## ('c', 4)
## ('u', 5)
## ('l', 6)
## ('a', 7)
## ('t', 8)
## ('e', 9)import sys
sys.path## ['', '/home/revlin/.local/share/r-miniconda/envs/r-reticulate/bin', '/home/revlin/.local/share/r-miniconda/envs/r-reticulate/lib/python36.zip', '/home/revlin/.local/share/r-miniconda/envs/r-reticulate/lib/python3.6', '/home/revlin/.local/share/r-miniconda/envs/r-reticulate/lib/python3.6/lib-dynload', '/home/revlin/.local/share/r-miniconda/envs/r-reticulate/lib/python3.6/site-packages', '/usr/local/lib64/R/library/reticulate/python']try:
import matplotlib.pyplot as plt
import numpy as np
# %matplotlib inline
# %config InlineBackend.figure_format = 'svg'
t = np.linspace(0, 20, 500)
plt.plot(t, np.sin(t))
plt.show()
except Exception as e:
print(e)
