File size: 4,032 Bytes
213bcf2
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
f263510
213bcf2
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<!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.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>