Fork of Fork of Interactive Book Dataset

Fork of Interactive Book Dataset

This visualization presents a dual-chart view of a GoodReads book dataset. The left panel is a scatterplot of average rating versus page count, with each book as a point. The right panel is a horizontal bar chart displaying the top 10 most popular publishers, with bars sorted by the number of books published and positioned along the average rating axis. Hovering over any data point or bar highlights all books sharing that publisher’s identity across both charts, while a dropdown menu adjusts circle opacity. The implementation uses D3.js v6, including scales for linear and band layouts, SVG circle and rect elements, and mouse event listeners.

FFremont

96% match

Fork of Fork of Fork of Interactive Book Dataset

This interactive dashboard presents two linked views of the Top 10 Publishers dataset: a scatterplot of average rating against text review count for individual books, and a horizontal bar chart displaying the average rating for each prominent publisher. Hovering over a point or bar highlights all books sharing the same publisher, while a dropdown menu adjusts the scatterplot’s point opacity for clearer view. Built with React and D3 v6, the visualization uses d3.csv to load data, d3.scaleLinear for axes, and SVG circle and rect elements with mouseenter/mouseleave events for coordinated highlighting.

FFremont

94% match

Interactive Book Dataset

This visualization presents two linked views of a GoodReads dataset of the top 10 most popular publishers. The left panel is a scatterplot mapping book page count against average rating, while the right panel displays a horizontal bar chart of publishers sorted by rating. Both views use green circles and bars that turn red on hover via D3 mouse events. The code employs d3.scaleLinear, d3.scaleBand, d3.axisBottom, and d3.axisLeft, rendering with SVG. Data is loaded asynchronously from a remote CSV using d3.csv.

FFremont

91% match

Fork of Fork of Fork of CS416 Project_2

This visualization displays Amazon Top 50 Bestselling Books data from 2009 to 2019, showing average user ratings and book prices as bar charts that can be filtered by year using buttons. A scatterplot maps book reviews, user ratings, and prices, with tooltips revealing book titles and authors on hover. The D3.js v6 code uses `d3.scaleBand`, `d3.scaleLinear`, `d3.axisLeft`, and `d3.axisBottom` for the bar charts, while circles are positioned with `d3.scaleLog` for reviews and styled with `d3.scaleLinear` color scales. Data loads from CSV files hosted on GitHub, and interactions include animated tooltips styled with CSS.

84% match

Fork of Fork of Fork of ICE-6: Rendering Marks and Channels with React & D3

This visualization presents a horizontal bar chart of bestselling books information, ranking eleven items by population metrics from an external CSV dataset. Built with React and D3 v5, the chart uses `scaleBand` and `scaleLinear` to map categorical labels and numeric values to SVG rectangles. The code leverages React hooks (`useState`, `useEffect`) for data loading and rendering, while D3 utilities handle CSV parsing, scales, axes, and tick generation. The SVG output includes orange gridlines and labeled axes, with steelblue bars sized proportionally to each entry's population value.

AArefa Patwary

Fork of CS416 Project_2

This interactive D3.js visualization explores Amazon's Top 50 Bestselling Books from 2009 to 2019, combining two chart types. The main view displays a scatter plot, using `d3.scaleLog` for review counts, `d3.scaleLinear` for user ratings, and circle size encoding book price, with tooltips on mouseover. A second panel shows bar charts comparing yearly user ratings and prices using `d3.scaleBand` and `d3.scaleLinear`. Buttons trigger `init()` functions to filter the data by year, and a tooltip provides book details via CSS-styled divs.

Fork of Fork of Fork of CS416 Project_2

This example visualizes Amazon’s top 50 bestselling books from 2009–2019, offering two linked views: bar charts of average user ratings and book prices by year, plus a scatterplot for a selected year plotting reviews versus ratings with circle size encoding price. Users select a year via buttons, triggering an animated scatterplot update. The visualization uses D3.js v6 with SVG rendering, employing `d3.scaleBand`, `d3.scaleLinear`, and `d3.scaleLog` for axes, and a tooltip for interactive details. Data comes from a CSV hosted on GitHub.

Fork of Fork of CS416 Project_2

This visualization presents Amazon’s top 50 bestselling books from 2009 to 2019 using D3.js v6, rendering as SVG with interactive buttons. It shows two side-by-side bar charts tracking average user ratings and prices across years, colored by value, plus a scatterplot for a selected year where each circle represents a book, positioned by number of reviews and user rating, with size and color encoding price. Hovering reveals book name and author via an HTML tooltip, driven by D3 mouse events and scales like `d3.scaleBand`, `d3.scaleLinear`, and `d3.scaleLog`, using CSV data loaded from GitHub.