wine_bar_scatter_menu

100%

wine_bar_scatter_menu

✓ Published0🌍 Public

Last edited Oct 28, 2022

Created on Oct 28, 2022

This interactive bar chart visualizes wine quality scores across two wine types, with a dropdown menu to switch between red and white wines and another to select which chemical attribute (such as alcohol, pH, or sulphates) is plotted as the bar height. The bars are sorted by quality and animate smoothly when the selections change. The visualization uses D3 v5 with SVG rendering, including `d3.scaleBand`, `d3.scaleLinear`, `d3.axisBottom`, `d3.axisLeft`, and transitions on the bar rectangles. Data comes from the embedded CSV file containing wine physicochemical properties.

AI-generated description

This bar chart shows population of the top 10 most populous countries. The data comes from the year 2018 estimate in United Nations: World Population Prospects 2017.

MIT Licensed

Similar vizzes

Loading thumbnail…

wine_bar_chart_menu_2data

This interactive bar chart visualizes the quality ratings of red and white wines, showing how various chemical attributes like acidity, alcohol, and pH compare across quality scores. A dropdown menu, built with the `dropdown_menu` module, lets users switch between white and red wine datasets and select which chemical attribute to display on the y-axis. The chart, rendered as SVG using D3 v5, animates bar transitions with `transition().duration(1000)` when selections change, sorting bars by quality and updating axes, labels, and the title dynamically. Data originates from a CSV file of wine properties.

SSophia Cofone

93% match

Loading thumbnail…

wine_scatterplot_menus

This interactive scatterplot explores chemical properties of red and white wines, allowing users to compare any two numeric variables from the dataset through dropdown menus. The visualization filters wines by type and renders maroon circles for red wines or golden circles for white wines. It uses D3 v5 with SVG and animated transitions, where circles expand from the plot center to their positions over one second. The code employs `d3.scaleLinear`, `d3.axisBottom`, `d3.axisLeft`, and `d3.csv` for data loading.

SSophia Cofone

90% match

Loading thumbnail…

wine_histogram

This interactive histogram displays the distribution of wine quality ratings, with a dropdown menu allowing viewers to switch between different chemical attributes. The chart animates bar transitions when the selected variable changes. Built with D3 version 7, it uses `d3.histogram()`, `scaleLinear`, and `axisBottom` to render the SVG visualization. The data comes from a semicolon-delimited CSV file containing wine properties, and the code includes a custom `dropdownMenu` module for user interaction.

SSophia Cofone

88% match

Loading thumbnail…

Wine quality

This interactive scatter plot explores the chemical attributes of white wine samples from a dataset of wine quality. Users select any two attributes via dropdown menus to visualize their relationship, with axis labels updating dynamically and points rendered as circles. The visualization uses D3.js for scales and CSV parsing, React for state management and UI components, and SVG for rendering. The data comes from a GitHub-hosted CSV file of wine quality measurements.

Ssb15jr@student.aau.dk

86% match

Loading thumbnail…

wine_scatterplot

A scatterplot shows wine quality ratings along the x-axis against alcohol content on the y-axis, with each wine represented as a semi-transparent golden circle. The visualization uses D3 v7’s `scaleLinear`, `axisBottom`, and `axisLeft` to map the data, which is loaded from a semicolon-delimited CSV file. The source data contains wine attributes like fixed acidity, pH, and sulphates, though only quality and alcohol are plotted. The SVG rendering includes gridlines and labeled axes, with circles sized at a fixed radius of 10.

SSophia Cofone

85% match

Loading thumbnail…

scatter plot on wine

This interactive scatter plot matrix visualizes the relationships among several chemical properties of red wine, with each cell showing a pairwise comparison of attributes like fixed acidity, volatile acidity, and pH. Color-coded points represent wine quality ratings, and users can brush over a cell to highlight corresponding data points across all other plots, with tooltips revealing exact values on hover. Built with D3 v4, the visualization uses `d3.scaleLinear`, `d3.axisBottom`, `d3.axisLeft`, and `d3.brush` for interactive selection. The data comes from the included `winequality-red.csv` file, rendered as SVG elements within a grid layout.

TThanaporn-sk

85% match

Loading thumbnail…

A6_Q3

This scatter plot shows the relationship between alcohol content and quality ratings for red and white wines, with each point colored by wine type. The visualization uses D3 v7 to parse inline CSV data and render an interactive SVG chart with labeled axes. Hovering over a point enlarges it and displays a tooltip showing the wine type and quality score. The chart employs d3.scaleLinear for coordinate mapping, d3.axisBottom and d3.axisLeft for tick marks, and d3.scaleOrdinal to assign red and yellow colors to the respective wine categories.

SShashankkodishala@my.unt.edu

84% match

Loading thumbnail…

Scatter Plot with Menus on Wine Recognition Dataset

This scatter plot from the Wine Recognition dataset lets users explore relationships between 13 chemical attributes of three wine varieties. Dropdown menus select which attributes appear on the x- and y-axes, while a fixed color encoding distinguishes the wine classes. Built with React and D3 v5, the SVG visualization uses `scaleLinear` for axes, `scaleOrdinal` for colors, and renders circles with tooltips that display the wine type and coordinate values. The data is loaded as CSV via `d3.csv`.

Llintonylin

82% match