Skip to main content
SimilarExport ZIP
100%

CPSC 436V Week 3 - Axis Customization

✓ Published1🌍 Public
JJordan Chiu
Last edited Jan 23, 2020
Created on Jan 23, 2020

A horizontal bar chart displays ratings for ten games from 2019, sorted by name. The visualization uses D3 v5 with SVG rendering, employing `scaleLinear` for the rating axis and `scaleBand` for game names. Customized axes remove domain lines, use a `.2n` tick format, and add a label. Data loads from a CSV via `d3.csv`, and a title annotates the chart.

AI-generated description

This bar chart shows ratings of games I played in 2019. These aren't entirely accurate, but it's for a teaching thing so yeah.

MIT Licensed

Similar vizzes

Loading thumbnail…

CPSC 436V Week 2 - Bar Charts

This bar chart visualizes the ratings of ten games played in 2019, with each game’s name on the y-axis and its numeric rating on a linear scale from 0 to 10 on the x-axis. The data is loaded from a local CSV file and rendered as SVG rectangles using d3.scaleLinear, d3.scaleBand, d3.axisLeft, and d3.axisBottom. The chart encodes ratings via bar width and makes no additional modifications beyond the listed values.

JJordan Chiu
89% match
Loading thumbnail…

CPSC 436V Week 3 - Scatterplot

This scatterplot shows the ratings of ten games played in 2019, plotted along a horizontal rating axis against game names on the vertical axis. Each circle’s position encodes the game’s score, with all points using a uniform radius. The visualization uses D3 v5 APIs including `select`, `csv`, `scaleLinear`, `scalePoint`, `axisLeft`, and `axisBottom`. Data is loaded from a local CSV file (`data.csv`) and rendered as an SVG, with gridlines, tick labels, and axis labels styled via CSS.

JJordan Chiu
86% match
Loading thumbnail…

Customizing Axes

This visualization uses a horizontal bar chart to display the critic ratings of 25 popular video games, sourced from a Kaggle dataset. The chart emphasizes custom axis styling, including formatted tick labels on the x-axis, removed y-axis gridlines, and custom labels. The code uses D3 v5 APIs, including `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom`, to create the layout and custom axes. The SVG rendering is styled with a custom font and color scheme.

EEmma Schaale
82% match
Loading thumbnail…

Bar Chart

This bar chart displays game ratings for a collection of board games, sorted from highest to lowest rating. The chart uses an SVG rendering with D3 v6, employing `scaleLinear` for the x-axis and `scaleBand` for the y-axis, with `axisBottom` and `axisLeft` for ticks. Data is loaded from a CSV file via `csv()`, parsed, and sorted before rendering. The `wrap` function handles long game titles, while styled rectangles represent each rating value.

JJames DePaola
81% match
Loading thumbnail…

Customizing Axes

This example shows a horizontal bar chart of Alpha Team ratings by soldier role, with scores normalized from a CSV dataset. The visualization demonstrates customizing D3 axes by removing default domain lines and tick lines, adding an axis label, and applying custom styling via CSS. It uses d3.scaleLinear for the x-axis, d3.scaleBand for the y-axis, d3.axisBottom, and d3.axisLeft, with data loaded via d3.csv.

JJimmyDiGioia
78% match
Loading thumbnail…

Fork of Customizing Axes

This bar chart visualizes survey responses about why people play games, with average scores for categories like having fun, improving, winning, and all of them. The data comes from a CSV file loaded using `d3.csv`. The chart customizes D3 axes by removing domain lines, styling tick labels with CSS, and formatting tick values with `d3.format`. It uses `d3.scaleLinear` and `d3.scaleBand` for positioning, with `d3.axisBottom` and `d3.axisLeft` for rendering. Population data from the United Nations is referenced in the README but not used in the chart itself.

GGeorgeVard
78% match
Loading thumbnail…

Video Game Data Viz

A horizontal bar chart displays the top 25 video games by critic score, using D3 v5's `csv`, `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to map data from a Kaggle dataset. The SVG render positions steelblue rectangles whose widths correspond to each game’s numerical `Critic_Score`, with game names on the y-axis and score values on the x-axis. The code also prints a data summary, including row count, column count, and file size, alongside the first ten rows of the dataset.

EEmma Schaale
77% match
Loading thumbnail…

Customizing Axes

This horizontal bar chart displays the populations of ten countries, with bars sorted by value and customized axes. The chart uses d3.csv to load data, d3.scaleLinear and d3.scaleBand for positioning, and d3.axisLeft plus d3.axisBottom for ticks. Axis customization includes removing domain lines, adding gridlines via tickSize, and formatting tick labels with d3.format to abbreviate values (e.g., converting G to B). A title and axis label are appended as SVG text elements.

Mmagua
76% match