viewof chart = vega({
"$schema": "https://vega.github.io/schema/vega-lite/v5.17.0.json",
"config": {
"view": {
"continuousHeight": 300,
"continuousWidth": 300
}
},
"data": {
"name": "data-259275452d488c8e5192f1911196fc14"
},
"datasets": {
"data-259275452d488c8e5192f1911196fc14": [
{
"All-Star selections": 10,
"TEAM_ABBREVIATION": "ATL",
"color": "#E03A3E",
"valuation_diff": 2505.0
},
{
"All-Star selections": 8,
"TEAM_ABBREVIATION": "BKN",
"color": "#000000",
"valuation_diff": 1100.0
},
{
"All-Star selections": 14,
"TEAM_ABBREVIATION": "BOS",
"color": "#007A33",
"valuation_diff": 2600.0
},
{
"All-Star selections": 4,
"TEAM_ABBREVIATION": "CHA",
"color": "#1D1160",
"valuation_diff": 795.0
},
{
"All-Star selections": 8,
"TEAM_ABBREVIATION": "CHI",
"color": "#CE1141",
"valuation_diff": 1650.0
},
{
"All-Star selections": 11,
"TEAM_ABBREVIATION": "CLE",
"color": "#860038",
"valuation_diff": 2435.0
},
{
"All-Star selections": 5,
"TEAM_ABBREVIATION": "DAL",
"color": "#00538C",
"valuation_diff": 3300.0
},
{
"All-Star selections": 5,
"TEAM_ABBREVIATION": "DEN",
"color": "#0E2240",
"valuation_diff": 1980.0
},
{
"All-Star selections": 3,
"TEAM_ABBREVIATION": "DET",
"color": "#BEC0C2",
"valuation_diff": 450.0
},
{
"All-Star selections": 21,
"TEAM_ABBREVIATION": "GSW",
"color": "#1D428A",
"valuation_diff": 6400.0
},
{
"All-Star selections": 7,
"TEAM_ABBREVIATION": "HOU",
"color": "#CE1141",
"valuation_diff": 1200.0
},
{
"All-Star selections": 7,
"TEAM_ABBREVIATION": "IND",
"color": "#002D62",
"valuation_diff": 2060.0
},
{
"All-Star selections": 9,
"TEAM_ABBREVIATION": "LAC",
"color": "#1D428A",
"valuation_diff": 3050.0
},
{
"All-Star selections": 10,
"TEAM_ABBREVIATION": "LAL",
"color": "#552583",
"valuation_diff": 3800.0
},
{
"All-Star selections": 3,
"TEAM_ABBREVIATION": "MEM",
"color": "#5D76A9",
"valuation_diff": 750.0
},
{
"All-Star selections": 10,
"TEAM_ABBREVIATION": "MIA",
"color": "#98002E",
"valuation_diff": 2700.0
},
{
"All-Star selections": 11,
"TEAM_ABBREVIATION": "MIL",
"color": "#00471B",
"valuation_diff": 2415.0
},
{
"All-Star selections": 6,
"TEAM_ABBREVIATION": "MIN",
"color": "#0C2340",
"valuation_diff": 1400.0
},
{
"All-Star selections": 8,
"TEAM_ABBREVIATION": "NOP",
"color": "#0C2340",
"valuation_diff": 750.0
},
{
"All-Star selections": 7,
"TEAM_ABBREVIATION": "NYK",
"color": "#006BB6",
"valuation_diff": 4100.0
},
{
"All-Star selections": 10,
"TEAM_ABBREVIATION": "OKC",
"color": "#EF3B24",
"valuation_diff": 670.0
},
{
"All-Star selections": 2,
"TEAM_ABBREVIATION": "ORL",
"color": "#0077C0",
"valuation_diff": 200.0
},
{
"All-Star selections": 8,
"TEAM_ABBREVIATION": "PHI",
"color": "#006BB6",
"valuation_diff": 1250.0
},
{
"All-Star selections": 5,
"TEAM_ABBREVIATION": "PHX",
"color": "#1D1160",
"valuation_diff": 200.0
},
{
"All-Star selections": 6,
"TEAM_ABBREVIATION": "POR",
"color": "#E03A3E",
"valuation_diff": 960.0
},
{
"All-Star selections": 3,
"TEAM_ABBREVIATION": "SAC",
"color": "#5A2D81",
"valuation_diff": 300.0
},
{
"All-Star selections": 7,
"TEAM_ABBREVIATION": "SAS",
"color": "#C4CED4",
"valuation_diff": 980.0
},
{
"All-Star selections": 11,
"TEAM_ABBREVIATION": "TOR",
"color": "#CE1141",
"valuation_diff": 1555.0
},
{
"All-Star selections": 6,
"TEAM_ABBREVIATION": "UTA",
"color": "#F9A01B",
"valuation_diff": 840.0
},
{
"All-Star selections": 7,
"TEAM_ABBREVIATION": "WAS",
"color": "#002B5C",
"valuation_diff": 900.0
}
]
},
"encoding": {
"color": {
"field": "color",
"legend": null,
"scale": null,
"type": "nominal"
},
"tooltip": [
{
"field": "TEAM_ABBREVIATION",
"title": "Team",
"type": "nominal"
}
],
"x": {
"field": "valuation_diff",
"type": "quantitative"
},
"y": {
"field": "All-Star selections",
"type": "quantitative"
}
},
"mark": {
"size": 80,
"type": "circle"
},
"params": [
{
"bind": "scales",
"name": "param_13",
"select": {
"encodings": [
"x",
"y"
],
"type": "interval"
}
}
]
})
vega = {
const v = window.vega = await require("vega@3");
const vl = window.vl = await require("vega-lite@2");
const ve = await require("vega-embed@6");
async function vega(spec, options) {
const div = document.createElement("div");
div.value = (await ve(div, spec, options)).view;
return div;
}
vega.changeset = v.changeset;
return vega;
}
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
