Wine Equality

100%

✓ Published2🌍 Public

Last edited Jun 2, 2020

Created on May 21, 2020

This interactive visualization explores relationships among chemical attributes of red wine samples from a CSV dataset. Users select numeric attributes and a categorical color mapping, with an adjustable opacity slider. The chart renders as an animated, draggable parallel coordinates plot using D3.js v5, where axis anchor points can be repositioned. Dynamic selection updates the visualization through D3's data joins and event handlers.

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. It also demonstrates customization of D3 axes.

See also the first bar chart visualization that this one builds on: Making a Bar Chart.

MIT Licensed

Similar vizzes

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

84% match

Loading thumbnail…

Scatter Plot with Menus and Interactive color legend on Wine Recognition Dataset

This interactive scatter plot lets users explore the Wine Recognition dataset by selecting any two of thirteen chemical attributes for the x- and y-axes via dropdown menus. A categorical color scale distinguishes the three wine classes, and the interactive legend highlights points from one class at full opacity while dimming the others on hover, with tooltips revealing the exact values. Built with React and D3 v5, the visualization uses `d3.scaleLinear` and `d3.scaleOrdinal` for scales and renders SVG circles, with axes generated by custom components.

Llintonylin

82% match

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

81% 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

81% match

Loading thumbnail…

wine_bar_scatter_menu

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.

SSophia Cofone

81% 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

80% match

Loading thumbnail…

Wine Line Chart

The visualization displays the relationship between wine density and quality using a line chart drawn as an SVG path. It plots the two variables from a remote CSV dataset onto linear scales, with axis tick marks and labels styled in muted tones. The chart is built with React components and D3.js v5, using `scaleLinear` for the axes and the `line` API with `curveNatural` to create a smooth interpolated line through the data points.

Ggujjapooja7@gmail.com

79% match

Loading thumbnail…

K-means clustering of wine data

This visualization demonstrates the results of K-means clustering on the wine dataset, plotting each sample as a dot based on its Alcohol and Malic attributes, with colors indicating cluster membership. The code uses D3.js v3 to render an SVG scatterplot, employing d3.scale.linear for axes, d3.svg.axis for tick marks, and d3.scale.category20 for coloring clusters. Mouseover events trigger a tooltip showing cluster, Alcohol, and Malic values. Data comes from the clusters.csv file, which includes precomputed cluster assignments.

JJverma

78% match