Skip to main content
SimilarExport ZIP
100%

Github API Visualisation

✓ Published0🌍 Public
Ddabreadman (YI XIANG TAN)
Last edited Jan 4, 2021
Created on Jan 4, 2021
Forked from Making a Bar Chart

This bar chart visualizes mutual following counts among GitHub users, ranking each contributor by the number of mutual connections they share. The data is loaded from a CSV file, with counts parsed as numbers and rendered as horizontal bars. Using D3 v5, the visualization employs `scaleLinear` for the x-axis, `scaleBand` for the y-axis, and `axisBottom` and `axisLeft` for tick marks. The SVG output styles bars in steelblue, with axes and labels generated programmatically from the data.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Making a Bar Chart

This horizontal bar chart displays the count of contributions per GitHub login, sorted by the login name. It uses D3 version 5 APIs including `scaleBand` and `scaleLinear` to map the data, and `axisLeft` for the y-axis. The chart reads from a CSV file, and the bars are rendered as SVG rectangles filled with steelblue using the `svg.append` method. The data is parsed to convert string counts to numbers before the chart is generated.

Ddabreadman (YI XIANG TAN)
83% match
Loading thumbnail…

D3 Bar Chart

This bar chart displays the number of contributions per author from a local CSV file, with values multiplied by 1,000 for scaling. The visualization uses D3 v5 to load the data, apply a linear scale for the x-axis and a band scale for the y-axis, and render steel-blue bars in an SVG. Axes are added using `axisLeft` and `axisBottom`, while styling is handled through an external stylesheet.

MMJR1997
75% match
Loading thumbnail…

Bar Chart

This bar chart displays the number of contributions made by each author, sourced from a CSV file. The chart renders as steelblue rectangles via SVG. The code uses d3’s `select`, `csv`, `scaleLinear`, and `max` functions to load the data and map the maximum contribution count to the scale’s domain, though the current implementation sets a fixed rectangle size rather than scaling the bars to their data values.

MMJR1997
73% match
Loading thumbnail…

Github activity overview

This example simulates a GitHub contribution heatmap, displaying 365 days of activity as a grid of colored squares. Each square’s color encodes a random activity value from 0 to 9, using a linear scale with an RGB interpolator that transitions from light gray to green; zero-value days appear in light gray. Hovering over a square reveals its value in a tooltip positioned near the cursor. The visualization is built with D3 v5, using `d3.select`, `d3.scaleLinear`, `d3.interpolateRgb`, and `d3.randomInt` to generate and render the data.

Rrohame
72% match
Loading thumbnail…

Making a bar chart

A horizontal bar chart ranks social media platforms by user count, using Font Awesome icons instead of text labels for each bar's category. The visualization loads data from a CSV file and renders SVG rectangles with D3 v5's `scaleLinear`, `scaleBand`, `csv`, `axisLeft`, and `max`. The bars are filled with a red color, while the y-axis displays the platform names. The chart includes margins and uses a linear scale for the quantitative user values, with the x-axis hidden in the final output.

BbeauMarko
72% match
Loading thumbnail…

Fork of company list

This visualization displays a horizontal bar chart of company data, showing the top 11 entries from a CSV file loaded via `d3.csv`. Each bar represents a company’s serial number, with company names listed on the y-axis using `scaleBand` and numeric values on the x-axis via `scaleLinear`. The chart is rendered in React using SVG elements, with purple bars and orange gridlines produced by `xScale.ticks()`. The data is fetched from a GitHub gist and displayed with axis labels.

NNaimisha-M
72% match
Loading thumbnail…

Fork of Let's make a Bar Graph with D3.js

This bar chart visualizes the scores of different teams using D3.js (v7) with SVG rendering. It loads CSV data from a GitHub gist and maps team names to the y-axis with a band scale, while a linear scale positions the bar widths based on score values. The code uses `d3.csv`, `scaleBand`, `scaleLinear`, and `axisLeft`/`axisBottom` to construct the chart, with red rectangles and styled text. Axes and margins frame the visualization, which updates dynamically after parsing and converting the numeric score data.

Ssaivinay143
71% match
Loading thumbnail…

Making a Bar Chart

This example shows a horizontal bar chart ranking API endpoints by hit count, with values from a CSV file rendered as steel-blue rectangles. The chart is built using D3 v5, with `d3.csv` loading the data and `d3.scaleLinear` and `d3.scaleBand` positioning the bars. Axis labels are generated via `d3.axisLeft` and `d3.axisBottom`, and the SVG output is styled with CSS. The bars extend horizontally from the left margin, and the chart uses a fixed 960×500 pixel canvas.

Pprudhvirajmudunuri
71% match