Skip to main content
SimilarExport ZIP
100%

ice-7.2

✓ Published1🌍 Public
NNaveen Kumar Kolla
Last edited Apr 1, 2025
Created on Apr 1, 2025

This example shows a pie chart of car transmission types against the number of doors, using data fetched from a CSV file hosted on GitHub. It uses Chart.js to render the pie chart on a Canvas element, with a legend positioned on the right. The code fetches the CSV data asynchronously, extracts the transmission column, and counts occurrences per type. The chart is styled with semi-transparent background colors and set to be responsive within a 400-pixel container.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of ice-7.2

This pie chart displays the distribution of car transmission types by counting how many vehicles in a dataset have each transmission category. The visualization is built using the Chart.js library on an HTML canvas element. It fetches comma-separated data from a remote GitHub gist URL, parses the transmission column from each row, and aggregates the counts before rendering them as colored pie slices with a legend positioned on the right. The chart uses a responsive layout within a fixed-size container.

NNaveen Kumar Kolla
88% match
Loading thumbnail…

ice-7.3

This example shows an area chart of car types plotted against their number of doors, using data fetched from a remote CSV file. The chart is rendered on a Canvas element via the Chart.js library, with the `fill: true` option creating the shaded area beneath the line. The code fetches the dataset asynchronously, parses the comma-separated rows, and populates the chart’s labels and values. It uses Chart.js’s `new Chart()` constructor with a line type, and configures axes titles for “Car Model” and “no of doors”.

NNaveen Kumar Kolla
86% match
Loading thumbnail…

ice-7.4

This example shows a scatter plot of the number of doors versus owner count for cars, with each point representing one vehicle from a CSV dataset fetched from a GitHub gist. The chart is rendered on a Canvas element using Chart.js, with linear scales for both axes and step sizes set to one. Data is loaded asynchronously via the Fetch API, parsed from comma-separated rows, and filtered for valid numeric values before being passed to the scatter chart. The plot uses teal points with a border width of one and a point radius of five, and includes a legend at the top.

NNaveen Kumar Kolla
83% match
Loading thumbnail…

ice 7 pie chart

This pie chart visualizes the distribution of website traffic by source, with visitor counts in thousands. It fetches data from a CSV file hosted on GitHub and renders the chart using Chart.js on an HTML canvas element. The chart displays twelve labeled categories with distinct translucent colors and a legend positioned on the right side. The code retrieves the data asynchronously via the `fetch` API, parses the CSV rows, and configures the pie chart with responsive settings and a descriptive title.

UUday Kiran
77% match
Loading thumbnail…

ICE - 7 Pie chart

This example presents a static pie chart that visualizes the percentage of car sales attributed to different car companies. The chart is rendered as an SVG using D3.js version 5, with each slice colored from a predefined palette. The code constructs the pie chart by loading data from a remote CSV file using `d3.csv`, then uses `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` to generate and style the slices. It also appends text labels at the centroid of each slice via `arc.centroid`, and a legend is built manually with rectangles and text elements.

Ppremsaiv
77% match
Loading thumbnail…

ice 7 pie chart

A pie chart displays the distribution of website traffic by traffic source, with each slice labeled by source name and visitor count in parentheses. The code fetches a CSV file from a GitHub gist, parses the data, and renders the visualization using Chart.js on an HTML canvas element. Twelve predefined semi-transparent colors differentiate the slices, and the legend is positioned on the right side with a title indicating visitors are measured in thousands.

UUday Kiran
77% match
Loading thumbnail…

Pie chart ice 7

A pie chart shows the distribution of cars by cylinder count, sourced from the Auto MPG dataset. Each slice is labeled directly with its category and percentage, while a legend on the right lists raw counts. The chart uses D3 v7 modules `csv`, `rollup`, `pie`, `arc`, and `scaleOrdinal` with `schemeTableau10`, rendering slices and labels as SVG elements within an 880 by 520 pixel viewport.

SSreedevi Itta
76% match
Loading thumbnail…

ICE-7 pie chart

This pie chart visualizes the number of car units sold for different car models, with each slice colored distinctly and accompanied by a legend showing the car name and its corresponding value. The chart uses D3 v5’s `pie`, `arc`, and `scaleOrdinal` functions to generate the SVG paths, while data is loaded asynchronously from a CSV file via `d3.csv`. The rendering includes a centered pie with a 200-pixel outer radius, and the legend displays colored rectangles and text labels positioned to the right.

SSheshidharreddy
76% match