Skip to main content
SimilarExport ZIP
100%

Fork of Webpage

✓ Published2🌍 Public
AArungopal Andalam
Last edited Apr 26, 2024
Created on Apr 26, 2024
Forked from Webpage

This example shows a stacked bar graph of the top 10 job titles by total salary, using data from a CSV file of data science salaries. Each bar represents a job title, colored via a categorical scale, with salary totals on the y-axis and rotated labels on the x-axis. The code uses `d3.csv` to load data, `d3.rollups` to aggregate salaries, and `d3.scaleBand` and `d3.scaleLinear` to set up the axes. It renders an SVG with `d3.axisBottom`, `d3.axisLeft`, and includes a legend built from the color scale.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Webpage

This example shows the top 10 job titles in a data science salary dataset, ranked by total salary in USD and displayed as a stacked bar graph. Each bar represents a single job title, with color-coded identity and hover effects that increase fill opacity. The visualization loads CSV data from a GitHub repository using `d3.csv`, aggregates salary sums with `d3.rollups`, and sorts/selects the top entries. It renders SVG rectangles scaled by `d3.scaleBand` and `d3.scaleLinear`, with axes via `d3.axisBottom` and `d3.axisLeft`, plus a legend built from the color scale.

KKiernan Nesslar
94% match
Loading thumbnail…

bar2

This example shows the top 10 job titles from a data science salaries dataset, ordered by total salary in descending order, with each bar colored according to its job title. The visualization aggregates salary values using `d3.rollups`, sorts them with `d3.descending`, and renders stacked bars as SVG rectangles with a legend. It uses D3 v7 scales (`scaleBand`, `scaleLinear`, `scaleOrdinal`), axes (`axisBottom`, `axisLeft`), and a categorical color scheme (`schemeCategory10`). Data is loaded asynchronously from a CSV file via `d3.csv`.

AArungopal Andalam
88% match
Loading thumbnail…

Barchat1

A stacked bar chart displays the top 10 data science job titles by total salary in US dollars, aggregated from a remote CSV dataset. The visualization uses D3.js v7 with SVG rendering, employing `d3.rollups` to sum salaries per title and `d3.scaleBand`/`d3.scaleLinear` for axes. Each bar is colored via `d3.scaleOrdinal` with `d3.schemeCategory10`, and a legend maps colors to job titles. Hovering increases bar opacity through CSS.

AArungopal Andalam
83% match
Loading thumbnail…

Barchart2

This stacked bar chart displays the top 10 job titles by total salary in USD, aggregated from a CSV dataset loaded via `d3.csv`, with each bar colored using `d3.scaleOrdinal` and `d3.schemeCategory10`. It renders an SVG with `d3.axisBottom` and `d3.axisLeft` for axes, uses `d3.rollups` to sum salaries per job title, and includes a legend. Bars highlight on hover due to CSS opacity changes. The data source is a remote gist file.

SSrinivasAbburi@my.unt.edu
82% match
Loading thumbnail…

Data Viz project

This example shows a pie chart and a stacked bar graph depicting data science salary information, with the pie chart breaking down experience levels and the bar graph ranking the top ten job titles by total salary. Both visualizations load salary data from a remote CSV file and use D3.js v7 APIs, including `d3.rollup` and `d3.rollups` for aggregation, `d3.pie` and `d3.arc` for pie slices, and `d3.scaleOrdinal`, `d3.scaleBand`, and `d3.scaleLinear` for chart scales. The code renders interactive SVG elements with hover effects on the bars, while the pie chart displays count labels, all styled with categorical color schemes.

AArungopal Andalam
82% match
Loading thumbnail…

Data & Colour Example

This interactive visualization displays the top 10 highest-paying job titles within a selected category, using a horizontal bar chart where bar lengths represent mean salaries and color intensity encodes salary magnitude. The data is loaded from a GitHub repository as CSV files, and the visualization updates via a dropdown menu. The code utilizes D3.js v6 APIs including `d3.scaleBand`, `d3.scaleLinear`, `d3.scaleQuantile`, and `d3.transition`, with animated transitions (2-second duration) that smoothly adjust bar positions, widths, and fill colors, while also re-rendering the axes via `d3.axisLeft` and `d3.axisBottom`.

WWayneFd
80% match
Loading thumbnail…

Fork of Final Project Bar Chart

This example visualizes the salary distribution of the top 10 job categories, sorted by median salary, using horizontal boxplots rendered in SVG. The visualization uses D3 v7 to compute quartiles, medians, and whiskers from a CSV dataset, with each boxplot showing salary spread via light blue boxes, red median lines, and black whiskers. Interactive tooltips appear on hover, and checkbox controls (though incomplete in the code) allow users to filter which job categories remain visible. The axes use D3’s `scaleBand`, `scaleLinear`, and `axisLeft`/`axisBottom` APIs.

DDuc Pham
79% match
Loading thumbnail…

Project1

A collection of bar charts, scatter plots, and pie charts visualizes data science salary trends. The charts include a bar chart of total salary by job title, a scatter plot of salary versus experience level, a top-10 job title salary bar chart, a stacked bar chart of employment types, and pie charts for skills and experience levels. Built with D3.js (v3 and v7), the examples use SVG rendering, `d3.scaleBand`, `d3.scaleLinear`, `d3.rollup`, `d3.pie`, and `d3.arc`. Data is loaded from a remote CSV file containing data science salary information.

AArungopal Andalam
79% match