Skip to main content
SimilarExport ZIP
100%

Cost of Excessive Alcohol Consumption By State

✓ Published0🌍 Public
AAndre J Denais
Last edited Dec 10, 2020
Created on Dec 4, 2020

This interactive scatterplot visualizes the cost of excessive alcohol consumption across U.S. states, sourced from NOAA data. Users can switch between three y-axis metrics—Cost Per Capita, Cost Per Drink, and Total Cost—via a dropdown menu built with React and the react-dropdown library. Each state is rendered as an SVG circle using D3 v6 scales and axes. Hovering over the legend highlights corresponding data points by adjusting circle opacity.

AI-generated description

This data was requested and collected from the NOAA.
Created using D3 and js, this time with a menu for the y axis.

MIT Licensed

Similar vizzes

Loading thumbnail…

Cost of Excessive Alcohol Consumption by State

A choropleth on a Natural Earth projection shows the cost of excessive alcohol consumption per capita by U.S. state, with circles sized by state population. The visualization uses React to render an SVG, importing `d3.geoEqualEarth`, `d3.geoPath`, and `d3.geoGraticule` for the map and graticule, while `d3.scaleSqrt` maps population to circle radius. State boundaries come from TopoJSON’s `states-10m.json`, and cost data is loaded via `d3.csv` from a GitHub gist. Land and sphere fills are styled in CSS, with semitransparent teal circles overlaid on the map.

AAndre J Denais
86% match
Loading thumbnail…

Alcohol Consumption in U.S.

This visualization depicts beer consumption per person in the U.S. from 2000 to 2017, using a filled area chart with a smooth curve to highlight the trend over time. It employs D3 v5 with SVG rendering, leveraging `scaleTime`, `scaleLinear`, `area`, and `curveBasis` to generate the path, alongside `axisBottom` and `axisLeft` for labeled axes. Data is loaded via `csv` from a VizHub-hosted dataset, with years parsed as dates and beer values converted to numbers.

CChooo4u
68% match
Loading thumbnail…

Entertainment Options in Different States

This example shows the cost of entertainment options in twelve U.S. states using a horizontal bar chart rendered as SVG with React. The chart displays state names on the y-axis and numerical cost values on the x-axis, with red tick lines and labeled axes. The code loads CSV data via D3’s `d3.csv` method, slices the first twelve records, and uses `d3.scaleBand` and `d3.scaleLinear` to map states and costs to pixel positions. React manages the data state and renders the SVG elements, including bars and axis ticks, within a single D3-powered component.

PPrasanth
68% match
Loading thumbnail…

Alcohol Consumption in U.S.

The chart displays annual per-person alcohol consumption in the U.S., tracking three beverage categories—Spirits, Beer, and Wine—over time as filled area paths. It uses D3 v5’s `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `area` with `curveBasis` to render smooth, stacked SVG paths, with a separate y-scale defined for each category. The data is loaded via `d3.csv` from a CSV file hosted on VizHub, and the visualization includes labeled axes and a title within an SVG canvas.

CChooo4u
67% match
Loading thumbnail…

Alcohol Consumption in U.S.

This visualization shows per-capita beer consumption in the United States from 1890 to 2013, with a distinct gap representing Prohibition. The chart uses an area generator with a basis curve to create a smooth, filled region under the line, rendering each data point as part of a single path. Built with D3 v5, it employs `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and the `area` helper, reading data from a CSV file. The SVG output includes axis labels, gridlines, and a title, with the maroon-filled area highlighting trends over time.

CChooo4u
67% match
Loading thumbnail…

Interactive Color Legend Scatterplot to determine Alcohol consumption Vs Life Expectancy

This interactive scatterplot visualizes the relationship between alcohol consumption and life expectancy across continents using WHO life expectancy data. The visualization employs d3.scaleLinear for both axes and d3.scaleOrdinal for the color legend, which maps continents to distinct colors. Users can hover over legend items to highlight data points from specific continents while fading others to 20% opacity. The React-based SVG rendering includes custom axis components and color legend handling, with interactive hover states managed through React state and d3 event handlers.

Aaishwarya8615
67% match
Loading thumbnail…

Global Alcohol Consumption Scatterplot

This scatterplot shows per capita alcohol consumption in liters for seven selected countries from 2010 to 2019, with each country assigned a distinct color. The visualization uses D3 v6’s `scaleTime` and `scaleLinear` to map years and consumption values to SVG circle positions, with axes rendered via `axisLeft` and `axisBottom`. Data comes from a WHO-derived CSV loaded with `d3.csv`, filtered to highlight trends in wine, beer, spirits, and total alcohol across the decade.

PPeter VanNostrand
66% match
Loading thumbnail…

3D Bar chart

This example shows a 3D vertical bar chart of per-capita alcohol consumption across nine U.S. states from January to June 2020. Each month is a category on the x-axis, with a series of stacked bars for each state, colored distinctly, and the z-axis labels the states. The chart uses the Highcharts library with the highcharts-3d module, enabling a 3D column view with configurable alpha, beta, and depth parameters. Data is hardcoded as arrays of [month, value] pairs for each state series, rendered with a grouped, non-overlapping layout.

SSUSHMA CHIRRA
66% match