Perspective › Examples

Olympics

2-panel dashboard of Heatmap and X/Y Scatter: Heatmap chart of Name, grouped by Age, split by Sport, sorted by Event; X/Y Scatter chart of Height, Weight and City, grouped by Sport.

120 years of Olympic athletes, from Kaggle.

Olympics: 2-panel dashboard of Heatmap and X/Y Scatter: Heatmap chart of Name, grouped by Age, split by Sport, sorted by Event; X/Y Scatter chart of Height, Weight and City, grouped by Sport.

Data

120 years of Olympic athletes and results, from Kaggle — roughly 270,000 rows loaded from Apache Arrow and pivoted entirely in the browser.

Loaded from /data/olympics.arrow as arrow into the perspective-server engine.

Configuration

This example is a saved <perspective-viewer> workspace. Pass this JSON to viewer.restoreWorkspace() to reproduce it over the same table:

{
    "active": "PERSPECTIVE_GENERATED_ID_0",
    "layout": {
        "type": "split-layout",
        "children": [
            {
                "type": "tab-layout",
                "tabs": [
                    "PERSPECTIVE_GENERATED_ID_1"
                ],
                "selected": 0
            },
            {
                "type": "tab-layout",
                "tabs": [
                    "PERSPECTIVE_GENERATED_ID_0"
                ],
                "selected": 0
            }
        ],
        "sizes": [
            0.5,
            0.5
        ],
        "orientation": "horizontal"
    },
    "panels": {
        "PERSPECTIVE_GENERATED_ID_0": {
            "plugin": "Heatmap",
            "table": "olympics",
            "title": "Age Distribution by Sport",
            "group_by": [
                "Age"
            ],
            "split_by": [
                "Sport"
            ],
            "sort": [
                [
                    "Event",
                    "col desc"
                ]
            ],
            "columns": [
                "Name"
            ]
        },
        "PERSPECTIVE_GENERATED_ID_1": {
            "plugin": "X/Y Scatter",
            "table": "olympics",
            "title": "Avg Height vs Weight by Sport",
            "group_by": [
                "Sport"
            ],
            "columns": [
                "Height",
                "Weight",
                null,
                "City",
                "Sport",
                null
            ],
            "aggregates": {
                "Weight": "avg",
                "Sport": "dominant",
                "Height": "avg"
            }
        }
    }
}

About Perspective

Perspective is an open-source, WebAssembly-powered data grid, pivot table and charting component for large, real-time and streaming datasets — in the browser, Python, Jupyter, Node.js and Rust.

Documentation