Fork of Bar chart with a Sequential color scale

100%

Fork of Bar chart with a Sequential color scale

✓ Published0🌍 Public

Last edited Mar 1, 2024

Created on Mar 1, 2024

Forked from Bar chart with a Sequential color scale

This bar chart displays the average horsepower of car makes, sorted from lowest to highest, with a sequential color scale from light to dark red indicating increasing values. It uses D3 v6 with SVG rendering and includes interactive tooltips on hover, as well as axis labels and a legend. The code employs `d3.scaleBand` for the x-axis, `d3.scaleLinear` for the y-axis, and `d3.scaleQuantize` with `colorbrewer.Reds[7]` for the color mapping. Data is loaded from a CSV file and filtered to seven specific makes.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Bar chart with a Sequential color scale

A sequential bar chart displays average horsepower for seven automobile brands, sorted from lowest to highest, with color intensity increasing alongside value. The visualization uses D3 v6 to construct SVG rectangles scaled by `d3.scaleBand` and `d3.scaleLinear`, while a `d3.scaleQuantize` maps horsepower values to a seven-step reds palette from colorbrewer. Hovering reveals a tooltip with the exact value, and an interactive legend and axes are generated using `d3.legendColor` and axis components. Data comes from a CSV file provided in the accompanying `barchart.csv`.

JJim Luo

94% match

Loading thumbnail…

Fork of Bar chart with a Sequential color scale

This bar chart displays the average horsepower for seven car brands, sorted from lowest to highest, with each bar colored according to a sequential red color scale that encodes the horsepower value. The visualization loads data from a CSV file using d3.csv, binds it to SVG rectangles, and uses d3.scaleBand, d3.scaleLinear, and d3.scaleQuantize for positioning and color mapping. Interactive tooltips appear on mouseover, while d3.legendColor adds a legend, and axes are rendered with d3.axisBottom and d3.axisLeft.

SShishiraRudrabhatla

94% match

Loading thumbnail…

Fork of Bar chart with a Sequential color scale

This bar chart displays the average horsepower for seven car manufacturers, sorted from lowest to highest, with a sequential red color scale encoding the same value. The visualization is rendered in SVG using D3 v6 and the d3-legend plugin, with a quantized color scale from colorbrewer. Hovering over a bar triggers a tooltip with the exact horsepower value. The chart includes labeled axes, a legend, and animated opacity transitions on the tooltip.

Mmavercikalvin

93% match

Loading thumbnail…

Fork of Bar chart with a Sequential color scale New

This bar chart displays the average horsepower for seven car brands, sorted in ascending order and colored with a sequential red scale that maps horsepower values to color intensity. Built with D3 v6, the visualization uses `d3.scaleBand`, `d3.scaleLinear`, and `d3.scaleQuantize` to position and color the bars, while a tooltip appears on mouseover. The rendering is SVG-based, with axes, a color legend, and animation effects, drawing data from a CSV file named `barchart.csv`.

Pprateek

93% match

Loading thumbnail…

Fork of Fork of Bar chart with a Sequential color scale

A horizontal bar chart displays the average horsepower of seven car brands, from Volkswagen to Mercedes-AMG, sorted in ascending order. Bars use a sequential color scale from the ColorBrewer Reds palette, rendered as SVGs via D3 v6, with a hover tooltip showing exact values. The code loads data from a CSV, applies `d3.scaleBand`, `d3.scaleLinear`, and `d3.scaleQuantize`, and uses the d3-legend library to generate a color legend.

Mmavercikalvin

92% match

Loading thumbnail…

Bar chart with a Sequential color scale

This bar chart displays average engine horsepower for seven car manufacturers, sorted from lowest to highest, with bars colored according to a sequential red color scale that maps horsepower values to increasingly darker shades. A yellow tooltip appears on mouseover, showing the exact manufacturer and horsepower value. The visualization is built with D3 v6, using `scaleBand`, `scaleLinear`, and `scaleQuantize` for positioning and color encoding, along with the ColorBrewer Reds palette and the d3-legend library. Data is loaded from a CSV file via `d3.csv`, and rendered as SVG rectangles with interactive hover effects.

Pprateekvasi

89% match

Loading thumbnail…

Assignment 6 -- Bar chart with a Sequential color scale

A bar chart displays average engine horsepower for seven car makes, sorted from lowest to highest, with a sequential red color scale encoding the horsepower value. The chart uses D3 v6 with SVG rendering, including axes, a color legend, and a tooltip that shows the exact value on hover. The code reads data from a CSV file, applies a quantized color scale from the ColorBrewer library, and uses the d3-legend API to generate the legend.

Vvishusikka

88% match

Loading thumbnail…

Fork of bar-chart

This visualization displays a scatter plot of automobile data, plotting weight against horsepower with each data point represented as a fixed-radius circle. The chart also includes a title and axis labels, with grid lines extending across the plot area. The example uses D3 v5’s `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft` to construct the scales and axes, while data is loaded via `csv` from a remote URL. The code sorts the data, but the visible rendering focuses on the relationship between the two quantitative variables, with all circles sharing the same size.

RRoman Polulekh

83% match