Skip to main content
SimilarExport ZIP
100%

Fork of Fork of HTML Starter

✓ Published1🌍 Public
Aanjanipriyajillela@gmail.com
Last edited Mar 8, 2026
Created on Mar 8, 2026

This scatter plot shows the popularity scores of eight programming languages, distinguishing between high- and low-popularity categories with color-coded points. Using a point scale for the x-axis and a linear scale for the y-axis, it renders circles via D3 selections, with axes and rotated labels generated by `d3.axisBottom` and `d3.axisLeft`. Color mapping applies `d3.scaleOrdinal`, while a custom legend and SVG text labels annotate the chart against a dark themed background.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Fork of HTML Starter

This visualization compares the popularity trends of Python, JavaScript, and Java across 20 days using two side-by-side SVG charts. The top line chart maps each language's daily score with `d3.line` paths, while the bottom combined chart overlays Python bars (`d3.scaleBand`) with a JavaScript line (`d3.line`). Both include grid lines, axes, and legends built with D3 v7 APIs (`d3.select`, `d3.scaleLinear`, `d3.axisBottom`, `d3.axisLeft`). The synthetic dataset is embedded directly in the JavaScript code.

Aanjanipriyajillela@gmail.com
84% match
Loading thumbnail…

Fork of HTML Starter

This example displays an area chart of programming language popularity, showing the number of users for each language. The chart is rendered as an SVG within an HTML page, using D3.js v6 to fetch a CSV file from a GitHub gist. The code constructs the visualization with `d3.scaleBand` for the categorical x-axis and `d3.scaleLinear` for the y-axis, then applies the `d3.area` generator to create the filled area path. Axis labels are added using `d3.axisBottom` and `d3.axisLeft`. The data source is loaded via `d3.csv`, and the final SVG is styled with a steelblue fill.

Ssahithya.voleti@gmail.com
84% match
Loading thumbnail…

Fork of HTML Starter

This example presents a pie chart showing the popularity of programming languages based on user counts fetched from a remote CSV file. It uses the D3.js v6 library, specifically the `d3.pie()` and `d3.arc()` functions to compute and draw the pie slices as SVG paths, with `d3.scaleOrdinal` providing categorical colors. A legend is generated alongside the chart, and title labels are added via SVG text elements. The visualization is built within a React framework but renders directly to SVG in the browser, with data loaded using `d3.csv`.

Ssahithya.voleti@gmail.com
82% match
Loading thumbnail…

Fork of Bar chart with D3.js

A forked bar chart displays the popularity percentages of ten programming languages from Stack Overflow's 2019 survey. Using D3.js v5 with SVG, the chart renders horizontal gridlines, axes, and value labels. On mouseenter, a dashed reference line appears and text labels show the percentage divergence between the hovered bar and every other bar. The code applies d3.scaleBand and d3.scaleLinear with d3.axisLeft and d3.axisBottom, plus transitions for opacity changes.

Aall-over-yet
82% match
Loading thumbnail…

Fork of Bar chart with D3.js

A fork of a D3.js bar chart displays the most-loved programming languages from the Stack Overflow 2018 survey, showing each language's "love meter" percentage. Built with d3.v5, the SVG chart uses d3.scaleBand and d3.scaleLinear for axes and bars with horizontal grid lines, while mouseenter and mouseleave events trigger transitions that highlight bars and compute divergence values against a reference language. The chart includes labeled axes, a title, and color-coded bars based on survey data.

NNaimisha-M
80% match
Loading thumbnail…

Fork of Fork of Fork of HTML Starter

A scatter plot of CSV data renders each point as a hexagonal polygon, rotated and scaled, with fill color mapped from a selected categorical attribute. Users toggle between white and color via a dropdown. The React app uses `d3.scaleLinear`, `d3.scaleOrdinal`, `d3.extent`, and `d3.format`, with D3 v7, drawing SVG polygons with tooltips.

Pppal41366@gmail.com
79% match
Loading thumbnail…

Fork of Fork of HTML Starter

An area chart visualizes the increase in marks over ten days using a semi-transparent blue filled region, an overlaid line, and circular data points. Built with D3 v7, the visualization employs `d3.scaleLinear` for both axes, `d3.area` and `d3.line` to generate the paths, and `d3.axisBottom` and `d3.axisLeft` for labeled axes, with data embedded directly in the HTML.

Aanjanipriyajillela@gmail.com
79% match
Loading thumbnail…

Fork of D3 Starter

This example displays a scatter plot comparing programming language performance on Project Euler problems, with user-selectable axes, filter options, and animated transitions. It loads CSV timing data and color mappings from GitHub repositories, then visualizes results as colored circles that animate to new positions when the dataset changes. The visualization uses a custom surrounding-layout system that automatically positions titles, subtitles, axes, and legends within an SVG canvas. Built with D3 v7, the code leverages `d3.scaleLinear`, `d3.scaleBand`, `d3.scaleTime`, `d3.axisBottom`, `d3.axisLeft`, `d3.transition`, and dynamic menu-driven data selection through reusable chart components.

GGavin Sykes
79% match