Skip to main content
SimilarExport ZIP
100%

Outlier Visualization 2E

✓ Published1🌍 Public
OOleJRask
Last edited Dec 15, 2021
Created on Dec 15, 2021

This example displays a scatter plot matrix of 36 pairwise combinations from 12 selected columns of the Cardiology dataset, with each point colored by its outlier status. Built with the Vega-Lite API and rendered using d3.v7, it uses repeated row and column encodings with `vl.markCircle`. A brush parameter allows users to select points via Ctrl-click, while the panzoom library enables zooming and panning on the entire chart.

AI-generated description

A visualization constructed using the vega-lite-api.

The data shown here comes from the UCI Machine Learning Repository: Auto MPG Data Set, via Gist: Scatter Plot with Menus.

MIT Licensed

Similar vizzes

Loading thumbnail…

Outlier scatter matrix 08

This visualization shows a scatter plot matrix of 36 pairwise combinations across 12 columns and 3 rows from a cardio dataset, with points colored by an "Outlier" quantitative field to highlight anomalous observations. Users can select data points by clicking with the Ctrl key held down, which toggles their color to red across all plots via a union resolution selection parameter. The code uses the vega-lite-api library to define the repeat-based matrix, d3.csv for data loading, and panzoom for zooming and panning the entire chart surface.

OOleJRask
89% match
Loading thumbnail…

Outlier scatter matrix 09

This scatter matrix reveals patterns in the Cardiotocography dataset by plotting 12 column attributes against 4 row attributes, with each point colored by its quantitative outlier score. Built with the vega-lite-api and rendered through vega-lite and vega, the visualization repeats a circle mark across rows and columns using vl.repeat(). Panning and zooming is enabled via the panzoom library, only activating with the Alt key. Data loads asynchronously from a CSV using d3.csv, and the appearance is customized through a shared configuration object.

OOleJRask
87% match
Loading thumbnail…

Outlier scatter matrix 03

This example displays an outlier scatter matrix of cardio data, highlighting relationships among numeric attributes with a dense grid of small multiples. A draggable viewport lets users pan across the rendered scatterplot, shifting an oversized SVG map containing a red circle to explore off-screen portions. The visualization is built with the Vega-Lite API and D3, using d3.csv to load the dataset. The viewport interaction is implemented by manually tracking mouse events with onmousedown, onmousemove, and onmouseup, adjusting the map’s absolute position within a clipped container.

OOleJRask
85% match
Loading thumbnail…

Outlier scatter matrix 06

This visualization displays a scatter plot matrix of cardio patient data from the UCI Machine Learning Repository, organized as a grid of 21 columns and 2 rows. Each cell plots one variable against another, with points colored by the nominal `Class` field. The visualization uses the vega-lite-api to construct the chart, with panzoom enabled for zooming via the Alt key. Users can select outliers by Ctrl-clicking points, which highlights them in red through the `selectPoint` parameter. The chart is rendered with d3.v7 and vega-lite 5.2.0.

OOleJRask
85% match
Loading thumbnail…

Outlier scatter matrix 07

This scatter plot matrix displays a grid of pairwise comparisons between cardiovascular measurements, with each cell visualizing the relationship between two variables as a tight cluster of small points. The visualization is built using the vega-lite-api, which registers both Vega and Vega-Lite to render the chart, and pulls data from a CSV hosted on GitHub. The design employs a minimal axis configuration with hidden gridlines and tiny labels, and users can select individual points by holding the control key while clicking, highlighting them in red to identify potential outliers across the dataset.

OOleJRask
84% match
Loading thumbnail…

Outlier Visualization 2E 2

This visualization uses the Auto MPG dataset to explore outliers across 20 numeric attributes through a large scatter plot matrix, with each cell showing the relationship between two attributes. Users can brush to select a region, which highlights points identified as outliers in orange while dimming others to light gray. Built with Vega-Lite API and D3 v7, it repeats the same circle mark across rows and columns, applies a selection interval for brushing, and includes pan/zoom functionality via the panzoom library.

OOleJRask
83% match
Loading thumbnail…

Outlier Visualization 3F

This visualization presents a 2x2 matrix of heatmaps for the Old Faithful dataset, showing binned counts of four quantitative variables (1, 2, 3, 4), with color encoding the mean outlier value per bin. An interactive brush parameter allows selecting intervals across plots to conditionally highlight outlier means in green, while unselected bins appear grey. Built with Vega-Lite 5.2, Vega 5.21, and Vega-Embed 6.20, the visualization uses a repeated specification with `bin: {maxbins: 30}` for x-axes, `bin: {maxbins: 20}` for y-axes, and a `greens` heatmap color scheme, rendering as SVG within a D3.v4 environment. Data loads via `d3.csv` from a cardio-outlier dataset URL.

OOleJRask
81% match
Loading thumbnail…

Outlier scatter matrix 02

This is a small-multiple scatter plot matrix that compares pairs of numeric columns, labeled "1" and "2", against each other to reveal outliers and clusters in the data. The plot uses color to distinguish classes and drops the legend for a cleaner view. It is built with the vega-lite-api and vega-tooltip, loading CSV data from the UCI Auto MPG dataset. The chart is embedded in a full-screen HTML page, with its size dynamically set to a fraction of the window dimensions.

OOleJRask
81% match