Last active
May 26, 2022 15:19
-
-
Save helgasoft/a2d7b963e95b3c7ca5362cebe5d301b0 to your computer and use it in GitHub Desktop.
R | ECharts | map chart with tooltip percent formatter; map projection
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| cns <- countrycode::codelist$country.name.en | |
| cns <- data.frame( | |
| name = cns, | |
| value = round(runif(length(cns), 1, 100), 2) | |
| ) | |
| library(echarty) | |
| p <- ec.init(load= 'world') | |
| p$x$opts <- list( | |
| series= list(list( | |
| type= 'map', map= 'world', roam= TRUE, | |
| data= ec.data(cns, 'names') | |
| )), | |
| visualMap= list(type= 'continuous', calculable= TRUE, max= max(cns$value)), | |
| tooltip= list(formatter= '{b} {c}%') | |
| ) | |
| p |
Author
Author
map projection, inquiry by @XiangyunHuang
JS code partially (>90%) translated with demo(js2r) from ECharts source
state.data <- list(
list(name='Alabama', value=4822023),
list(name='Alaska', value=731449),
list(name='Arizona', value=6553255),
list(name='Arkansas', value=2949131),
list(name='California', value=38041430),
list(name='Colorado', value=5187582),
list(name='Connecticut', value=3590347),
list(name='Delaware', value=917092),
list(name='District of Columbia', value=632323),
list(name='Florida', value=19317568),
list(name='Georgia', value=9919945),
list(name='Hawaii', value=1392313),
list(name='Idaho', value=1595728),
list(name='Illinois', value=12875255),
list(name='Indiana', value=6537334),
list(name='Iowa', value=3074186),
list(name='Kansas', value=2885905),
list(name='Kentucky', value=4380415),
list(name='Louisiana', value=4601893),
list(name='Maine', value=1329192),
list(name='Maryland', value=5884563),
list(name='Massachusetts', value=6646144),
list(name='Michigan', value=9883360),
list(name='Minnesota', value=5379139),
list(name='Mississippi', value=2984926),
list(name='Missouri', value=6021988),
list(name='Montana', value=1005141),
list(name='Nebraska', value=1855525),
list(name='Nevada', value=2758931),
list(name='New Hampshire', value=1320718),
list(name='New Jersey', value=8864590),
list(name='New Mexico', value=2085538),
list(name='New York', value=19570261),
list(name='North Carolina', value=9752073),
list(name='North Dakota', value=699628),
list(name='Ohio', value=11544225),
list(name='Oklahoma', value=3814820),
list(name='Oregon', value=3899353),
list(name='Pennsylvania', value=12763536),
list(name='Rhode Island', value=1050292),
list(name='South Carolina', value=4723723),
list(name='South Dakota', value=833354),
list(name='Tennessee', value=6456243),
list(name='Texas', value=26059203),
list(name='Utah', value=2855287),
list(name='Vermont', value=626011),
list(name='Virginia', value=8185867),
list(name='Washington', value=6897012),
list(name='West Virginia', value=1855413),
list(name='Wisconsin', value=5726398),
list(name='Wyoming', value=576412),
list(name='Puerto Rico', value=3667084))
mapurl <- "https://fastly.jsdelivr.net/gh/apache/echarts-website@asf-site/examples/data/asset/geo/USA.json"
usaJson <- jsonlite::read_json(mapurl)
library(echarty)
p <- ec.init(js= 'projection = d3.geoAlbersUsa();') |>
ec.plugjs('https://fastly.jsdelivr.net/npm/d3-array') |>
ec.plugjs('https://fastly.jsdelivr.net/npm/d3-geo')
p$x$registerMap <- list(list(mapName='USA', geoJSON= usaJson))
p$x$opts <- list(
title= list(text= 'USA Population Estimates (2012)',
subtext= 'Data from www.census.gov',
sublink= 'http://www.census.gov/popest/data/datasets.html', left='right'),
tooltip= list(trigger='item', showDelay=0, transitionDuration=0.2),
visualMap= list(left= 'right',
min= 500000, max= 38000000,
inRange= list(color= list('#313695','#4575b4','#74add1','#abd9e9','#e0f3f8','#ffffbf','#fee090','#fdae61','#f46d43','#d73027','#a50026')),
text= list('High', 'Low'), calculable= TRUE),
toolbox= list(show=TRUE, left='left', top='top',
feature= list(dataView= list(readOnly=FALSE), restore= list(show=TRUE), saveAsImage= list(show=TRUE))),
series= list(list(
name= 'USA PopEstimates', type= 'map', map= 'USA', roam= TRUE,
projection= list(
project= htmlwidgets::JS('function(point) {return projection(point);}'),
unproject= htmlwidgets::JS('function(point) {return projection.invert(point);}')
),
#emphasis= list(label= list(show= TRUE)),
data= state.data
))
)
p
If you like this solution, please consider granting a Github star ⭐ to echarty.
Yeah, I like it! Thank you!
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment

echarty map chart with data from @tyluRp.