Bar Graph by Mohith

100%

Bar Graph by Mohith

✓ Published1🌍 Public

Last edited Oct 20, 2025

Created on Oct 20, 2025

This example visualizes programming languages by their year of creation, with bars colored to distinguish high-level from low-level languages and a legend annotating the categories. The chart uses D3 v7 APIs including `d3.scaleBand`, `d3.scaleLinear`, and `d3.scaleOrdinal` to map data, while `d3.axisBottom` and `d3.axisLeft` render axes with dashed gridlines. Data is loaded from a CSV file via `d3.csv` with `d3.autoType`, and the SVG includes a centered title, rotated x-axis labels, and an author attribution.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Bar chart with D3.js

This bar chart displays the popularity percentages of programming languages, showing the distribution of values across categorical labels. Built with D3 v5, the visualization renders SVG bars with axes, gridlines, and value labels. Hovering over a bar triggers a mouseenter event that highlights the selected bar, draws a dashed reference line, and displays divergence percentages for all other bars relative to the hovered one. The mouseleave event removes these annotations, restoring the original view. Data is loaded from a CSV file using d3.csv.

Eest85

80% match

Loading thumbnail…

bar chart with D3.js

This bar chart visualizes the popularity of programming languages using value data from a CSV file. Built with React and D3.js v4, it renders bars as SVG rectangles with colored fills and axis labels. The example includes interactive controls—a column selector and a bin count input—that allow users to explore data aggregation. The visualization uses D3 scales for axes and a color mapping from the dataset, with a dark blue container background for contrast.

AAbhishek Kumar

80% match

Loading thumbnail…

Bar chart with D3.js

A bar chart displays the popularity of programming languages from Stack Overflow's 2019 survey, with values as percentages. Built with D3.js v5, the SVG visualization renders horizontal axes and animated bars, and includes hover interactions that highlight a selected bar, display a dashed reference line, and compute value divergences against other languages. The chart uses `d3.scaleLinear` and `d3.scaleBand` for axis scaling, `d3.axisLeft` and `d3.axisBottom` for ticks, and `d3.selectAll` with transitions to manage mouseenter and mouseleave effects.

Eest85

79% match

Loading thumbnail…

Bar chart with D3.js

This bar chart visualizes the most loved programming languages of 2018, using data from a Stack Overflow survey, with each language’s popularity percentage shown on a horizontal axis. Implemented with D3.js v5, it renders as an SVG with animated hover interactions: moving the mouse over a bar highlights it, draws a dashed threshold line, and displays the percentage difference between that language and all others. The chart uses `d3.scaleBand` and `d3.scaleLinear` for axes, and applies transitions to bars and text on mouse events.

SSharanya1307

78% match

Loading thumbnail…

Bar chart with D3.js

This bar chart displays the most loved programming languages in 2018, based on Stack Overflow survey data, with each bar’s height representing the percentage of developers who reported loving that language. The visualization is rendered as an SVG with D3.js v6, using `d3.scaleBand` and `d3.scaleLinear` for the axes. Hovering over a bar triggers a transition that highlights the selected bar, increases its width, draws a dashed reference line at the hovered value, and displays percentage divergence labels for all other bars relative to the selected one. The chart includes grid lines, axis labels, a title, and a source attribution.

MMinwoo Pak

78% match

Loading thumbnail…

Bar chart with D3.js

A bar chart displays the relative popularity of programming languages using percentage values from Stack Overflow's 2019 survey. The implementation uses D3 v5 with SVG rendering, constructing linear and band scales to position bars and axes while appending value labels to each bar. Hovering over a bar highlights it, dims other labels, and draws a dashed reference line that computes and displays the percentage divergence between the selected language and all others.

UUsama Khalid

78% match

Loading thumbnail…

Bar chart with D3.js

This bar chart visualizes the "Most loved programming languages in 2018," using data from Stack Overflow. It displays the percentage of developers who love each language, with bars colored per language. The chart uses D3.js v5 to render SVG elements, including axes, gridlines, and a title. Interactive features, triggered by mouse events, highlight a selected bar and display percentage differences from the hovered language, and a dashed line indicates the selected value.

SSarahKiyani

78% match

Loading thumbnail…

Bar chart with D3.js

This bar chart visualizes the popularity of programming languages from a 2019 Stack Overflow survey, showing each language's percentage value above its corresponding bar. Built with D3.js v5, the SVG chart uses `d3.scaleLinear` for the y-axis, `d3.scaleBand` for categorical x-axis placement, and `d3.axisLeft`/`d3.axisBottom` to render axes with gridlines. Interactive mouseenter and mouseleave events trigger `transition` animations that highlight a bar and display divergence percentages for all other languages relative to the selected one.

Ssndcaldgafz

78% match