Fork of Fork of Fork of HTML Starter

Vviveknaroju999@gmail.com

Fork of Fork of Fork of HTML Starter

A pie chart displays year-to-date auto sales by brand for 2022, with each slice sized by sales volume and a legend showing brand colors, percentage of total, and sales in thousands. The visualization uses D3 v5’s `pie`, `arc`, `scaleOrdinal`, and `svg` selection APIs to render SVG paths and legend elements. Data is loaded from a CSV file hosted on GitHub Gist via `d3.csv`.

Vviveknaroju999@gmail.com

Fork of Fork of Fork of HTML Starter

Mmukundakrishna.r@gmail.com

Fork of Fork of PIE CHART

This example visualizes country-level data over time as a multi-line chart, with each line representing a country’s values across a series of years. The chart is rendered in SVG using D3 v7, fetching data from a CSV file via `d3.csv`. It employs `d3.scaleLinear` for both axes, `d3.line` to generate the paths, and `d3.axisBottom` and `d3.axisLeft` for tick marks, with rotated x-axis labels for readability. Each country’s line is colored using `d3.schemeCategory10`.

Fork of Fork of HTML Starter 2

This visualization displays the CSS named colors as a pie chart, with each slice colored by its corresponding hex value and sized equally. The chart uses React to manage the async loading of CSV data from a GitHub gist, while d3’s `arc` and `pie` generators compute the SVG paths. The rendering leverages React DOM to mount the SVG elements, and the dataset contains 148 rows of color names and hex codes.

LLeonardo Baron

Fork of Fork of Fork of Fork of ICE 7 Pie Chart

This D3 pie chart displays the top 5 countries by death count in 2020, with each slice labeled and a corresponding legend showing the country name and formatted value. It loads CSV data via `d3.csv`, computes arc segments using the `pie` and `arc` helpers, and colors slices using `scaleOrdinal` with a fixed range. The visualization is rendered as SVG, with custom text and legend elements added to the same canvas.

PPrathyusha0304

Mmounishnaidu96@gmail.com

Fork of Fork of Fork of HTML Starter

This example shows the calorie distribution of various foods using a pie chart, with a legend displaying each food's name and calorie count. It loads a CSV dataset from a GitHub gist using D3's `csv` function and renders the chart as SVG. The code uses `pie()` to compute arc data, `arc()` to generate the path segments, and `scaleOrdinal()` to assign categorical colors. Text labels and legend entries are added with `select()` and `append()`, while `format('.4~g')` formats the calorie values in the legend.

Fork of Fork of countries

This example displays a pie chart of sales records, with each slice representing data grouped by country. The visualization renders using SVG and reads its data from a CSV file hosted online via `d3.csv`. The code uses `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` to generate the slices and assign colors to each segment. Each slice is labeled with its value, and a legend is drawn on the right side. The chart is generated by fetching data with `d3.csv` from a provided URL, then iterating through the records to sum the `orderdate` values for the total.

NNaimisha-M

Fork of Fork of Making an Interactive Pie Chart

This donut chart displays income categories (Sales, Dividends, Interest) with each slice’s percentage revealed via an interactive tooltip on mouseover. Built with D3 v5, it loads data from data.csv, scales colors with `scaleOrdinal`, and computes slice geometry using `pie` and `arc` functions. Hovering highlights each slice’s opacity change and shows a tooltip positioned at the cursor, while labeled text sits inside each arc segment. The SVG rendering includes a padded, rounded arc style with corner radius.

NNarayana Reddy