Cost of Living - Parallel Coordinates

100%

Cost of Living - Parallel Coordinates

✓ Published0🌍 Public

Last edited Feb 9, 2016

Created on Jan 4, 2012

A parallel coordinates plot displays the cost-of-living index for 90 cities across six dimensions—consumer price, rent, consumer price plus rent, groceries, restaurant price, and local purchasing power. Each city appears as a polyline connecting its values on vertical axes, with grey background lines for all cities and blue foreground lines for those selected via brushing. The visualization uses D3 v3, reading a CSV file, scaling each dimension with d3.scale.linear, and enabling interactive brush filters that hide non-matching lines.

AI-generated description

It would be helpful if this were coordinated with a symbol map so that you could see the locations of the selected cities…

gpl-3.0 Licensed

Similar vizzes

Loading thumbnail…

Untitled

This parallel coordinates chart visualizes the cost-of-living index across 74 cities, comparing six dimensions such as consumer price, rent, groceries, and local purchasing power. Grey background paths show all cities, while blue foreground paths highlight those selected via interactive brush filters on each axis. Built with d3.svg, d3.scale.ordinal, and d3.svg.brush, the visualization uses SVG rendering. User interaction toggles the display of foreground lines based on brush extents, providing dynamic focus on subsets of the data.

Mmuzzheng

81% match

Loading thumbnail…

Parallel Coordinates

This parallel coordinates chart uses color-coded polylines to display country-level survey data across multiple dimensions, including happiness, art/education, environmental concern, and organizational memberships. Built with D3.js v3, the visualization renders SVG paths for both background context (gray) and foreground focus (steel blue) lines. The code implements interactive brushing via `d3.svg.brush()` to filter data, and uses `d3.behavior.drag()` to allow users to reorder axes by dragging. Axis labels are mapped through `d3.scale.ordinal()` and `d3.scale.linear()`, with data loaded from the `total4.csv` file.

KKanwalNayan

74% match

Loading thumbnail…

parallel coordinates

This parallel coordinates chart displays six dimensions of college data—including parental income, kid earnings, and mobility rate—across six tiers of institutions, with each tier color-coded via `d3.svg.line` strokes. The visualization uses `d3.scale.ordinal` for axis placement and `d3.scale.linear` for each dimension, rendering gray background paths for all records and colored foreground paths for focus. Users can brush along any axis using `d3.svg.brush`, which filters the foreground lines to highlight subsets. Data comes from the embedded `mrc_table.csv` file.

GGoomble

74% match

Loading thumbnail…

Parallel Coordinates

This parallel coordinates chart compares countries across multiple demographic dimensions, including happiness, environmental concern, and membership in groups like religious or professional organizations. Grey background lines show all data for context, while blue foreground lines can be filtered by brushing along an axis, which hides unrelated countries. Built with d3.v3, it uses d3.svg.brush and d3.svg.axis to support interactive dimension dragging and brushing. Data comes from the local total4.csv file, with most values normalized to a 0–100 scale.

OOhayouKaminari

74% match

Loading thumbnail…

Parallel Coordinates

This parallel coordinates plot uses gray background lines to show all countries and blue foreground lines for focus, with each axis representing a dimension from the total4.csv dataset (Happiness, Art/Educational, Environmental, and other membership categories). Users can drag axes to reorder dimensions via `d3.behavior.drag`, and brush along axes with `d3.svg.brush` to filter which lines remain visible. The code builds SVG paths with `d3.svg.line`, applies linear scales per dimension, and animates reordering using `transition`.

Cchungmin-yu

73% match

Loading thumbnail…

Parallel Coordinates

This interactive parallel coordinates chart displays survey data on happiness and organizational membership across countries. Each vertical axis represents a dimension like Happiness or Religious group participation, with polylines connecting values for each country. Users can brush along axes to filter the data, and drag dimension labels to reorder them, with smooth animations during transitions. Built with D3 v3, the visualization uses SVG paths for the lines and backgrounds, plus the `d3.svg.brush` API for the brushing interaction and `d3.behavior.drag` for axis reordering. The data comes from a CSV file with null values handled gracefully.

Llubin-liu

71% match

Loading thumbnail…

Parallel Coordinates

This visualization uses parallel coordinates to compare country-level indicators like happiness, environmental engagement, and religious participation, with each country represented by a drawn path. The code loads data from a CSV file using `d3.csv` and renders the chart with D3 v3’s SVG and animation support. Users can drag any axis to reorder dimensions, and the `d3.svg.brush` component enables filtering along individual axes, temporarily hiding background paths during interaction. The visualization also uses ordinal and linear scales to map categorical dimensions and quantitative values to screen coordinates.

Eerin1234567

71% match

Loading thumbnail…

Parallel Coordinates

This parallel coordinates chart displays survey data on happiness and membership in various organizations (e.g., religious, labor unions, sports) across multiple countries. Gray background lines provide context, while blue foreground lines highlight each country’s profile. Built with D3 v3, it uses `d3.svg.line`, `d3.svg.axis`, and `d3.svg.brush` for interactive filtering. Users can drag axes to reorder dimensions or brush along an axis to highlight matching lines. SVG rendering with drag-and-drop animations updates the paths smoothly. Data is loaded from an external CSV file.

Wwinniepooh520

71% match