Dataset one
Let us do some processing in R and then view the result in the TGVE.
For this purpose we will use these R packages: edgebundle,
igraph and ggplot2 first. The following is
adapted from here.
library(igraph)
#>
#> Attaching package: 'igraph'
#> The following objects are masked from 'package:stats':
#>
#> decompose, spectrum
#> The following object is masked from 'package:base':
#>
#> union
library(edgebundle)
library(ggplot2)
library(ggraph)
# this environment variable would return true if run on
# github actions therefore, we can stop running TGVE if so.
# See GitHub docs: https://docs.github.com/en/actions/learn-github-actions/environment-variables
is.actions = Sys.getenv("GITHUB_ACTIONS") != ""
g = us_flights
xy = cbind(V(g)$longitude, V(g)$latitude)
verts = data.frame(x = V(g)$longitude, y = V(g)$latitude)
states = map_data("state")
pbundle = edge_bundle_path(g, xy, max_distortion = 12, weight_fac = 2, segments = 50)
# caching the heavy processing
# saveRDS(pbundle, "vignettes/pbundle.Rds")
# pbundle = readRDS("pbundle.Rds")
# edge list
el = get.edgelist(g)
colnames(el) = c("from", "to")
# get names of airports in verts
verts.with.names = data.frame(x = V(g)$longitude, y = V(g)$latitude, V(g)$name)
colnames(verts.with.names) = c("x", "y", "name")
# intermediate
from = verts.with.names[match(el[,"from"], verts.with.names$name), c("x", "y")]
to = verts.with.names[match(el[,"to"], verts.with.names$name), c("x", "y")]
# create matrix for sf
m = cbind(from, to)
library(sf)
#> Linking to GEOS 3.8.0, GDAL 3.0.4, PROJ 6.3.1; sf_use_s2() is TRUE
sfc = lapply(1:nrow(m), function(x) st_linestring(matrix(unlist(m[x,]), ncol = 2, byrow = TRUE)))
sfc = st_sfc(sfc, crs = 4326)So far, we have done some pre-processing of an igraph
object, created some lines, processed the lines using
edgebundle::edge_bundle_path (please see the
edgebundle package for details of the algorithm), and
created an sfcobject.
Static visualization
First, let us have a look at the lines in our sfc object
as they are using plot function:
plot(sfc)
Secondly, let us have a look at the bundled paths using
ggplot:
ggplot() +
geom_path(data = pbundle, aes(x, y, group = group),
col = "orange", size = 0.05) +
geom_path(data = pbundle, aes(x, y, group = group),
col = "white", size = 0.005) +
labs(title = "Edge-Path Bundling") +
ggraph::theme_graph(background = "black") +
theme(plot.title = element_text(color = "white"))
Interactive visualization
Using the TGVE we can embed an instance of the TGVE in the output of
a HTML rendered RMarkdown file. Please see the documentations of
knitr package for details of embedding HTML.
Let us first view the raw data (no bundling), we can build an
instance of the TGVE using tgver::setup. The package relies
on passing API variables using a URL to the TGVE instance:
library(tgver)
#>
#> Attaching package: 'tgver'
#> The following object is masked from 'package:utils':
#>
#> help
#> The following object is masked from 'package:base':
#>
#> version
p = getwd() # for reproducibilty this needs to be a persistent location
tp = file.path(p, "tgve")
unlink(tp, recursive = TRUE)
# some random line width
# df = data.frame(lw=runif(length(sfc), min=1, max=5))
run_tgve = function(layerName="line") {
setup(p)
sf = st_as_sf(sfc)
p = explore_sf(sf, static = TRUE, path = tp)
knitr::include_url(file.path(p, "index.html"))
}
img_or_warning = function(img.url) {
if(!curl::has_internet()) {
warning("Rmd was rendered with no connection!")
} else {
paste0("<img src='", img.url, "' />")
}
}
if(!is.actions) {
run_tgve()
} else {
img_or_warning("https://user-images.githubusercontent.com/408568/144712831-7d2aec72-0af4-4ca9-b2e0-2316d7533753.png")
}
#> A TGVE instance has been created at: /tmp/RtmpzKYLmF/Rbuildc02973306c430/tgver/vignettes/tgve
#> Attempting to browse TGVE from: /tmp/RtmpzKYLmF/Rbuildc02973306c430/tgver/vignettes/tgveAs of version 1.4.0 release of the npm package, the TGVE
has a simple filter built in for lines. This is designed to only work
with a line layer where clicking on a line would filter out
all other lines that are not originating from the source of the line
clicked. In future versions, this could be a much richer set of
functionalists for filtering “features” such as paths, boundaries etc.
Indeed, the column filters built into the TGVE could also be improved
and become more sophisticated.
The TGVE basic “click to filter” of lines from an origin-destination
data.
Notice, that as the package is hosted on GitHub and rely
on actions to run the package checks, we have checks to decide whether
this Rmd renders the TGVE instance on your local machine or not. If you
are reading this Rmd on GitHub, chances are you cannot see the TGVE
instance. You may have to open the output of the rendered Rmd on a
browser tab to see the TGVE instances.
Let us see how the bundled data looks on the TGVE, we need to use the
path layer for now, as the TGVE can still do with more
advanced layer detection in future:
# convert the pbundle into sf
sfc = lapply(1:length(unique(pbundle$group)), function(x) st_linestring(matrix(unlist(pbundle[pbundle$group == x, 1:2]), ncol = 2)))
sfc = st_sfc(sfc, crs = 4326)
# plot(sfc)
p = file.path(p, "edge-tgve")
tp = file.path(p, "tgve")
unlink(tp, recursive = TRUE)
if(!is.actions) {
run_tgve(layerName = "path")
} else {
img_or_warning("https://user-images.githubusercontent.com/408568/144713110-245cf94e-826d-4525-bc48-ac7c97220c71.png")
}
#> A TGVE instance has been created at: /tmp/RtmpzKYLmF/Rbuildc02973306c430/tgver/vignettes/edge-tgve/tgve
#> Attempting to browse TGVE from: /tmp/RtmpzKYLmF/Rbuildc02973306c430/tgver/vignettes/edge-tgve/tgveNotice again, if you are reading this vignette on GitHub, you will not see the interactive result but a screenshot of the final result. Also, if you like to clean up after running this Rmarkdown document, then:
unlink(file.path(getwd(), "tgve"), recursive = TRUE)
unlink(file.path(getwd(), "edge-tgve"), recursive = TRUE)