Public
Edited
Oct 12, 2023
Insert cell
Insert cell
teams = {

const separator = d3.dsvFormat(',')
const object = separator.parse( await FileAttachment("premierleague1819.csv").text())
const teams = Array.from( new Set(object.map( (element) => element['HomeTeam'])).values() )
return teams.slice(0,5)
}
Insert cell
svg = {
const svg = d3.create('svg' )
.attr('width', 200)
.attr('height', 20)
.style('display', 'block');

return svg
}
Insert cell
svg.node()
Insert cell
svg.append('text')
.text("This is text")
.attr("x", 20)
.attr("y", 20);
Insert cell
// {

// const selection = svg.selectAll('.c')
// .data( teams )
// .join(
// enter => enter.append('circle')
// .attr('cx', (value, index) => { return 5+(index*12) })
// .attr('cy', 5)
// .attr('r', 5)
// .attr('fill', 'red')
// .attr('class', 'c'),
// // update => update,
// // exit => exit.remove()
// )

// }
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