Ass8_Question4

100%

Ass8_Question4

✓ Published0🌍 Public

Last edited Apr 11, 2024

Created on Apr 11, 2024

This example visualizes the prevalence of AIDS in six African countries using a bubble chart, plotting the number of individuals living with AIDS against the year. Each bubble’s size represents the number of new diagnoses, and its color corresponds to the country via a custom color scale, with a legend for both size and color. The chart is built using D3 v7, loading CSV data from a GitHub gist, and employs `d3.scaleLinear` for positioning and radius, `d3.axisBottom` and `d3.axisLeft` for axes, and SVG circles for rendering.

AI-generated description

An example showing the capabilities of VizHub:

Loads D3 via UNPKG.
Demonstrates use of import from "d3".
Demonstrates use of import from local ES6 modules.

MIT Licensed

Similar vizzes

Loading thumbnail…

Bubble Chart in D3

This bubble chart visualizes the prevalence of AIDS in six African countries, plotting the number of individuals living with the disease on the y-axis against the year on the x-axis. The bubble size encodes the number of new diagnoses, while color distinguishes countries. The visualization uses D3.js v7 with SVG rendering and d3.csv for data loading, d3.scaleLinear for scales, and custom legends for size and color. It includes axes with formatted tick labels and a title, requiring side scrolling due to the chart's dimensions.

AAndrew Blakeslee Moore

93% match

Loading thumbnail…

task_4_questions

This bubble chart visualizes the prevalence of AIDS across six of the most-infected countries, plotting years on the x-axis, the number of individuals living with AIDS (in thousands) on the y-axis, and new diagnoses as bubble radius. The visualization uses D3.js v7 with SVG rendering, employing `d3.scaleLinear` for axes and bubble sizing, `d3.extent` for domain calculation, `d3.axisBottom` and `d3.axisLeft` for axes, and `d3.format` for number labeling. Data comes from the CORGIS AIDS dataset, provided by UNAIDS. The chart includes a legend for both bubble size and country-specific colors, with side scrolling required to view the full visualization.

HHarinathChakali33@gmail.com

89% match

Loading thumbnail…

Assignment 5: Bubble Chart

This bubble chart displays relationships between four HIV-related indicators across 20 countries using a 2020 dataset. The x-axis maps the total number of people living with HIV, the y-axis shows AIDS-related deaths, bubble size encodes new HIV infections, and bubble color represents adult HIV prevalence. The visualization uses D3.js v7 with SVG rendering. The code employs linear scales (`d3.scaleLinear`) for both axes, a square-root scale (`d3.scaleSqrt`) for bubble sizing, and a linear color scale (`d3.scaleLinear`) ranging from light blue to dark navy. Data is loaded from a CSV file using `d3.csv`, with a legend indicating infection and prevalence extremes.

Aamrubal

85% match

Loading thumbnail…

A6 - Bar Chart w/ Sequential Color Scale

This example visualizes new AIDS diagnoses in 2020 for six countries, using a horizontal bar chart where bar height encodes the diagnosis count and a sequential red color scale encodes the same quantitative value. The visualization includes an axis, gridlines, and a legend for the color scale. The chart is built with D3 v7, using `d3.scaleBand` for the categorical x-axis, `d3.scaleLinear` for the y-axis, and `d3.scaleSequential` with `d3.interpolateReds` for the color mapping. The legend is generated via the `d3.legendColor` API. Data comes from UNAIDS via CORGIS.

AAndrew Blakeslee Moore

81% match

Loading thumbnail…

Gist d6e714e97e5e937623a7

This visualization plots each country as a point positioned by latitude and longitude, with circle size representing total population and color indicating HIV/AIDS prevalence. The chart uses D3’s `d3.geoPath` and a geographic projection to place points over a world map background. Data is loaded from a CSV containing country statistics, and hover interactions reveal specific country details. The rendering relies on standard SVG elements with scales for sizing and color encoding, following a scatterplot-over-map approach.

LLTymn

78% match

Loading thumbnail…

HIV/AIDS Choropleth

This chart visualizes global HIV/AIDS prevalence among adults aged 15-49 for the year 2017, using a sequential color scale from yellow to red to indicate severity, with countries lacking data highlighted in red. Built with React and D3 v5, it renders an SVG map using a natural Earth projection via `d3.geoNaturalEarth1` and `d3.geoPath`, overlaying graticules and country borders from TopoJSON data. The prevalence values are loaded from a CSV file and mapped to each country by name, with a sequential scale (`d3.scaleSequential` and `interpolateYlOrRed`) determining fill colors.

WWaseem Medhat

77% match

Loading thumbnail…

Fork of Fork of HIV/AIDS Choropleth Map

This visualization displays the global prevalence of HIV/AIDS for the year 2017, mapping each country's infection rate with a yellow-to-red sequential color scale. Country boundaries are rendered as SVG paths using `d3.geoPath` with the Natural Earth projection, while graticules and sphere outlines provide geographic context. The data comes from an IHME CSV file, joined to country shapefiles via ISO numeric codes. Countries without matching data appear gray. The code leverages `d3.scaleSequential` with `interpolateYlOrRd`, processes topojson through the `topojson` library, and uses React hooks (`useState`, `useEffect`) to asynchronously fetch both the atlas and CSV data.

SSahar Ejaz

76% match

Loading thumbnail…

HIV / AIDS world map vis

This visualization presents a choropleth world map depicting HIV/AIDS prevalence rates for the year 2017. Country boundaries are rendered using the `geoNaturalEarth1` projection and `geoPath` from D3, with graticules and interiors drawn for context. The map is color-coded using a sequential yellow-orange-red scale (`scaleSequential(interpolateYlOrRd)`) applied to AIDS prevalence data, with missing data displayed in gray. The geographic data originates from World Atlas TopoJSON, while the prevalence statistics are sourced from a CSV dataset.

CCatalina Vajiac

76% match