Skip to main content
SimilarExport ZIP
100%

General Health vs Weight

✓ Published1🌍 Public
RRidhima Saxena
Last edited Dec 9, 2021
Created on Dec 8, 2021

This bar chart visualizes the relationship between general health ratings and weight using CDC survey data, with bars colored by gender. The visualization uses React to render SVG elements and D3 scales (scaleBand for health categories, scaleLinear for weight) to position marks. ColorLegend communicates gender encoding, while AxisBottom and AxisLeft components display tick marks. The chart highlights how weight distributions vary across self-reported health levels, with bars extending horizontally from zero to represent weight values for each health category.

AI-generated description

A bar chart visualization of the cdc dataset outlining general health against weight

MIT Licensed

Similar vizzes

Loading thumbnail…

Weight/Weight Desired for Males and Females

This scatterplot shows the relationship between age and weight-to-desired-weight ratio for males and females, using semi-transparent circles colored by gender. The visualization loads CDC health data via `d3.csv` and renders it as an SVG with React components. Axes are built with custom `AxisBottom` and `AxisLeft` components using `d3.scaleLinear`, while a `d3.scaleOrdinal` color scale differentiates genders. A `ColorLegend` component displays the categorical color mapping, and each circle includes a native SVG `<title>` element for hover tooltips.

RRidhima Saxena
82% match
Loading thumbnail…

Scatterplot of CDC Dataset describing Age (in Years) vs. Weight (in Pounds) for Males and Females

This scatterplot visualizes the relationship between age (in years) and weight (in pounds) for males and females from a CDC dataset. Points are colored by gender using `scaleOrdinal` with a color legend, and all circles render with 30% opacity to reveal overlapping data. The visualization uses React with D3 v5 scales (`scaleLinear`) to map data to SVG coordinates, with custom axis components for the bottom and left sides. Axes, titles, and labels are added as SVG text elements, while hover tooltips provide precise values via native SVG `<title>` elements.

RRidhima Saxena
78% match
Loading thumbnail…

Scatterplot of Body Mass Index for Different Health Statuses

This scatterplot shows the relationship between age and body mass index for individuals, with colors indicating their general health status. The chart uses a React and SVG rendering pipeline with d3.v5's scaleLinear for the x and y axes and scaleOrdinal for the color mapping. Data comes from a CDC dataset loaded via d3.csv. Hovering over any point displays the age as tooltip text.

RRidhima Saxena
77% match
Loading thumbnail…

Weight Treatment Data Visualization

This example visualizes average weight differences before and after treatment, grouped by gender, using diverging blue and pink bars. It builds a React component that loads CSV data via `d3.csv`, nests and aggregates it with `d3.nest` and `d3.mean`, then renders an SVG bar chart with `d3.scaleBand` and `d3.scaleLinear` scales. Axes are drawn using `d3.axisBottom` and `d3.axisLeft` via refs, while the bar heights encode positive and negative weight changes relative to a zero baseline.

Ssyedhaliz
77% match
Loading thumbnail…

Histogram of BMI by Age By Health Status

This histogram displays the average Body Mass Index across age groups for a selected health status. A dropdown menu toggles between Excellent, Very Good, Good, Fair, and Poor health categories, filtering the CDC dataset accordingly. The visualization uses D3 v7 with `d3.bin` to group ages and `scaleLinear` axes, rendered as SVG rectangles. React manages the component state, while BMI is calculated from weight and height using the formula weight/height² × 703. Axes include grid lines and rotated labels for readability.

RRidhima Saxena
76% match
Loading thumbnail…

Histogram of BMI by Age By Gender

This interactive visualization displays the relationship between age and average Body Mass Index (BMI) using a histogram, with a dropdown menu to switch between male and female data from the CDC dataset. The chart uses slanted-blue bars to show average BMI values within equal-width age bins. Built with React and D3.v7, it employs `scaleLinear`, `bin`, and `axisBottom`/`axisLeft` APIs to compute scales, bin the data, and render axes. The SVG graphic is generated declaratively, with BMI calculated from weight and height using the formula shown.

RRidhima Saxena
76% match
Loading thumbnail…

Weigh/Height Comparison on Gender

This scatter plot compares height and weight across genders, with each circle representing an individual and color-coded by gender. The visualization uses D3 v5’s `scaleLinear`, `axisBottom`, and `axisLeft` to map data from a CSV file onto an SVG canvas. Points are rendered as semi-transparent red circles, with axes labeled “Height” and “Weight” and a title “Height/Weight.” The code loads data from VizHub, parses numeric fields, and applies margins and tick formatting to create a clean, readable chart.

Cceltic660
75% match
Loading thumbnail…

Scatterplot of Body Mass Index for Males and Females

This scatterplot displays the relationship between age and body mass index (BMI) for males and females, using data from a CDC dataset. Each point is colored by gender via a d3.scaleOrdinal, with BMI computed from weight and height. The visualization is built with React and d3.v5, rendering SVG circles, axes, and a color legend. Axes and marks are generated using scaleLinear and custom React components, with loading states handled asynchronously.

RRidhima Saxena
74% match