Published
Edited
Sep 10, 2022
Data Viz Practice
url = "https://docs.google.com/spreadsheets/d/e/2PACX-1vRVpImj8iuMFkJdHBM3G7pTWDrcLRsuy6zcQcsubxPmYR8MWm2GKdB-ammAngqz7f1pRZFadurCnigu/pub?gid=0&single=true&output=csv"
chartDots = vl
.markCircle()
.encode(vl.y().fieldN("class"), vl.x().count())
.data(datawoNull)
.render({ renderer: "SVG" })
chartCountry = vl
.markBar()
.encode(vl.y().fieldN("country"), vl.x().count())
.data(datawoNullCountry)
.render({ renderer: "SVG" })
chartNolen = vl
.markBar()
.encode(vl.y().fieldN("Area"), vl.x().count())
.data(data.filter((d) => d.Area !== null))
.render()
datawoNull = data.filter((d) => d.class !== null)
datawoNullCountry = data.filter((d) => d.country !== null)
xScale = d3
.scaleLinear()
.domain([0, d3.max(groupsByClass, (d) => d[1].length)])
.range([0, width])
xScale(5)
yScale = d3.scaleLinear().domain([0, groupsByClass.length]).range([0, height])
height = 300
groupsByClass = d3.group(data, d => d.class)
data = d3.csv(url, d3.autoType)
d3 = require("d3@7")
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.
