Published
Edited
Dec 12, 2019
Fork of Bubble Chart
2 stars
Insert cell
Insert cell
Insert cell
data = [{"name":"usdt","title":"Tether","group":"Z","value":2.21},{"name":"xtz","title":"Tezos","group":"Y","value":0.55},{"name":"eth","title":"Ethereum","group":"O","value":7.97},{"name":"bch","title":"Bitcoin Cash","group":"H","value":1.92},{"name":"bsv","title":"Bitcoin SV","group":"Y","value":0.88},{"name":"bnb","title":"Binance Coin","group":"S","value":1.14},{"name":"xmr","title":"Monero","group":"T","value":0.47},{"name":"xrp","title":"XRP","group":"O","value":4.88},{"name":"ada","title":"Cardano","group":"N","value":0.58},{"name":"leo","title":"LEO Token","group":"R","value":0.45},{"name":"ltc","title":"Litecoin","group":"U","value":1.43},{"name":"xlm","title":"Stellar","group":"Z","value":0.55},{"name":"btc","title":"Bitcoin","group":"V","value":66.7},{"name":"eos","title":"EOS","group":"C","value":1.26},{"name":"trx","title":"TRON","group":"S","value":0.48}]
Insert cell
pack = data => d3.pack()
.size([width - 2, height - 2])
.padding(3)
(d3.hierarchy({children: data})
.sum(d => d.value))
Insert cell
width = 400
Insert cell
height = width
Insert cell
format = d3.format(",d")
Insert cell
color = d3.scaleOrdinal(data.map(d => d.group), d3.schemeCategory10)
Insert cell
d3 = require("d3@5")
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more