Created
December 16, 2019 21:01
-
-
Save aaizemberg/8e4f9471cb7685c93e3b52f0f9e4d901 to your computer and use it in GitHub Desktop.
from colab altair to vega-lite - w50 - makeovermonday
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-a05eaafbc67b2f88258ba7ebb6fff001"}, "mark": {"type": "circle", "size": 60}, "encoding": {"color": {"type": "nominal", "field": "chain"}, "size": {"type": "quantitative", "field": "avg sales by store"}, "tooltip": [{"type": "quantitative", "field": "rank"}, {"type": "nominal", "field": "chain"}, {"type": "quantitative", "field": "Sales"}, {"type": "quantitative", "field": "Locations"}, {"type": "quantitative", "field": "avg sales by store"}], "x": {"type": "quantitative", "field": "Locations"}, "y": {"type": "quantitative", "field": "Sales"}}, "selection": {"selector002": {"type": "interval", "bind": "scales", "encodings": ["x", "y"]}}, "$schema": "https://vega.github.io/schema/vega-lite/v4.0.0.json", "datasets": {"data-a05eaafbc67b2f88258ba7ebb6fff001": [{"rank": 8, "chain": "Chick-fil-A", "Sales": 9000000000, "Locations": 2225, "avg sales by store": 4044944.0}, {"rank": 22, "chain": "Whataburger", "Sales": 2300000000, "Locations": 821, "avg sales by store": 2801462.0}, {"rank": 1, "chain": "McDonald's", "Sales": 37500000000, "Locations": 14036, "avg sales by store": 2671701.0}, {"rank": 25, "chain": "Zaxby's", "Sales": 2100000000, "Locations": 890, "avg sales by store": 2359551.0}, {"rank": 11, "chain": "Panera Bread", "Sales": 4500000000, "Locations": 2043, "avg sales by store": 2202643.0}, {"rank": 28, "chain": "Culver's", "Sales": 1400000000, "Locations": 643, "avg sales by store": 2177294.0}, {"rank": 12, "chain": "Chipotle", "Sales": 4500000000, "Locations": 2371, "avg sales by store": 1897933.0}, {"rank": 29, "chain": "Bojangles'", "Sales": 1300000000, "Locations": 764, "avg sales by store": 1701571.0}, {"rank": 6, "chain": "Wendy's", "Sales": 9300000000, "Locations": 5769, "avg sales by store": 1612064.0}, {"rank": 18, "chain": "Jack in the Box", "Sales": 3500000000, "Locations": 2251, "avg sales by store": 1554865.0}, {"rank": 5, "chain": "Taco Bell", "Sales": 9300000000, "Locations": 6446, "avg sales by store": 1442755.0}, {"rank": 19, "chain": "Popeye's", "Sales": 3200000000, "Locations": 2231, "avg sales by store": 1434334.0}, {"rank": 4, "chain": "Burger King", "Sales": 9800000000, "Locations": 7226, "avg sales by store": 1356214.0}, {"rank": 26, "chain": "Carl's Jr.", "Sales": 1500000000, "Locations": 1156, "avg sales by store": 1297578.0}, {"rank": 14, "chain": "Sonic Drive-In", "Sales": 4400000000, "Locations": 3593, "avg sales by store": 1224603.0}, {"rank": 23, "chain": "Hardee's", "Sales": 2200000000, "Locations": 1864, "avg sales by store": 1180258.0}, {"rank": 21, "chain": "Panda Express", "Sales": 2300000000, "Locations": 2011, "avg sales by store": 1143710.0}, {"rank": 13, "chain": "KFC", "Sales": 4400000000, "Locations": 4019, "avg sales by store": 1094800.0}, {"rank": 30, "chain": "Wingstop", "Sales": 1100000000, "Locations": 1027, "avg sales by store": 1071081.0}, {"rank": 27, "chain": "Five Guys", "Sales": 1400000000, "Locations": 1321, "avg sales by store": 1059803.0}, {"rank": 9, "chain": "Domino's", "Sales": 5900000000, "Locations": 5587, "avg sales by store": 1056023.0}, {"rank": 16, "chain": "Arby's", "Sales": 3600000000, "Locations": 3415, "avg sales by store": 1054173.0}, {"rank": 2, "chain": "Starbucks", "Sales": 13200000000, "Locations": 13930, "avg sales by store": 947595.0}, {"rank": 20, "chain": "Papa John's", "Sales": 3100000000, "Locations": 3314, "avg sales by store": 935425.0}, {"rank": 15, "chain": "Dairy Queen", "Sales": 3600000000, "Locations": 4455, "avg sales by store": 808081.0}, {"rank": 17, "chain": "Little Caesars", "Sales": 3500000000, "Locations": 4332, "avg sales by store": 807941.0}, {"rank": 24, "chain": "Jimmy John's", "Sales": 2100000000, "Locations": 2755, "avg sales by store": 762250.0}, {"rank": 10, "chain": "Pizza Hut", "Sales": 5500000000, "Locations": 7522, "avg sales by store": 731189.0}, {"rank": 7, "chain": "Dunkin' Donuts", "Sales": 5900000000, "Locations": 12538, "avg sales by store": 470569.0}, {"rank": 3, "chain": "Subway", "Sales": 10800000000, "Locations": 25908, "avg sales by store": 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