Created
December 16, 2019 21:02
-
-
Save exemartinez/9d2e050c2eed2eafb49708e559efc934 to your computer and use it in GitHub Desktop.
from colab to vega-lite
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<style> | |
.error { | |
color: red; | |
} | |
</style> | |
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm//vega@5"></script> | |
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm//vega-lite@4.0.0"></script> | |
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm//vega-embed@6"></script> | |
</head> | |
<body> | |
<div id="vis"></div> | |
<script> | |
(function(vegaEmbed) { | |
var spec = {"config": {"view": {"continuousWidth": 400, "continuousHeight": 300}}, "data": {"name": "data-20173a44b37c5a2d7f6bc13d106c0c73"}, "mark": {"type": "circle", "size": 60}, "encoding": {"color": {"type": "nominal", "field": "chain"}, "size": {"type": "quantitative", "field": "vpl"}, "tooltip": [{"type": "quantitative", "field": "rank"}, {"type": "nominal", "field": "chain"}, {"type": "quantitative", "field": "sales"}, {"type": "quantitative", "field": "loc"}], "x": {"type": "quantitative", "field": "loc"}, "y": {"type": "quantitative", "field": "sales"}}, "selection": {"selector003": {"type": "interval", "bind": "scales", "encodings": ["x", "y"]}}, "$schema": "https://vega.github.io/schema/vega-lite/v4.0.0.json", "datasets": {"data-20173a44b37c5a2d7f6bc13d106c0c73": [{"rank": 8, "chain": "Chick-fil-A", "sales": 9000000000, "loc": 2225, "vpl": 4044944.0}, {"rank": 22, "chain": "Whataburger", "sales": 2300000000, "loc": 821, "vpl": 2801462.0}, {"rank": 1, "chain": "McDonald's", "sales": 37500000000, "loc": 14036, "vpl": 2671701.0}, {"rank": 25, "chain": "Zaxby's", "sales": 2100000000, "loc": 890, "vpl": 2359551.0}, {"rank": 11, "chain": "Panera Bread", "sales": 4500000000, "loc": 2043, "vpl": 2202643.0}, {"rank": 28, "chain": "Culver's", "sales": 1400000000, "loc": 643, "vpl": 2177294.0}, {"rank": 12, "chain": "Chipotle", "sales": 4500000000, "loc": 2371, "vpl": 1897933.0}, {"rank": 29, "chain": "Bojangles'", "sales": 1300000000, "loc": 764, "vpl": 1701571.0}, {"rank": 6, "chain": "Wendy's", "sales": 9300000000, "loc": 5769, "vpl": 1612064.0}, {"rank": 18, "chain": "Jack in the Box", "sales": 3500000000, "loc": 2251, "vpl": 1554865.0}, {"rank": 5, "chain": "Taco Bell", "sales": 9300000000, "loc": 6446, "vpl": 1442755.0}, {"rank": 19, "chain": "Popeye's", "sales": 3200000000, "loc": 2231, "vpl": 1434334.0}, {"rank": 4, "chain": "Burger King", "sales": 9800000000, "loc": 7226, "vpl": 1356214.0}, {"rank": 26, "chain": "Carl's Jr.", "sales": 1500000000, "loc": 1156, "vpl": 1297578.0}, {"rank": 14, "chain": "Sonic Drive-In", "sales": 4400000000, "loc": 3593, "vpl": 1224603.0}, {"rank": 23, "chain": "Hardee's", "sales": 2200000000, "loc": 1864, "vpl": 1180258.0}, {"rank": 21, "chain": "Panda Express", "sales": 2300000000, "loc": 2011, "vpl": 1143710.0}, {"rank": 13, "chain": "KFC", "sales": 4400000000, "loc": 4019, "vpl": 1094800.0}, {"rank": 30, "chain": "Wingstop", "sales": 1100000000, "loc": 1027, "vpl": 1071081.0}, {"rank": 27, "chain": "Five Guys", "sales": 1400000000, "loc": 1321, "vpl": 1059803.0}, {"rank": 9, "chain": "Domino's", "sales": 5900000000, "loc": 5587, "vpl": 1056023.0}, {"rank": 16, "chain": "Arby's", "sales": 3600000000, "loc": 3415, "vpl": 1054173.0}, {"rank": 2, "chain": "Starbucks", "sales": 13200000000, "loc": 13930, "vpl": 947595.0}, {"rank": 20, "chain": "Papa John's", "sales": 3100000000, "loc": 3314, "vpl": 935425.0}, {"rank": 15, "chain": "Dairy Queen", "sales": 3600000000, "loc": 4455, "vpl": 808081.0}, {"rank": 17, "chain": "Little Caesars", "sales": 3500000000, "loc": 4332, "vpl": 807941.0}, {"rank": 24, "chain": "Jimmy John's", "sales": 2100000000, "loc": 2755, "vpl": 762250.0}, {"rank": 10, "chain": "Pizza Hut", "sales": 5500000000, "loc": 7522, "vpl": 731189.0}, {"rank": 7, "chain": "Dunkin' Donuts", "sales": 5900000000, "loc": 12538, "vpl": 470569.0}, {"rank": 3, "chain": "Subway", "sales": 10800000000, "loc": 25908, "vpl": 416860.0}]}}; | |
var embedOpt = {"mode": "vega-lite"}; | |
function showError(el, error){ | |
el.innerHTML = ('<div class="error" style="color:red;">' | |
+ '<p>JavaScript Error: ' + error.message + '</p>' | |
+ "<p>This usually means there's a typo in your chart specification. " | |
+ "See the javascript console for the full traceback.</p>" | |
+ '</div>'); | |
throw error; | |
} | |
const el = document.getElementById('vis'); | |
vegaEmbed("#vis", spec, embedOpt) | |
.catch(error => showError(el, error)); | |
})(vegaEmbed); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment