Spaces:
Runtime error
Runtime error
<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.17.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-700e84ebfeae2b5e3ed0135928f5414d"}, "facet": {"field": "handle", "type": "nominal"}, "spec": {"layer": [{"mark": "bar", "encoding": {"color": {"field": "max_sentiment", "title": "Twitter Handle", "type": "nominal"}, "order": {"field": "max_sentiment", "sort": "ascending", "type": "nominal"}, "x": {"field": "max_sentiment", "title": "Max Sentiment", "type": "nominal"}, "y": {"axis": {"format": "%"}, "field": "percentage", "title": "Percentage", "type": "quantitative"}}, "height": 150, "title": "Percentage of Max Sentiments by Twitter Handle", "width": 150}, {"mark": {"type": "text", "color": "black", "dx": 0, "dy": 5}, "encoding": {"text": {"field": "count", "type": "quantitative"}, "x": {"field": "max_sentiment", "type": "nominal"}, "y": {"axis": {"format": "%"}, "field": "percentage", "type": "quantitative"}}}]}, "columns": 3, "$schema": "https://vega.github.io/schema/vega-lite/v4.17.0.json", "datasets": {"data-700e84ebfeae2b5e3ed0135928f5414d": [{"handle": "BarackObama", "max_sentiment": "negative", "count": 225, "percentage": 0.07723995880535531}, {"handle": "BarackObama", "max_sentiment": "neutral", "count": 1056, "percentage": 0.36251287332646753}, {"handle": "BarackObama", "max_sentiment": "positive", "count": 1632, "percentage": 0.5602471678681772}, {"handle": "alikarimi_ak8", "max_sentiment": "negative", "count": 49, "percentage": 0.34507042253521125}, {"handle": "alikarimi_ak8", "max_sentiment": "neutral", "count": 66, "percentage": 0.4647887323943662}, {"handle": "alikarimi_ak8", "max_sentiment": "positive", "count": 27, "percentage": 0.19014084507042253}, {"handle": "cathiedwood", "max_sentiment": "negative", "count": 216, "percentage": 0.14555256064690028}, {"handle": "cathiedwood", "max_sentiment": "neutral", "count": 537, "percentage": 0.3618598382749326}, {"handle": "cathiedwood", "max_sentiment": "positive", "count": 731, "percentage": 0.4925876010781671}, {"handle": "elonmusk", "max_sentiment": "negative", "count": 453, "percentage": 0.2560768795929904}, {"handle": "elonmusk", "max_sentiment": "neutral", "count": 852, "percentage": 0.4816280384397965}, {"handle": "elonmusk", "max_sentiment": "positive", "count": 464, "percentage": 0.26229508196721313}, {"handle": "taylorlorenz", "max_sentiment": "negative", "count": 7, "percentage": 0.30434782608695654}, {"handle": "taylorlorenz", "max_sentiment": "neutral", "count": 7, "percentage": 0.30434782608695654}, {"handle": "taylorlorenz", "max_sentiment": "positive", "count": 9, "percentage": 0.391304347826087}, {"handle": "ylecun", "max_sentiment": "negative", "count": 710, "percentage": 0.28826634185952094}, {"handle": "ylecun", "max_sentiment": "neutral", "count": 1407, "percentage": 0.5712545676004872}, {"handle": "ylecun", "max_sentiment": "positive", "count": 346, "percentage": 0.14047909053999189}]}}; | |
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> |