Skip to main content
SimilarExport ZIP
100%

Fork of Fork of Fork of React & D3 Starter

✓ Published1🌍 Public
Llohithkumar51001@gmail.com
Last edited Apr 10, 2026
Created on Apr 10, 2026

A bar chart displays average AI risk scores across job titles, sorted from highest to lowest, with each bar colored distinctly and a custom tooltip showing the exact score on hover. The visualization loads CSV or TSV data from a GitHub gist, parses it, and aggregates scores using `d3.rollup` and `d3.mean`. Rendered as SVG with D3 v7, it uses `d3.scaleBand`, `d3.scaleLinear`, and `d3.axisLeft`/`axisBottom`, while a separate HTML legend maps job titles to their colors via `d3.schemeTableau10` and other palettes.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Fork of React & D3 Starter

This interactive scatter plot visualizes the relationship between salary (in USD) and AI risk score for various job titles, with each point colored by job category based on data loaded from a GitHub Gist. It uses d3.csvParse or d3.tsvParse to handle the data, d3.scaleLinear for both axes, d3.scaleOrdinal with combined color schemes, and d3.axisBottom/axisLeft to render gridlines and tick labels. Hovering over a circle triggers a tooltip showing job title, country, salary, and AI risk score, while a legend displays the first twelve job categories.

Llohithkumar51001@gmail.com
89% match
Loading thumbnail…

Fork of Fork of Fork of Fork of Fork of React & D3 Starter

This donut chart visualizes the share of jobs by AI risk category, using a qualitative green-yellow-red scale for low, medium, and high risk. It reads a TSV/CSV file via `d3.text` and `d3.csvParse`, then aggregates counts with `d3.rollup`. The SVG rendering uses `d3.pie` and `d3.arc` to generate the donut arcs, with an interactive tooltip on `mousemove` and a legend built with `d3.selectAll`. The chart also displays the total job count in the center, with all styling handled through HTML/CSS.

Llohithkumar51001@gmail.com
87% match
Loading thumbnail…

Fork of Fork of React & D3 Starter

A bar chart compares average grade improvement across AI tool purposes, with each bar height representing the mean grade change for that category. The chart highlights how different reasons for using AI correspond to varying academic outcomes. Built with D3 v7, it loads CSV data via `d3.csv`, aggregates values using `d3.rollups` and `d3.mean`, and scales axes with `d3.scaleBand` and `d3.scaleLinear`. Rendered as SVG, bars include hover tooltips for detail, and the chart is sorted from highest to lowest average improvement.

Mmichael_chuxs@yahoo.com
85% match
Loading thumbnail…

Fork of React & D3 Starter

A bar chart displays average salary by country, parsed from a GitHub Gist CSV or TSV file via `d3.text` and `d3.csvParse` or `d3.tsvParse`. It aggregates data with `d3.rollup` and `d3.mean`, then sorts countries using `d3.descending`. The visualization uses D3 v7 scales (`d3.scaleBand`, `d3.scaleLinear`, `d3.scaleOrdinal`), axes, and SVG rectangles. Interactive tooltips appear on `mousemove`, while a separate HTML legend is built with D3 selections.

Llohithkumar51001@gmail.com
85% match
Loading thumbnail…

Fork of Fork of Fork of Fork of React & D3 Starter

This visualization displays a bubble chart comparing average job openings across primary skills, with bubble size indicating average skill demand score and color distinguishing each skill category. The chart, rendered as SVG using D3 v7, loads CSV data from a GitHub gist and aggregates records by primary skill using `d3.rollup` and `d3.mean`. It employs `d3.scaleBand`, `d3.scaleLinear`, and `d3.scaleSqrt` for positioning and sizing, `d3.schemeTableau10` for color, and `d3.axisLeft` and `d3.axisBottom` for axes. Interactive tooltips appear on mouseover, and a legend lists all skills with their corresponding colors.

Llohithkumar51001@gmail.com
84% match
Loading thumbnail…

Fork of Fork of A4_Bar-chart

This example displays a bar chart of average salaries by job title, with each bar colored steel blue and highlighted orange on hover. It fetches CSV data from a remote gist using `d3.text`, parses it into job title and salary pairs, and renders the chart as SVG via D3 v6. The visualization uses `d3.scaleBand` and `d3.scaleLinear` for axes, `d3.axisBottom` and `d3.axisLeft` for ticks, and includes a tooltip div that appears on mouseover showing the job title and formatted salary.

Ppavan vasamsetti
84% match
Loading thumbnail…

Fork of A4_Bar-chart

This bar chart displays average salaries by job title, with a tooltip showing the exact salary on hover. The visualization uses D3 v6 to fetch a CSV file from a GitHub repository, parse the data, and render an SVG with scaled bars and axes. The code leverages `d3.scaleBand`, `d3.scaleLinear`, `d3.axisBottom`, and `d3.axisLeft`, with mouseover events that change bar color and reveal a tooltip displaying the job title and salary. The chart includes rotated x-axis labels and axis titles for clarity.

Ppavan vasamsetti
83% match
Loading thumbnail…

Fork of A4_Bar-chart

This bar chart visualizes average salaries across different job titles using data from a CSV file loaded via D3.js. It displays the distribution of salaries with vertical bars, where hovering over a bar highlights it in orange and shows a tooltip with the exact salary amount. The visualization uses D3 v6's `scaleBand` and `scaleLinear` for positioning, with axes labeled and rotated for readability. The chart is rendered as an SVG element inside an HTML page, with the data fetched from an external GitHub Gist containing job title and salary pairs.

JJorge Melchor
82% match