Published
Edited
Feb 21, 2022
Insert cell
Insert cell
Insert cell
movies = await FileAttachment("top_movies_voters.csv").csv({typed: true})
Insert cell
Insert cell
Inputs.table(movies, {})
Insert cell
Insert cell
Plot.dot(movies, {x: "year", y: "rank"}).plot()
Insert cell
Insert cell
// Start your code on the next line...
Plot.dot(movies, {x: "rank", y: "metascore"}).plot()
Insert cell
Insert cell
// Notice the options included .... {marginLeft: 300, width: width, x:{ticks: 8}}
Plot.barX(movies, {x: "budget", y: "title"}).plot({marginLeft: 300, width: width, x:{ticks: 8}});
Insert cell
Insert cell
// Start your code on the next line...
Plot.barX(movies, {x: "worldwide_gross_income", y: "title"}).plot({marginLeft: 300, width: width, x:{ticks: 8}});
Insert cell
Insert cell
Plot.rectY(movies, Plot.binX({y: "count"}, {x: "avg_vote"})).plot({y:{grid:true}})
Insert cell
Insert cell
// Start your code on the next line...
Plot.rectY(movies, Plot.binX({y: "count"}, {x: "year"})).plot({y:{grid:true}})
Insert cell
Insert cell
// This is helper code to convert the dollar amounts from strings to numbers
{
movies.forEach(movie => {
movie.budget = String(movie.budget)
movie.budget = movie.budget.replace('$','')
movie.budget = movie.budget.replaceAll(',','')
movie.worldwide_gross_income = String(movie.worlwide_gross_income)
movie.worldwide_gross_income = movie.worldwide_gross_income.replace('$','')
movie.worldwide_gross_income = movie.worldwide_gross_income.replaceAll(',','')
});
return "Done converting dollar amounts...";
}
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