Skip to main content
SimilarExport ZIP
100%

Activity 6_Question 3

✓ Published0🌍 Public
Ssairohithchada@gmail.com
Last edited Apr 1, 2025
Created on Apr 1, 2025
Forked from Hello VizHub

This scatter plot shows the relationship between area and elevation for a set of global cities, with each city colored distinctly and identified in a legend. The x-axis uses a logarithmic scale for area, while the y-axis uses a linear scale for elevation in meters. Built with D3.js v6, it loads CSV data from a GitHub gist and renders SVG circles using d3.csv, d3.scaleLog, d3.scaleLinear, d3.axisBottom, and d3.axisLeft. Tooltips are not implemented, but the data points are semi-transparent to reveal overlapping points.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Activity6_Question3

This scatter plot visualizes city data, mapping population on the x-axis against area on the y-axis, with each point colored by region using a categorical color scale. The code loads a CSV file from GitHub, parses it, and renders circles in an SVG using D3 v6 APIs such as `csv`, `scaleLinear`, `scaleOrdinal`, `axisLeft`, `axisBottom`, and `entries`. A legend, built with appended rectangles and text, identifies the region colors. The visualization uses the browser’s full window dimensions and positions axes with margin conventions.

KKhushi Desai
84% match
Loading thumbnail…

Activity6_question3

This scatter plot visualizes the cities dataset, showing each city as a circle positioned by its area (x-axis) and population (y-axis), with colors indicating the region. It uses D3 v6 APIs including `csv`, `scaleLinear`, `axisLeft`, and `axisBottom` to load data from a GitHub CSV URL and render an SVG chart. The code sets fixed dimensions, applies margins, and uses a switch statement to assign distinct colors to North America, South America, Europe, Asia, and Africa, while smaller tick labels improve readability.

PPreethi Medepalli-91
82% match
Loading thumbnail…

Activity6_question3

A scatter plot displays global cities by population on the x-axis and GDP in billion USD on the y-axis, with each city’s points colored via a categorical scale using `d3.scaleOrdinal` and a combined `schemeCategory10` and `schemeSet3` palette. The visualization loads a CSV from a GitHub raw URL using `d3.csv`, parses numeric fields, and renders circles with `d3.selectAll('circle')` and `.enter()`. Axes are generated with `d3.axisBottom` and `d3.axisLeft`, formatted using `d3.format('.2s')`, and a legend lists city names with matching color swatches. The SVG output uses D3 v6 with a light-gray background and Arial font.

Vvenkatdinesh5010@gmail.com
82% match
Loading thumbnail…

Activity6_Question3

This D3.js v7 example displays a scatter plot of city data, plotting population against area and using distinct symbols to represent different regions. The visualization fetches its data from a CSV file hosted on GitHub and renders it into a full-window SVG. It uses `d3.scaleLinear` for axes, `d3.scaleOrdinal` with `d3.symbols` for region-based shapes, and demonstrates a custom legend for mapping shapes to regions. The code loads D3 via UNPKG and uses local ES6 modules for its component structure.

KKhushi Desai
82% match
Loading thumbnail…

ACTIVITY 6 Q3

This scatter plot visualizes the relationship between average temperature and humidity across ten cities, with each point colored by continent. The visualization uses D3 v7 to render SVG circles, with `d3.scaleLinear` for both axes, `d3.scaleOrdinal` for the categorical color mapping, and `d3.axisBottom`/`d3.axisLeft` for the tick marks. A static legend groups the five continents, while the data comes from a hardcoded array in the script.

Rragasrikakarla27@gmail.com
78% match
Loading thumbnail…

Activity6_Question 3

This scatter plot displays real estate prices against square footage for 17 properties across European cities, with each city represented by a distinct color from the d3.schemeSet2 palette and labeled in a legend. The visualization uses d3.csv to load the data, d3.scaleLinear for both axes, and d3.scaleOrdinal for city colors. Interactive tooltips appear on mouseover using D3 transitions, showing city, size, and price. The SVG rendering includes axis labels, tick marks, and a color-coded legend positioned to the right of the plot area.

Ppraneeth.d555@gmail.com
77% match
Loading thumbnail…

Activity8_Question3

This scatter plot visualizes the relationship between height and weight, with points colored by category to reveal grouping patterns. The visualization renders as an SVG generated with D3.js v7, using `d3.csv` to load data from a remote GitHub repository and `d3.scaleLinear` for axis scaling. Points are drawn as SVG circles and colored via `d3.scaleOrdinal`, with interactive tooltips appearing on mouseover. The chart includes axes and a legend created through custom drawing functions, all styled through a separate CSS file.

Vvishnupriyapalagiri@gmail.com
77% match
Loading thumbnail…

Activity6_Task3

This scatter plot displays the relationship between average temperature and rainfall across multiple cities, using distinct colors and symbol shapes to differentiate each city. Data is loaded from a remote CSV file and rendered as an SVG using D3 v7. The visualization employs `d3.scaleLinear` for both axes, `d3.scaleOrdinal` with `d3.schemeCategory10` for colors, and `d3.symbol` types for the data points. A legend and axis labels are included to clarify the mapping.

Rrahman.mehmood2002@gmail.com
76% match