Skip to main content
SimilarExport ZIP
100%

Assignment 6 Bar Chart With Sequential Color Scale

✓ Published1🌍 Public
Aahuynh8@dons.usfca.edu
Last edited Mar 4, 2024
Created on Mar 4, 2024

This bar chart displays the average Attack Power of Grass-type Pokémon across different Generations, with bars colored using a sequential blue-green color scale to represent value magnitude. The visualization is rendered as an SVG using D3 v6, employing `d3.scaleBand` for the x-axis, `d3.scaleLinear` for the y-axis, and `d3.scaleSequential(d3.interpolateBuGn)` for color encoding. A color legend is added via the `d3.legendColor()` API. Data is loaded from a CSV file containing Generation and Grass attack averages.

AI-generated description

CS 360 Assignment 6 Bar Chart With Sequential Color Scale in D3 Annie Huynh

CSV URL: https://raw.githubusercontent.com/Ahuynh111/gist-practice/main/AttackAverages.csv

MIT Licensed

Similar vizzes

Loading thumbnail…

Assignment 6 Diverging Bar Chart

The chart compares average Attack and Defense stats across Pokémon generations using horizontal diverging bars, with Attack extending rightward and Defense leftward from a central axis. It employs D3 v6 to create an SVG visualization, using scaleBand for the categorical y-axis and separate linear scales for each metric. Bars are colored with a blue-red interpolated scale, and a d3-legend legend distinguishes the two directions. Data comes from a CSV file containing per-generation averages, rendered as static rectangles without animation.

Aahuynh8@dons.usfca.edu
89% match
Loading thumbnail…

Assignment 4 Bar Chart D3

This example presents a bar chart showing the average attack power of Fire-type Pokémon across different generations. The chart uses D3.js version 6 to load CSV data from a GitHub repository, scale the categorical and quantitative axes with `d3.scaleBand` and `d3.scaleLinear`, and render SVG rectangles. Axis ticks are generated via `d3.axisBottom` and `d3.axisLeft`, with labels applied directly to the SVG canvas.

Aahuynh8@dons.usfca.edu
86% match
Loading thumbnail…

Assignment 5 Line D3

This line chart visualizes the average attack power of Fire, Grass, Water, and Dark Pokémon types across multiple generations. The SVG rendering uses D3.js v6 with `d3.scalePoint` for the x-axis and `d3.scaleLinear` for the y-axis, plotting four colored line paths from CSV data loaded via `d3.csv`. The chart includes axes, a title, and a manual legend with colored rectangles.

Aahuynh8@dons.usfca.edu
84% match
Loading thumbnail…

A6 Qualitative Color Scale Scatterplot

This scatterplot shows the relationship between HP and Attack for Pokémon from Generations 1 through 5, using a qualitative color scale to distinguish the five generations. The visualization is rendered as an SVG using D3.js v7, with each generation assigned its own linear scale for both axes. The code groups the dataset by generation, then plots each group separately within the same chart, with axes and scales computed independently for each generation. The chart includes a legend and uses the Quicksand font for its title and labels.

AAllen Jake Polintan
81% match
Loading thumbnail…

Assignment 6 Scatter Plot With Color Scale

This scatter plot visualizes Pokémon HP against Speed, with each point colored by the Pokémon’s generation using a qualitative color scale. The chart shows a positive trend, where higher Speed often correlates with higher HP, while the color legend distinguishes all seven generations. The visualization is rendered as an SVG using D3.js v6, with linear scales for the axes and an ordinal scale for the color mapping. Data is loaded from a CSV file via `d3.csv`, and the legend is generated using the `d3-legend` library.

Aahuynh8@dons.usfca.edu
79% match
Loading thumbnail…

Activity6_Task3_Q3

A scatterplot displays Pokémon Attack versus Defense stats, with each point colored by the Pokémon's generation and a legend identifying each generation. The chart uses D3's scaleLinear, axisBottom, and axisLeft to build axes, alongside scaleOrdinal and schemeDark2 for categorical coloring. The SVG render includes a gray inner plot area, semi-transparent circles, and labeled axes for Attack and Defense, powered by data from data.csv.

PPothuguntla Pranitha
79% match
Loading thumbnail…

Assignment 5 Bubble Plot D3

This bubble plot visualizes Pokémon Attack and Defense stats, with HP mapped to bubble size and Generation mapped to color. It uses a D3.js v6 SVG scatter plot, scaling x and y axes with `d3.scaleLinear` and applying `d3.scaleOrdinal` for the categorical color scale. The underlying CSV data is fetched via `d3.csv` and drawn as circles using the standard D3 selection, enter, and append pattern, with axes generated by `d3.axisBottom` and `d3.axisLeft`.

Aahuynh8@dons.usfca.edu
79% match
Loading thumbnail…

Fork of Simple Bar Chart

This example displays the average total stats per generation for Pokémon, using data from a CSV file that includes attributes like HP, Attack, and Speed across all generations. The bar chart is built with D3 version 7, leveraging `scaleBand` and `scaleLinear` for positioning, and `axisLeft` for the y-axis. The visualization processes the raw dataset by grouping entries by generation and computing the mean Total value. It includes a gray inner rectangle to highlight the plot area, with axes and labels added via the `@curran/axis-labels` library.

Bbenclark.3rd@gmail.com
78% match