Skip to main content
SimilarExport ZIP
100%

Fork of Solar System

✓ Published0🌍 Public
Eeschuman20@gmail.com
Last edited Jan 23, 2024
Created on Jan 23, 2024
Forked from Solar System

This fork of the Solar System visualizes the top seven men's tennis players by Grand Slam wins, with player position along the X-axis indicating their year turned pro and circle size proportional to title count. A nested arrangement breaks down totals into Australian Open, French Open, Wimbledon, and US Open wins, each color-coded by court surface (red for hard, orange for clay, green for grass). The animation uses d3 transitions with linear easing to emphasize relative proportions. Data comes from Wikipedia’s List of Grand Slam men’s singles champions.

AI-generated description

A visualization of the top 7 mens tennis players based on Grand Slam Wins. -The placement on the X direction represents the year a player turned pro (starting at 1960 to 2008) -The size of the circle represents how many Grand Slams that player won: Vertically, starting from total titles followed by Australian Open, French Open, Wimbledon, and US Open titles in that order. -The colors of the tournament circles represent the surface (red=hard, orange=clay, green=grass)

Relative sizes to scale, distances not to scale.

Data from Wikipedia: List of Grand Slam men's singles champions.

Challenge

  • Option A: Use this template to visualize the relative size of various numbers.
  • Option B: Add SVG Gradients to make the planets look more planet-like
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of ICE - 7 Pie

This pie chart visualizes the number of wins (labeled as goals) for top tennis players, using a CSV dataset fetched from a GitHub gist. The chart encodes each player’s total as a colored slice, with labels showing the value in thousands and a legend listing player names and their corresponding totals. Built with D3 v5 and rendered as SVG, the code uses `d3.pie` to compute arc angles, `d3.arc` for path generation, `d3.scaleOrdinal` for color assignment, and D3's `csv` for data loading.

RRahulChaitu999
66% match
Loading thumbnail…

Fork of Solar System

This animated visualization displays the relative sizes of the Sun and planets, with distances not to scale. Each celestial body is represented by a circle that expands into view sequentially, followed by its name label. The code uses D3.js version 7.8.5, leveraging `select`, `transition`, and `easeLinear` from the library to orchestrate the animations. The data originates from Wikipedia's list of gravitationally rounded objects of the Solar System. The rendering features a black background with distinct fill colors for each planet, offering a clear, animated comparison of planetary dimensions.

Aakang47@gatech.edu
66% match
Loading thumbnail…

Fork of Solar System - Vignesh

A fork of a solar-system visualization renders the Sun and nine planets as gradient-filled circles in black space, with relative sizes to scale but distances compressed. Planet names and distances in astronomical units appear beneath each body. The D3.js code uses `select`, `transition`, and `easeLinear` for animated radius growth, plus `radialGradient` for shading. Randomly placed star circles twinkle, and a zoom transform enables panning. Data comes from Wikipedia’s list of gravitationally rounded solar-system objects.

Vvigneshs1006@gmail.com
66% match
Loading thumbnail…

Fork of Solar System

This animated visualization presents the solar system with planets scaled by relative size, while orbital distances are not to scale. Each celestial body appears as a colored circle, with a label beneath it, revealing its name. The animation sequentially grows the Sun and planets into view. The code uses D3’s `select` and `transition` APIs for rendering and animation, with data sourced from Wikipedia’s list of gravitationally rounded objects. The view is built using SVG circles and text elements, styled over a black background.

MMing Li
66% match
Loading thumbnail…

le cose del tennis

This bar chart displays the total points won in response by four tennis players during an ongoing tournament, with player names on the vertical axis and the count on the horizontal. The visualization uses D3 v5, reading data from a CSV file and rendering as an SVG. It employs `scaleLinear` for the x-axis, `scaleBand` for the y-axis, and `axisBottom` with tick marks, while custom CSS styles the red bars and large monospace labels.

HHombreLobotomia
66% match
Loading thumbnail…

Fork of SharanyaSriram

This chart shows the number of weeks each of the top 15 tennis players has played, ranked vertically with horizontal green bars. It uses React for component state and rendering, while D3 v5 handles CSV data loading and scales (`d3.csv`, `scaleBand`, `scaleLinear`). The SVG output includes custom gridlines and axis labels drawn manually via React elements, with a fixed 960×500 viewport. Data originates from a remote CSV file listing player names and weeks.

SSharanyaSriram
65% match
Loading thumbnail…

Fork of Solar System

This animated visualization presents the solar system with planets positioned across the screen, scaled proportionally to their actual radii while distances are compressed for clarity. Each celestial body and its label fades in sequentially from the sun outward, using D3’s `transition` and `easeLinear` for smooth motion. The code leverages D3’s data join to bind planetary data from Wikipedia, rendering circles and text elements with `selectAll` and custom transition delays. A black SVG background and distinct fill colors for each planet emphasize the size hierarchy, from Mercury to the sun.

Wwkj0713@gmail.com
65% match
Loading thumbnail…

Fork of Solar System

This animation displays the planets of the solar system in a horizontal line, with relative sizes to scale but distances not to scale. Each planet grows into view sequentially with a label, using D3 transitions. The code applies radial SVG gradients to several planets, such as Jupiter and Neptune, to give them a more dimensional appearance. The starfield background is randomly generated. Data on planet sizes and distances comes from Wikipedia’s list of gravitationally rounded objects.

Sshindeayush76@gmail.com
65% match