Skip to main content
SimilarExport ZIP
100%

REUSABLE SCATTER - Rajan

✓ Published0🌍 Public
Kkhushburajan2015@gmail.com
Last edited Oct 26, 2025
Created on Oct 26, 2025

This interactive pie chart displays the population share of the top 8 U.S. cities compared to an aggregated "Other" category, with each slice labeled and color-coded. Built with the D3.js v7 library, the visualization programmatically computes the top cities from a provided CSV file and dynamically renders the pie using the `d3.arc` and `d3.pie` APIs for sector paths and layout, while a custom HTML legend updates alongside. The chart transitions smoothly using D3’s default animation on load, showing proportional percentages for each metropolitan area.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

RajanShah

This scatter plot visualizes the populations of major US cities, with each dot positioned along a vertical categorical axis for city names and a horizontal linear population scale. Dot size, color intensity, and position all encode population magnitude, while horizontal gridlines aid readability. Built with D3 v7, the visualization loads CSV data from a GitHub gist, uses `scalePoint` for the city axis, `scaleLinear` for population, and `scaleSqrt` for dot sizing. Hovering reveals a tooltip with the city name and exact population. The SVG renderer includes axis labels and a legend-free color scale using `interpolateBlues`.

Kkhushburajan2015@gmail.com
81% match
Loading thumbnail…

Fork of Fork of D3 Scatter Plot -Rajan

This scatter plot ranks major US cities by population magnitude, with each circle’s position and radius encoding the city’s population in millions, while a blue color gradient adds an extra visual cue. The chart loads a CSV from a GitHub gist and uses `d3.csv` with `d3.autoType` to parse the data. It draws axes, gridlines, and labels using `d3.axisLeft`, `d3.axisBottom`, and SVG text elements, while `d3.scaleLinear`, `d3.scalePoint`, and `d3.scaleSqrt` map population to x-position, city name to y-position, and circle size, respectively. Interactive tooltips appear on hover via `d3.select` and mouse events.

Kkhushburajan2015@gmail.com
79% match
Loading thumbnail…

ICE-7 Assignment Rajashekar Reddy

A pie chart displays 2022 population estimates for ten countries, with each slice sized proportionally to population and labeled via a legend listing country names and formatted values. The visualization uses D3 v5’s `pie`, `arc`, `scaleOrdinal` with `schemeCategory10`, and `format` to generate SVG paths and legend text. Data is loaded asynchronously from a JSON file, and the chart is rendered with an outer radius of 185 pixels within an 860 by 500 viewBox.

VVenkata Rajashekar Reddy Chinthala
76% match
Loading thumbnail…

Fork of Fork of HTML Starter - Rajan Shah

This animated scatterplot visualizes the population growth of U.S. cities by comparing 2020 and 2024 population figures on the x- and y-axes, with point size reflecting the absolute growth rate. Built with D3.js, it uses a custom scatter chart function that joins SVG circles with data, animating their entry, update, and exit via `.transition().duration()` calls. The code loads city data from a CSV file, applies linear scales, and includes an interactive tooltip that displays city specifics on mouseover.

Kkhushburajan2015@gmail.com
75% match
Loading thumbnail…

Fork of Scatter Plot with Color

This horizontal bar chart visualizes the population of US cities in millions, with bars sorted in descending order. The chart uses rectangular marks to encode population values through both position along the x-axis and bar length, while color provides a uniform visual style. The visualization is built using React with D3.js v7, specifically leveraging `d3.scaleLinear` for the continuous value axis and `d3.scaleBand` for the categorical city names. Interactive hover effects adjust bar opacity, and data is loaded from an embedded CSV string containing city-population pairs.

Kkhushburajan2015@gmail.com
75% match
Loading thumbnail…

Assignment7 Reusable Scatter Plot

This reusable scatter plot visualizes the relationship between population and area for the top 100 cities worldwide, with each data point representing a city. The chart uses D3 v7's `d3.csv` to load data from a local CSV file, `d3.scaleLinear` for both axes, and `d3.axisBottom` and `d3.axisLeft` to render the axes. The `scatterPlot` function encapsulates the chart configuration, accepting data and margin settings as parameters, making it easily reusable for different datasets. Points are drawn as SVG circles with steelblue fill and opacity, while axis labels are positioned using SVG text elements.

445.saiful@gmail.com
74% match
Loading thumbnail…

Fork of Fork of Refactored Bar chart with React & D3 -Rajan

The visualization displays US city population trends through two paired charts: a multi-series line chart comparing simulated population values for 2020, 2022, and 2024, and a combined bar-and-line chart showing 2020 bars with an overlaid growth-rate line. Built with React and D3 v7, it renders to a single responsive SVG using a viewBox. Data comes from a CSV file via `d3.csv`, with additional quantitative series generated through a seeded `mulberry32` random number generator. The implementation uses `d3.axisLeft` for grids, `d3.scaleLinear` for scaling, and a linear index-based x-axis.

Kkhushburajan2015@gmail.com
74% match
Loading thumbnail…

Activity 7

A pie chart visualizes the distribution of housing data by ocean proximity, with each slice colored and labeled to show the count of homes in each category. The chart includes a title and a legend displaying category names with their corresponding counts. Built with D3.js (v6), the visualization loads CSV data from a GitHub repository, uses `d3.pie` and `d3.arc` to generate the pie slices, and applies `d3.scaleOrdinal` with `schemeCategory10` for colors. The SVG rendering includes slice labels positioned via `arc.centroid` and interactive hover-free styling.

Pperamranji
73% match