Fork of Customizing Axes with books

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

Fork of Customizing Axes

A bar chart displays student scores from a CSV file, ranking each student on a vertical band scale against a linear grade axis. The visualization customizes axes by removing default domain lines, adding grid lines, and applying a formatting function that converts large numbers to abbreviated labels using D3's `format`. It uses `d3.csv`, `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to render SVG bars with styled ticks and titles.

TtreasurehunterAP

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.

Mmz4987

Fork of Customizing Axes

This example displays a horizontal bar chart of the populations of the ten most populous countries, using data from a CSV file. The chart ranks countries from largest to smallest, with bars colored steelblue and clear axis labels. It uses D3 v6 APIs such as `d3.csv`, `d3.scaleBand`, `d3.scaleLinear`, `d3.axisLeft`, and `d3.axisBottom`. The code customizes axes by removing domain lines, adding grid lines, and formatting tick labels to show values in billions.

MMajaha21

Fork of Customizing Axes

This bar chart displays the top 10 most populous countries using horizontal bars, with population values on the x-axis and country names on the y-axis. The visualization uses D3 v5 with `d3.csv` to load data, `scaleLinear` and `scaleBand` for scaling, and `axisBottom` and `axisLeft` for axes. Data originates from a CSV file, rendered as SVG rectangles with custom tick formatting that converts billions to "B" notation.

WWaffleSlayer69

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

Fork of Fork of Interactive Book Dataset

This visualization presents two linked charts from a GoodReads dataset: a scatterplot of book ratings counts against average ratings, and a horizontal bar chart of the top 10 publishers by average rating. Hovering over a dot or bar highlights all books from that publisher across both views. A dropdown menu adjusts the opacity of the scatterplot points. The piece is built with React and D3.js (v6), using SVG elements and transitions, with data parsed via `d3.csv`.

FFremont

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.

Mmz4987