Fork of Piechart ICE7

100%

Fork of Piechart ICE7

✓ Published0🌍 Public

Last edited Mar 29, 2023

Created on Mar 29, 2023

This pie chart visualizes the maximum female height of different dog breeds from a GitHub-hosted dataset, with each slice labeled with its height value and accompanied by a legend. Built with D3.js v5, it uses the `pie()` and `arc()` generators to compute the chart geometry, while `scaleOrdinal()` maps section colors. The SVG rendering includes slice labels positioned via `arc.centroid()` and a legend constructed with appended rectangles and text elements.

AI-generated description

A reusable scatter plot inspired by Towards Reusable Charts.

Shows the Iris Dataset.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of piechart icetmo7

This example shows the top 10 dog breeds by maximum male height using a pie chart. The chart displays each breed as a colored arc with a corresponding legend listing breed names and height values. Built with D3.js v5, it loads CSV data from a GitHub gist, uses `d3.pie` and `d3.arc` to compute and render the segments, and `d3.scaleOrdinal` for color mapping. Legends are positioned manually with SVG circles and text, while the total value is formatted using `d3.format`.

Vvryvarma5577@gmail.com

91% match

Loading thumbnail…

Fork of Pie Chart

This fork of a pie chart displays the top eight dog breeds by maximum male height, with each slice sized according to that value. The chart uses a categorical color scale and includes a legend listing breed names alongside their heights in inches. The visualization is built with React and D3 v5, using `d3.pie` and `d3.arc` to generate SVG paths, while `d3.scaleOrdinal` assigns the colors. Data is loaded via `d3.csv` from a GitHub gist, and the code sorts the dataset before rendering the top entries.

Vvryvarma5577@gmail.com

88% match

Loading thumbnail…

Fork of ICE-7 Line Chart

This fork of the ICE-7 line chart visualizes dog breed data by plotting maximum female height over time on the x-axis against breed names on the y-axis, with a red line path connecting points and labeled axes. The chart uses D3 v5’s `csv` loader to fetch data from a GitHub gist, `scaleTime` and `scaleLinear` for scaling, and `line()` to generate the SVG path. Axes are rendered with `axisBottom` and `axisLeft` inside an SVG container, with custom tick styling and static text labels for both dimensions.

Vvryvarma5577@gmail.com

83% match

Loading thumbnail…

Fork of Fork of Fork of piechart ic7

This example shows a pie chart of the top 10 car production countries, using the `max_height_male` column from a CSV dataset as the value for each slice. The chart is rendered as SVG with D3 v5, using `pie()` and `arc()` to compute the angles and `scaleOrdinal` for a custom color range. A legend on the right displays country names and their corresponding values, formatted with `format('.5~g')`. The data is loaded asynchronously via `d3.csv` from a GitHub gist, and the entire visualization is positioned with SVG groups and transforms.

Vvryvarma5577@gmail.com

79% match

Loading thumbnail…

Fork of ICE - 7 Pie Chart

This pie chart displays the percentage of sales for different items, with a legend positioned to the right showing each item’s name and corresponding value. The chart is built with D3 v5, using `d3.pie` and `d3.arc` to generate the segments, `d3.scaleOrdinal` for color mapping, and `d3.csv` to load the dataset from a GitHub gist. The visualization renders as SVG, with section labels and legend text styled via CSS.

RRahulSai05

79% match

Loading thumbnail…

Fork of Piechart ICE7

A pie chart depicts the number of vehicles seized across various U.S. states, using a dataset loaded from a GitHub-hosted CSV. The chart displays each state as a colored slice with a value label (in thousands), accompanied by a legend that lists state names and their corresponding seized-vehicle counts. Built with D3 v5, the visualization employs `d3.csv` to fetch data, `d3.pie` to compute arc segments, `d3.arc` for path generation, and `d3.scaleOrdinal` for categorical coloring. The SVG output is rendered within a centered layout, with legends and labels formatted via CSS.

Vvryvarma5577@gmail.com

78% match

Loading thumbnail…

Fork of ICE - 7 Pie Chart

This pie chart displays the number of users across different years, with each slice colored distinctly and accompanied by a legend showing the year and corresponding user count. The visualization loads comma-separated data from a GitHub gist URL using d3.csv, then applies the d3.pie and d3.arc generators to compute and draw the SVG paths. Colors are assigned via d3.scaleOrdinal with a fixed array, while the legend uses SVG rectangles and text elements positioned with translate transforms.

SSnigdha6698

78% match

Loading thumbnail…

Fork of ICE - 7 Pie Chart

This example shows the percentage sales of different items in a pie chart, with a legend displaying each item’s name and corresponding value. Built with D3 v5, it loads data from a CSV hosted on GitHub, converts sales values to numbers, and uses `d3.pie()` and `d3.arc()` to generate the SVG path segments. Colors are assigned via `d3.scaleOrdinal`, while the legend is manually created with appended rectangles and text. The chart is rendered entirely in SVG, with a fixed width and height, and no interactive behavior.

MMar-99

78% match