Skip to main content
SimilarExport ZIP
100%

Beer Reviews on a Map

✓ Published1🌍 Public
Mmilepore@gmail.com
Last edited Oct 29, 2024
Created on Oct 21, 2024
Forked from World Cities

The map displays beer reviews as colored dots overlaid on a world map, with each dot's hue indicating the review score on a red-to-green gradient. Users can pan and zoom interactively. The visualization uses the `d3.geoNaturalEarth1` projection and `d3.geoPath` to render country outlines and graticules, while `d3.zoom` and `d3.drag` handle navigation. Review data comes from the `@milepore/beer_ratings_and_locations` package, with scores mapped via `d3.scaleLinear`.

AI-generated description

A world map showing cities.

MIT Licensed

Similar vizzes

Loading thumbnail…

Beer Explorer

This example visualizes beer ratings and locations on an interactive world map, with each review shown as a colored dot. The dots range from red (low rating) to green (high rating) via `scaleLinear`, overlaid on country outlines from the `visionscarto-world-atlas` TopoJSON data. Users can pan and zoom using `d3.drag` and `d3.zoom`, while a `geoNaturalEarth1` projection and `geoPath` render the graticule and map shapes. The visualization is built with React state management, D3.js, and topojson-client, rendering geospatial data as SVG.

Mmilepore@gmail.com
90% match
Loading thumbnail…

Beer Reviews on a Map (old)

This interactive visualization presents a world map where individual points mark cities with populations greater than 50,000, using data from Simplemaps’ World Cities Database. The map uses a natural Earth projection with graticules, landmasses, and country boundaries rendered as SVG paths via d3.geoPath. Points are drawn as semi-transparent circles through React components, with the projection applied to each city’s longitude and latitude coordinates. Geographic data comes from the World Atlas TopoJSON, while styling defines muted fill colors for land, sphere, and graticule layers.

Mmilepore@gmail.com
85% match
Loading thumbnail…

BeerRatingsAndLocations

A scatterplot-style map visualization plots beer ratings by style and geography, using latitude and longitude coordinates from the BeerAdvocate dataset. Each point represents a brewery’s beer, colored by style family, allowing users to explore rating patterns across regions and categories. The Svelte component loads CSV data via `data.csv` and `beer-style-families.csv`, parses numeric columns, and joins styles to family groupings. The initial view displays a JSON preview of the first data record, with the full dataset exported for interactive map rendering.

Mmilepore@gmail.com
78% match
Loading thumbnail…

Beer Style

This visualization explores the craft beer landscape by showing how the top 20 beer styles vary in rating, popularity over time, ABV, IBU, and production across US states. It combines multiple linked charts, including kernel density plots for ratings, ABV, and IBU, plus a state-based histogram, using D3 v7’s `kde` and `epanechnikov` functions for density estimation. Users interact via a multi-select dropdown and slider to filter beer styles and rating ranges, with SVG transitions updating the charts. The data appears to come from a beer review dataset, with the visualization built using D3 and jQuery UI for the slider, and rendered as animated SVG elements.

CChao Pang
71% match
Loading thumbnail…

Beer Style Explorer Pseudo-Viz

The Beer Style Explorer pseudo-viz combines bar length and line marks to compare beer styles. Bars encode the number of reviews per style, while an overlaid red line uses y-position to show the average rating for each style. The visualization uses D3's `select` and `line` APIs, with `scaleBand` and `scaleLinear` for the axes, and `axisBottom`, `axisLeft`, and `axisRight` to render the chart. Both signals are presented on a shared categorical x-axis, with the line connecting the average ratings across styles.

Mmilepore@gmail.com
71% match
Loading thumbnail…

Beer vs Wine - US

This choropleth map shows the ratio of wine to beer consumption by US state, with a color gradient from dark red (lower values) to yellow (higher values). The visualization uses a D3 Albers USA projection via `d3.geoAlbersUsa()` and `d3.geoPath()` to render state boundaries from the included GeoJSON, while integrating beerwine.csv data through `d3.csv()`. A linear color scale (`d3.scaleLinear()`) maps data values to the chosen palette, and a legend with a gradient swatch and axis (`d3.axisRight()`) displays the value range. The map is rendered as SVG paths.

LLichtphyz
69% match
Loading thumbnail…

Top Beer Producing Countries

A dark map shows the world's top 20 beer-producing countries as animated, color-coded circles sized by output and positioned at their geographic coordinates. Circles and labels fade in sequentially, then transition smoothly between states using d3-transition with `easeLinear` and staggered delays. Data comes from a CSV (2024 list) and is parsed, scaled, and projected onto the SVG canvas using D3's `select`, `join`, and `transition` APIs. The animation runs continuously, updating positions and radii in response to the underlying dataset.

Mmilepore@gmail.com
68% match
Loading thumbnail…

Eating Around the World

This choropleth map visualizes the user’s restaurant ratings across countries, with each nation shaded according to its review score on a red ordinal scale. Users click legend circles to filter countries by rating, which also dims non-matching regions and the background sphere. Built with D3 v5, the visualization uses `geoNaturalEarth1` projection, `geoPath`, and `zoom` for map interaction, while data is loaded via `tsv`, `json`, and `csv` from the World Atlas TopoJSON and a traveler dataset. Hovering reveals country names, restaurant details, and star ratings in tooltips.

Jjons288
68% match