Skip to main content
SimilarExport ZIP
100%

Clustered Bar Chart - Average Insurance Charges by Region

✓ Published1🌍 Public
RRaul Gamez
Last edited Sep 23, 2021
Created on Sep 16, 2021

This clustered bar chart displays average insurance charges across four US regions, comparing smokers (red bars) versus non-smokers (black bars) using data from an Insurance Expenses Dataset. The visualization uses D3 v6 scales—`scaleBand` for the region groups and subgroup categories, `scaleLinear` for the y-axis, and `scaleOrdinal` for color mapping. Data is loaded via `d3.csv` and grouped with a custom `groupBy` function that calculates averages by smoking status. The SVG rendering includes axis generators (`axisBottom`, `axisLeft`) and a custom legend, with bars shaded at 0.95 opacity.

AI-generated description

A clustered bar chart using D3 displaying data of insurance charges from the Insurance Expenses Dataset.

The region where the customers live is displayed on the x-axis, the average insurance charges in dollars on the y-axis and their smoking status on the color of the bars (black if they don't smoke or red if they do).

MIT Licensed

Similar vizzes

Loading thumbnail…

Scatter Plot - Insurance Charges by Age

This scatter plot visualizes insurance charges for individuals based on age, with each circle’s color indicating smoking status—red for smokers and black for non-smokers. The chart, rendered as SVG using D3 v6, loads data from a CSV file via `d3.csv`, applies linear scales via `d3.scaleLinear`, and uses `d3.axisLeft` and `d3.axisBottom` for axes. The code joins circles to data with `selectAll().data().join()` and sets fill opacity to 0.35.

RRaul Gamez
82% match
Loading thumbnail…

Insurance

The scatter plot shows medical insurance charges across patient ages, with points colored by smoking status to reveal that smokers incur consistently higher costs than non-smokers. The visualization uses the Vega-Lite API within a D3 v5 framework, binding CSV data loaded via `d3.csv` and rendering points with `vl.markPoint`. The chart encodes age and charges on quantitative axes via `vl.x().fieldQ()` and `vl.y().fieldQ()`, while the categorical smoker variable drives `vl.color().fieldN()`. Custom styling is applied through a Vega-Lite config object that adjusts axis labels and title fonts.

Llynz09
79% match
Loading thumbnail…

Vega-Lite Grouped Bar Chart

This grouped bar chart compares average BMI between smokers and non-smokers across different regions, using adjacent bars for each smoker status to make direct visual comparisons easier. The visualization loads medical cost data from a CSV file via d3.csv and renders with Vega-Lite, using the vega-lite-api to encode columns by region, x-axis by smoker status, and y-axis by average BMI. The color channel also maps to smoker status, and a tooltip displays the average BMI on hover. Display settings are customized through a config object that adjusts font sizes and axis styling.

MMartin Blatz
77% match
Loading thumbnail…

ICE-6 Scatter Plot

This D3.js scatter plot visualizes an insurance dataset, mapping BMI to charges for individual patients. Points are colored red for smokers and green for non-smokers, using a custom `scaleLinear` mapping for the axes. The visualization employs `csv` for data loading, `select` and `join` for SVG circle rendering, and `axisLeft`/`axisBottom` for labeled axes, with all text styled in cursive. The plot includes age and children values as `rx` and `ry` attributes on the circles, though these do not affect the visual output.

Ggayuvurukuti@gmail.com
76% match
Loading thumbnail…

Insurance charge in differnet US area

This visualization displays the average medical insurance charges across four U.S. regions, revealing that the Southeast has the highest average charge. The chart encodes region on the x-axis and the mean of the `charges` field on the y-axis, with tooltips showing the region name on hover. Built with Vega-Lite API on top of d3.v5, it uses the `markArea` mark for a single colored band per region and applies a custom dark theme from the config file. Data is loaded asynchronously from a remote CSV of medical cost records via d3's `csv` function.

Wwenleicao
75% match
Loading thumbnail…

Vega-Lite Grouped Bar Chart

This interactive visualization uses a grouped bar chart to compare average BMI between smokers and non-smokers across different regions, making adjacent bar comparisons straightforward. Built with Vega-Lite and rendered via the `vega-lite-api`, the visualization encodes region as columns, smoker status as x-axis and color, and average BMI as the y-axis. The data is loaded from a remote CSV using `d3.csv`, while custom axis styling removes domain lines and increases font sizes for readability. Tooltips display the average BMI on hover.

CCurran Kelleher
75% match
Loading thumbnail…

A6 Diverging Bar Chart D3

This diverging bar chart visualizes the percentage-point change in smoking rates between 2011 and 2012 across five countries, with positive differences extending rightward in blue and negative differences leftward in red from a central zero axis. The chart uses D3.js v7 to load the CSV dataset, compute the absolute maximum difference for symmetric axis scaling, and render SVG rectangles with horizontal orientation. A d3-scale linear color scale maps negative to positive values through light grey, while the d3-legend plugin adds a horizontal color legend. Hovering highlights bars in orange, and the chart includes labeled axes for both percentage difference and country names.

EEric Yao
72% match
Loading thumbnail…

A6 Barchart D3

This example visualizes the percentage of smokers in the United States from 1980 to 2012 using a vertical bar chart. Each bar’s height and color encode the recorded percentage value, with a sequential blue color scale mapped via `d3.scaleSequential` and `d3.interpolateBlues`. The chart includes axes, labels, a title, and a legend generated with the `d3-legend` library’s `d3.legendColor`. Data is loaded from a CSV file and rendered as SVG using D3 v7, with tooltips provided by appended `<title>` elements.

EEric Yao
71% match