Airbnb Viz Week 12

Airbnb Viz Final

This interactive scatterplot analyzes Airbnb listings, showing the relationship between any two selectable property attributes, such as price against person capacity. A slider filters data by a chosen attribute's minimum value, and an overlaid density distribution reveals the concentration of data points along the y-axis. The visualization is built with React and D3 v7, dynamically loading CSV data for selected cities and weekdays directly from a GitHub repository. Users can compare multiple European cities, switch between weekdays and weekends, and adjust the density calculation between global and per-column modes.

94% match

Fork of London Airbnb Person Cap vs Price w/ Color & Interaction Week 11

This interactive scatterplot explores London Airbnb prices across various attributes, showing density distributions through a blue-to-yellow gradient with red average markers. Users can select which numeric property appears on the x- and y-axes, filter listings by minimum values for a chosen metric, and toggle between weekdays and weekends across multiple European cities. Built with React and D3 v7, it uses `scaleLog` for the y-axis, density calculations in pixel space, and dynamically loads CSV data from GitHub repositories.

85% match

London

A scatterplot maps Airbnb listings across London by latitude and longitude, with each point colored from red to green based on a normalized attraction index. The React app loads CSV data and passes it to a D3 visualization that renders axes, labels, and circles. D3's `scaleLinear` and `extent` set the geographic scales, while a custom color interpolation blends hex values between minimum and maximum index values.

London Airbnb Person Cap vs Price w/ Color & Interaction

This interactive scatterplot visualization explores London Airbnb pricing by person capacity, with user-selectable X and Y axes from multiple numeric property columns. The chart renders a density heatmap background using d3.scaleLinear, d3.scaleBand, and d3.scaleLog, computing per-pixel point density across the plot area and coloring regions from blue to yellow based on concentration. A yellow-to-blue gradient legend displays density levels with a red line marking the average. Users can filter data by minimum value via a range slider tied to any selected numeric property, with all controls updating the React-rendered visualization in real time.

London

This scatter plot maps Airbnb listings across London by latitude and longitude, coloring each point red or green to distinguish between non-superhosts and superhosts. The visualization uses D3’s `scaleLinear` for axis scaling and `selectAll` to render circles, with React managing the data loading and state. Axis labels and ticks are added via custom functions (`renderAxis`, `renderAxisLabels`), while the underlying dataset includes property attributes like price and room type for contextual analysis.

Airbnb Vienna

This scatter plot visualizes Airbnb listing prices across Vienna’s 23 boroughs, with each circle representing one apartment’s price on the x-axis and its borough on the y-axis. Using D3 v5, the code loads data from a CSV file and applies `scaleLinear` for both axes, `axisLeft` and `axisBottom` for tick marks, and SVG circles for data points. The chart’s opacity and teal fill create a density effect, while gridlines and axis labels clarify the price distribution per district.

VValentineAuer

AirBnb Data Visualized

This scatterplot displays the relationship between Airbnb listing prices and their reviews per month, with each circle representing a property. The visualization uses D3 v5 to load CSV data and render an SVG. It employs `scaleLinear` for both axes, `axisBottom` and `axisLeft` for tick marks, and appends circles with fixed radius to show the data points. The chart is titled "AirBnb Prices Vs Reviews Per month" and includes axis labels for clarity.

KKishore Thamilvanan