Skip to main content
SimilarExport ZIP
100%

Top Restaurants Barchart

✓ Published0🌍 Public
Jjjlaber
Last edited Feb 25, 2023
Created on Feb 25, 2023

This visualization shows the top five restaurants by order count from a NYC food delivery dataset, ranked in descending order. It uses a horizontal bar chart with a linear x-scale for order counts and a band y-scale for restaurant names. Built with D3 v7, the code employs `flatRollup`, `scaleLinear`, `scaleBand`, and `schemePastel2` for color encoding, with axes generated via reusable axis functions. The data is loaded from a CSV fetched from a GitHub gist and parsed with `csvParse`.

AI-generated description

Loading a dataset that has information on food orders/deliveries in NYC through the app Foodhub.

(Dataset from: https://www.kaggle.com/datasets/ahsan81/food-ordering-and-delivery-app-dataset)

Column Description/Data Types

order_id: unique id that is connected to each order (Ordinal)

customer_id: unique id that is connected to the customer ordering the food (Ordinal)

restaurant_name: name of the restaurant that the order is from (Categorical)

cuisine_type: type of food ordered (Categorical)

cost_of_the_order: how much the order cost (Quantitative)

day_of_the_week: either Weekend or Weekday, indicates when the order took place (Categorical)

rating: rating that customer gave on order (out of 5) (Quantitative)

food_preparation: time (in minutes) that it took the restaurant to prepare the order to be delivered (Quantitative)

delivery_time: time (in minutes) that it took for the order to be delivered to the customer (Quantitative)

MIT Licensed

Similar vizzes

Loading thumbnail…

Country and Implementation Rank

A donut chart displays the top cuisine types by number of orders from the Foodhub NYC food delivery dataset. The visualization uses D3 v7 with `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` to create colored arcs with a centered hole, while a legend identifies each cuisine. Interactive labels show order counts for cuisines exceeding 100 orders. Data loads from a CSV via `fetch` and `d3.csvParse`, processed with `d3.flatRollup` to aggregate counts per cuisine.

MManideeprenikindi
78% match
Loading thumbnail…

Piechart of NYC Food Data

This example shows the top cuisine types by number of orders in a NYC food delivery dataset, using a pie chart where slice values are labeled for categories exceeding 100 orders. A legend identifies each cuisine type by color. The visualization loads CSV data via `d3.csvParse` and uses `d3.flatRollup` to aggregate order counts, `d3.pie` to generate arc segments, and `d3.arc` with inner and outer radii to render the doughnut-style chart. The data originates from a Kaggle dataset on Foodhub app orders.

Jjjlaber
77% match
Loading thumbnail…

Barchart_Restaurantreview

This bar chart visualizes restaurant ratings for a subset of twelve establishments, sourced from a CSV file. The chart uses horizontal bars to compare ratings, with the length of each bar encoding the rating value. The visualization is built with React and the D3.js library, using `scaleBand` and `scaleLinear` to position bars and axes. The SVG rendering includes styled axes and a color palette, with the application's data loading handled by D3's `csv` function.

Bbhavana.bayyapu@gmail.com
76% match
Loading thumbnail…

Piechart Practice

This pie chart visualization shows the top cuisine types by number of orders from a NYC food delivery dataset sourced from Kaggle. It renders a donut chart with colored slices, labels showing order counts above 100, and a legend listing each cuisine type. The visualization uses d3.pie and d3.arc to generate the chart, d3.scaleOrdinal for color mapping, and d3.flatRollup to aggregate order counts by cuisine category. Data is loaded asynchronously via fetch and parsed with d3.csvParse.

TTammminana
75% match
Loading thumbnail…

Pie Chart of NYC Food Data

This pie chart visualizes the distribution of food orders by cuisine type from a Foodhub NYC delivery dataset. Slices are sized by order count, labeled with totals, and paired with a color-coded legend, showing a clear ranking of culinary preferences. The chart uses D3.js v7 APIs including `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` to group, sort, and render the data. The underlying data is loaded from a CSV file of order details, and the chart updates only after all records are parsed.

UUmarani Vemula
75% match
Loading thumbnail…

Fork of Barchart of the restaurant data

This horizontal bar chart visualizes restaurant ratings for the top 30 venues from a CSV dataset, using React with D3 v5 to render SVG marks. The chart displays restaurant names on the y-axis and their numerical ratings on the x-axis, with bar lengths encoded by the `scaleLinear` rating values. Gridlines and axis labels are generated using D3's `scaleBand`, `axisBottom`, and `scaleLinear` utilities. The code uses `csv()` to load external data and renders styled rectangles with a color palette defined in CSS, while the React component manages the asynchronous data loading and state updates.

Kkoteswararao614@gmail.com
75% match
Loading thumbnail…

Exploring NYC Food Ordering/Delivering Data

This visualization explores NYC food ordering and delivery patterns from a Foodhub dataset, initially showing the full data as a JSON preformatted block. The pie chart displays the distribution of orders by cuisine type, with each slice labeled and colored using a categorical color scale. Built with D3 v7, it uses `d3.pie` to compute arc angles and `d3.arc` to generate the pie paths, alongside `flatRollup` to aggregate order counts from the CSV data fetched from a GitHub gist.

Jjjlaber
74% match
Loading thumbnail…

Fork of Simple Bar Chart

This visualization displays the top 30 restaurants by their USD ratings in a horizontal bar chart, with restaurant names on the y-axis and numerical ratings on the x-axis. It is built using React (via `ReactDOM.render`) and D3 v5, leveraging `scaleBand`, `scaleLinear`, and `max` for data processing. The chart loads data from a CSV file fetched via a Google Drive URL, and it renders SVG rectangles with customized axis labels. The file input in the header allows users to load their own CSV, though the main chart uses the pre-loaded dataset.

Ttejasviteegala@my.unt.edu
74% match