Skip to main content
SimilarExport ZIP
100%

LM_Task9&10

✓ Published0🌍 Public
LLokesh Madem
Last edited Apr 21, 2024
Created on Apr 21, 2024

This example displays the land area percentage of continents as a pie chart, with a legend listing each continent and a colored swatch. The chart is rendered using D3.js (version 4.2.2) with SVG elements, where slices are generated via `d3.pie` and `d3.arc`. Hovering over a slice triggers a tooltip that shows the region and profit value, using mouse events to position it. The data is fetched from a CSV file hosted on GitHub, and the visualization includes a drop shadow filter applied to the SVG group.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Task9-Q1

A pie chart displays the percentage of land area per continent, with a color-coded legend and a hover tooltip that reveals each value. Built with D3.js v4, it uses `d3.pie` and `d3.arc` to generate the SVG paths, `d3.scaleOrdinal` for color mapping, and a custom tooltip that follows the mouse. The chart is resizable and re-renders on window resize. Static data is hardcoded in JavaScript, while the SVG includes a Gaussian blur filter for a subtle shadow effect.

Mmythripopuri2001@gmail.com
86% match
Loading thumbnail…

Fork of Task9-Q1

This visualization displays the land area percentage of continents as a pie chart, with each continent’s proportion encoded by a distinct color and a hover tooltip revealing the exact percentage value. The chart is built using D3.js version 4.2.2, employing the `d3.pie` and `d3.arc` functions to generate the SVG paths, and `d3.scaleOrdinal` for color mapping. The customData array is hardcoded for the seven continents. The chart is responsive, redrawing on window resize by clearing the existing SVG and re-invoking the plot function.

Mmythripopuri2001@gmail.com
86% match
Loading thumbnail…

Fork of Task9-Q1

This visualization displays the land area percentage of continents as a pie chart, with each continent’s proportion encoded by a distinct color and a hover tooltip revealing the exact percentage value. The chart is built using D3.js version 4.2.2, employing the `d3.pie` and `d3.arc` functions to generate the SVG paths, and `d3.scaleOrdinal` for color mapping. The customData array is hardcoded for the seven continents. The chart is responsive, redrawing on window resize by clearing the existing SVG and re-invoking the plot function.

Mmythripopuri2001@gmail.com
86% match
Loading thumbnail…

q1 task9

This pie chart visualizes the percentage of land area per continent, with each slice colored and labeled in a static legend. The chart is rendered using SVG via D3.js (v4), where the `d3.pie()` generator and `d3.arc()` function compute the slice paths. Hovering over a slice triggers a tooltip showing the exact percentage, implemented with D3 mouse events. Data is hardcoded in the script, and the visualization includes a responsive resize handler that redraws the chart.

Mmanisahiths54321@gmail.com
86% match
Loading thumbnail…

TASK9_QUESTION_1

This interactive pie chart visualizes land area percentages across seven continents, with each slice colored distinctly and labeled in a side legend. Hovering over a slice reveals its exact percentage via a tooltip. The visualization uses D3.js v4 with the `d3.arc()` and `d3.pie()` APIs, and applies an SVG filter for a soft blur effect. Data is hardcoded in the script as an array of objects, while the chart resizes responsively to fit its container.

Ssairam.amaraneni22@gmail.com
85% match
Loading thumbnail…

QUESTION-1

This visualization is a pie chart, titled "Land Area Percentage of Continents," that displays the proportion of global land area occupied by each continent, such as Asia at 30% and Africa at 20.3%. The chart is rendered using the D3.js library (version 4.2.2), specifically leveraging the `d3.pie` and `d3.arc` APIs to generate the pie segments. A custom color scale (`d3.scaleOrdinal`) assigns distinct colors to each continent, and a tooltip is implemented to show the exact percentage value upon mouseover. The data is hardcoded within the `index.js` file, not sourced from the provided `data.csv`. The SVG output includes a Gaussian blur filter for a shadow effect.

Ppasumarthiraghuram21@gmail.com
82% match
Loading thumbnail…

lm_piechart_Task9

A pie chart visualizes profit distribution across regions, with each slice's area proportional to the region's profit value and labeled in a legend alongside the corresponding profit amount. The chart renders as an SVG using D3 v5 APIs, including `d3.pie()` to compute arc angles, `d3.arc()` to generate path segments, and `d3.scaleOrdinal` with `d3.schemeCategory10` for color encoding. Data is loaded asynchronously from a remote JSON file provided via GitHub Gist, with profit values parsed as numbers before rendering. The legend maps each color to a region name and its profit value.

LLokesh Madem
82% match
Loading thumbnail…

Task-10

This example displays a pie chart with a side legend, both rendered as SVGs. The D3 pie layout computes arc angles based on the percentage values, while d3.arc generates the path data and d3.schemeTableau10 assigns categorical colors. A second SVG contains the legend with colored rectangles and text labels, and the data is loaded from a remote CSV file.

Bbhargavr016@gmail.com
80% match