Interactive bar chart of food categories

100%

Interactive bar chart of food categories

✓ Published0🌍 Public

Last edited Oct 27, 2021

Created on Oct 13, 2021

Forked from Bar plot of Yelp data: review counts vs. stars

This interactive bar chart displays the number of top-rated restaurants in Greater Boston serving different regional food categories, sorted by restaurant count. The visualization uses an SVG-based bar chart built with D3 v5, employing `scaleBand` and `scaleLinear` to map food categories and restaurant counts to screen coordinates. Hovering over a bar reveals a tooltip with the exact restaurant count via mouseover events. Data comes from the public Yelp dataset, filtered to restaurants rated four stars or higher, and is loaded from a CSV file using D3's `csv` function.

AI-generated description

Interactive bar chart of food categories in top rated restaurants.

The original dataset is from public Yelp dataset.

The data used for this visualization is filtering on top-rated restaurants in Greater Boston (GB) area. Top-rated restaurants are defined as 4 stars or above.

This bar chart shows what type of food (in terms of regions) served in top-rated restaurants in GB area, and sort them in amounts of restaurants. We can tell that there are over 2000 restaurants are new/traditional American food related, and we also have over 1500 top-rated restaurants serve Italian food.

I added an interaction for hover highlighting such that when the user places their mouse above a bar in the plot, the exact number of restaurants would show up.

*This is a part of week 7 assignment: Project Momentum

MIT Licensed

Similar vizzes

Loading thumbnail…

Interactive map of top-rated restaurants in Greater Boston

This interactive map visualizes the distribution of top-rated restaurants (4 stars or above) across Greater Boston, using data from the public Yelp dataset. A drop-down menu filters the choropleth by cuisine type, while hovering over a town displays its name and restaurant count in a tooltip. The map supports zooming and panning via d3.zoom. It uses d3.geoPath with a geoIdentity projection to render TopoJSON town boundaries, and d3.scaleThreshold to map restaurant counts to a sequential red color scale.

MMing Liu

87% match

Loading thumbnail…

Bar plot of Yelp data: top cities

This bar chart displays the top 10 cities in the Greater Boston area by number of Yelp-rated restaurants with four stars or higher, using a horizontal layout where the x-axis shows restaurant counts and the y-axis lists cities. The code loads a pre-filtered CSV dataset derived from the public Yelp dataset and uses D3 v5’s `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to render an SVG bar chart. Bars are colored purple, with a clear title and labeled axes, highlighting Boston’s dominance with over a thousand qualifying restaurants.

MMing Liu

85% match

Loading thumbnail…

Brushable bar chart, try 3...

A brushable bar chart visualizes the number of top-rated restaurants (4+ stars) across Greater Boston cities, sorted from highest to lowest count. The main panel displays the full ranked list, while a small miniature overview enables brushing to zoom the y-axis domain, revealing detailed bars for a selected range of cities. Built with D3 v3 and SVG, the chart uses `d3.scale.ordinal` for city positioning and a linear zoom scale coordinated with a brush on the mini chart. Data comes from the public Yelp dataset, filtered to Greater Boston.

MMing Liu

85% match

Loading thumbnail…

Bar plot of Yelp data: review counts vs. stars

This bar chart displays the total number of Yelp reviews for top-rated restaurants (4 stars and above) in Greater Boston, grouped by star rating categories. The plot reveals that restaurants with 4 stars accumulate substantially more reviews than those with 4.5 or 5 stars. Built with D3 v5, the visualization uses `scaleBand` for the categorical x-axis, `scaleLinear` for the y-axis, and SVG rectangles to encode the data. The chart includes axis labels and a title, with data sourced from the public Yelp dataset.

MMing Liu

84% match

Loading thumbnail…

Brushable bar chart of number of top-rated restaurants in GB area

This brushable bar chart displays the number of top-rated restaurants across Greater Boston cities, with Boston’s count of 1,012 dominating the view. Users brush across the mini bar chart on the right to filter which cities appear in the main chart on the left. The implementation uses D3 v3 with SVG rendering, employing `d3.scale.ordinal` for bar positioning and `d3.svg.brush` to capture the brush extents. The y-axis zoom effect is achieved by mapping brush coordinates through `d3.scale.linear` to adjust the main chart’s domain. Data is loaded from a CSV containing city names and restaurant counts.

MMing Liu

84% match

Loading thumbnail…

Fork of Stacked bar chart of Yelp data: top cities

The visualization displays the top food types in the top cities near Boston, excluding Boston itself, based on Yelp restaurant counts. It uses a stacked horizontal bar chart, with each city row segmented by cuisine type, rendered as SVG in D3. The chart employs `d3.scaleLinear` and `d3.scaleBand` for axes, and includes an interactive tooltip that reveals the specific food type and count on hover. Data is loaded from a CSV file, and the color scale is defined manually using `d3.scaleOrdinal`.

AAndrew Petit

83% match

Loading thumbnail…

Fork of Fork of Stacked bar chart of Yelp data: top cities

This stacked bar chart displays the count of highly-rated restaurants (4 stars or above) across ten cuisine types for nine Massachusetts cities, excluding Boston. Each horizontal bar represents a city, segmented by food category using distinct colors from a custom ordinal scale via `d3.scaleOrdinal`. The visualization is built with D3.js v7, processing CSV data through `d3.csv` and `d3.stack`. Interactive tooltips appear on mouseover, showing the cuisine and its count, while a manually positioned legend lists food types alongside the axis.

RRahulSai05

83% match

Loading thumbnail…

Fork of Bar plot of Yelp data: top cities

This bar chart shows the top ten cities in the Greater Boston area by number of restaurants rated four stars or higher on Yelp, with Boston leading at over 1,000 establishments. The visualization aggregates raw Yelp dataset entries by city using JavaScript’s reduce method, then sorts and filters the results before rendering. The chart uses D3 v5’s `scaleLinear` for the x-axis, `scaleBand` for the categorical y-axis, and `axisLeft` and `axisBottom` to draw the axes with custom tick styling. Bars are appended as SVG rectangles with a purple fill, and the data comes from a local CSV file.

Aaniosindustries

82% match