Skip to main content
SimilarExport ZIP
100%

vyjuhub1

✓ Published0🌍 Public
Vvyjayanthimamidipalli@gmail.com
Last edited Mar 22, 2025
Created on Mar 22, 2025
Forked from Hello VizHub

This interactive pie chart visualizes box office revenue for ten blockbuster movies, with each slice sized proportionally to earnings in billions. The chart renders in SVG with a color-coded legend positioned to the right. Users can hover over slices to reveal a tooltip displaying the movie’s year and revenue, using mouse events that toggle visibility and track cursor position. The code employs D3 v7 APIs including `d3.pie()`, `d3.arc()`, and `d3.scaleOrdinal` with the `schemeCategory10` palette.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG (pinned at v6, since this runtime environment only supports UMD, and in v7 D3 dropped UMD support)
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

Q1_piechart

This interactive pie chart visualizes the worldwide gross revenue of ten top-grossing movies, with each slice labeled by movie title and a hover tooltip displaying exact values. A color legend on the right highlights slices on mouseover by dimming non-matching arcs. The example uses d3.pie and d3.arc for chart construction, d3.select for SVG manipulation, and transitions to animate opacity changes. Data loads from a CSV file using d3.csvParse, with colors generated via HSL values.

Sshaiksajidali
83% match
Loading thumbnail…

Q1_piechart

This pie chart visualizes the worldwide gross revenue of movies from a CSV dataset, with each slice representing a single film. Hovering over a slice reveals a tooltip showing the movie title and its exact box office earnings. The chart is built using D3.js v7, employing `d3.pie()` for the layout, `d3.arc()` for the slices, and `d3.scaleOrdinal` with a color scheme for differentiation. It also includes an interactive legend and axis labels, all rendered as SVG within an HTML page.

Sshaiksajidali
83% match
Loading thumbnail…

Activity-7_Question-1

This D3.js pie chart visualizes box office earnings for a dataset of movies, with each slice sized by revenue and labeled with the film’s title and earnings in millions. Hovering over a slice reveals a tooltip with genre, release year, IMDB rating, and franchise details. The visualization uses `d3.pie`, `d3.arc` for slice geometry, and `d3.scaleOrdinal` for color mapping, with custom SVG text labels, connector polylines, and a legend listing each movie’s earnings. Data is loaded asynchronously from a CSV URL via `d3.csv`.

Hhoneyravuri.711@gmail.com
83% match
Loading thumbnail…

Activity-7

A pie chart displays the box office collection in India for various movies, showing each film’s collection as a slice with labels and a legend. The chart renders with D3 v5’s `pie` and `arc` generators, using `scaleOrdinal` for slice colors and `format` for tick labels. Data is fetched from a CSV file via `d3.csv`, and the SVG output includes labeled arcs and a legend with per-movie values.

MMounishAllam@my.unt.edu
80% match
Loading thumbnail…

Pie Chart , ICE-7

A pie chart visualizes the net worth in billions for various movies, with each slice colored and labeled to show the corresponding value. The chart is rendered as an SVG using D3 v5, leveraging `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` to generate segments and map colors. Data is loaded from a CSV file via `d3.csv`, and a legend on the right lists each movie title alongside its net worth. The visualization emphasizes clear labeling and color coding to compare budget figures across films.

Ggaddamthanmayeereddy759@gmail.com
79% match
Loading thumbnail…

dataq1

This example displays six small pie charts, one for each movie genre, showing the proportion of ratings across five categories from "Below 5.0" to "Above 8.5." The charts are arranged vertically within a single SVG, with each genre’s chart positioned using a translated group. The code builds the visualization with D3.js v6, using `d3.pie()` to compute arc angles, `d3.arc()` to generate SVG path data, and `d3.scaleOrdinal()` with `d3.schemeCategory10` for coloring rating categories. A legend identifies the color mapping for each rating range.

Pp99vijaya@gmail.com
79% match
Loading thumbnail…

Fork of Piechart of NYC Food Data

This pie chart visualizes the net worth of movies in billions, using a dataset of movies from a CSV file. The chart displays labeled segments and a legend with movie titles and their corresponding values, with colors assigned via a categorical scale. Built with D3 v5, it uses the `pie` and `arc` generators to create the chart, and `scaleOrdinal` for color mapping. The data is fetched from a GitHub-hosted CSV, and the visualization is rendered in SVG within an HTML page.

Ggaddamthanmayeereddy759@gmail.com
79% match
Loading thumbnail…

Assignment_7_piechart

This pie chart displays the share of music revenue (in millions USD) across top years, with each slice labeled by its percentage of the total. The SVG rendering combines a pie on the left and a legend on the right, both drawn inside a single responsive viewBox. Using d3.pie and d3.arc for slice generation, the code loads data from a remote CSV, applies a d3.scaleOrdinal with schemeSet2 for colors, and adds interactive tooltips via appended title elements. The legend lists each year with its value and percentage, built through D3 data joins.

JJaswanthKoorapati@my.unt.edu
78% match