assembled with blockbuilder.org
I just had to try out DATALEGRAYA (really nice font with integrated graphics) from
with some real R data. I chose the very difficult-to-work-with ts
AirPassengers data and used quarterly values for the sparkline. Values are limited to integer [0,3]
so precision is limited.
# use the really nifty datalegreya
# from R data
library(htmltools)
library(pipeR)
head_tag <- tags$style(
"
@font-face {
font-family: 'Datalegreya-Dot';
src: url('http://cdn.rawgit.com/figs-lab/datalegreya/master/font-files/Datalegreya-Dot.otf');
font-weight: normal;
font-style: normal;
}
body {
-webkit-font-feature-settings: 'kern' on, 'liga' on, 'calt' on;
-moz-font-feature-settings: 'kern' on, 'liga' on, 'calt' on;
-webkit-font-feature-settings: 'kern' on, 'liga' on, 'calt' on;
-ms-font-feature-settings: 'kern' on, 'liga' on, 'calt' on;
font-feature-settings: 'kern' on, 'liga' on, 'calt' on;
font-variant-ligatures: common-ligatures discretionary-ligatures contextual;
}
body {
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
"
)
# replicate example from http://figs-lab.com/en/datalegreya
tagList(
tags$head(head_tag),
tags$h1(
style="font-family:'Datalegreya-Dot'; font-size:10em;",
"b|1i|3n|2g|2o|1"
)
) %>>%
browsable()
# now use with R data
library(scales)
# values should be integer between 0 and 3
air_scaled <- AirPassengers %>>%
rescale(from=c(0,max(AirPassengers)),to=c(0,3)) %>>%
round()
# years are four character so choose quarterly
# to fit nicely into the font
# ts are a pain in the ass
lapply(
seq.int(start(air_scaled)[1], end(air_scaled)[1]),
function(yr) {
vals <- window(air_scaled, yr, yr + 0.917)[c(3,6,9,12)]
yr %>>%
as.character() %>>%
strsplit("") %>>%
unlist() %>>%
{
sprintf(
'§%s%s[%sk%s[0%s]',
vals[1],
paste(.,vals,sep="|",collapse=""),
paste0(max(AirPassengers)),
paste0(rep(" ",4-nchar(max(AirPassengers))),collapse=""),
paste0(rep(" ",4),collapse="")
)
} %>>%
tags$span()
}
) %>>%
{
tagList(
tags$head(
head_tag,
tags$style("span {font-family:'Datalegreya-Dot'; font-size:10em;")
),
.
)
} %>>%
browsable()