diff --git a/app/views/documents/analysis/_display.html.erb b/app/views/documents/analysis/_display.html.erb
index 18148f6f..50181ce8 100644
--- a/app/views/documents/analysis/_display.html.erb
+++ b/app/views/documents/analysis/_display.html.erb
@@ -8,7 +8,6 @@
 <%= render partial: 'documents/analysis/sections/concepts',     locals: { analysis: analysis } %>
 <%= render partial: 'documents/analysis/sections/categories',   locals: { analysis: analysis } %>
 
-
 <!-- <h5>Plot</h5>
 <div class="row">
   <div class="col s12">
diff --git a/app/views/documents/analysis/sections/_entities.html.erb b/app/views/documents/analysis/sections/_entities.html.erb
index 85fe25de..7c650c95 100644
--- a/app/views/documents/analysis/sections/_entities.html.erb
+++ b/app/views/documents/analysis/sections/_entities.html.erb
@@ -1,6 +1,6 @@
 <h5 class="grey-text">Entities</h5>
 <div class="row">
-  <% analysis.document_entities.each do |entity| %>
+  <% analysis.document_entities.order('entity_type').each do |entity| %>
     <% entity_class = entity.entity_type.constantize %>
     <div class="col s12 m4">
       <div class="card">
@@ -25,4 +25,63 @@
       </div>
     </div>
   <% end %>
+
+  <div class="col s12 m12">
+    <div class="card">
+      <div class="card-content">
+        <div id="graph-character-emotions"></div>
+      </div>
+    </div>
+  </div>
 </div>
+
+
+<script type="text/javascript">
+$(document).ready(function () {
+
+  var emotions_chart = Highcharts.chart('graph-character-emotions', {
+    chart: {
+        polar: true,
+        type: 'line'
+    },
+    title: {
+        text: 'Character emotional range'
+    },
+    xAxis: {
+        categories: ['Joy', 'Sadness', 'Fear', 'Disgust', 'Anger'],
+        tickmarkPlacement: 'on',
+        lineWidth: 0
+    },
+    yAxis: {
+        gridLineInterpolation: 'polygon',
+        lineWidth: 0,
+        min: 0,
+        max: 100
+    },
+    legend: {
+        align: 'right',
+        verticalAlign: 'top',
+        y: 70,
+        layout: 'vertical'
+    },
+
+    series: [
+      <% analysis.document_entities.where(entity_type: 'Character').each do |entity| %>
+        {
+          name: '<%= entity.text %>',
+          data: <%=
+            [
+              (100 * entity.joy_score).round(1),
+              (100 * entity.sadness_score).round(1),
+              (100 * entity.fear_score).round(1),
+              (100 * entity.disgust_score).round(1),
+              (100 * entity.anger_score).round(1)
+            ]
+          %>,
+          pointPlacement: 'on'
+        },
+      <% end %>
+    ]
+  });
+})
+</script>
diff --git a/app/views/documents/analysis/sections/_sentiment.html.erb b/app/views/documents/analysis/sections/_sentiment.html.erb
index 3fc49f48..f1c1a7bd 100644
--- a/app/views/documents/analysis/sections/_sentiment.html.erb
+++ b/app/views/documents/analysis/sections/_sentiment.html.erb
@@ -1,6 +1,6 @@
 <h5 class="grey-text">Sentiment</h5>
 <div class="row">
-  <div class="col s12 m6 l2">
+  <div class="col s12 m6">
     <div class="card">
       <div class="card-content">
         <div>
@@ -12,59 +12,59 @@
     </div>
   </div>
 
-  <div class="col s12 m6 l2">
+  <div class="col s12 m6">
     <div class="card">
-      <div class="card-content yellow">
-        <div>
-          <ul>
-            <li>Joy: <%= analysis.joy_score %></li>
-          </ul>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="col s12 m6 l2">
-    <div class="card">
-      <div class="card-content blue">
-        <div>
-          <ul>
-            <li>Sadness: <%= analysis.sadness_score %></li>
-          </ul>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="col s12 m6 l2">
-    <div class="card">
-      <div class="card-content orange">
-        <div>
-          <ul>
-            <li>Fear: <%= analysis.fear_score %></li>
-          </ul>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="col s12 m6 l2">
-    <div class="card">
-      <div class="card-content green">
-        <div>
-          <ul>
-            <li>Disgust: <%= analysis.disgust_score %></li>
-          </ul>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="col s12 m6 l2">
-    <div class="card">
-      <div class="card-content red">
-        <div>
-          <ul>
-            <li>Anger: <%= analysis.anger_score %></li>
-          </ul>
-        </div>
+      <div class="card-content">
+        <div id="graph-emotions"></div>
       </div>
     </div>
   </div>
 </div>
+
+
+<script type="text/javascript">
+$(document).ready(function () {
+
+  var emotions_chart = Highcharts.chart('graph-emotions', {
+    chart: {
+        polar: true,
+        type: 'line'
+    },
+    title: {
+        text: 'Emotional distribution'
+    },
+    xAxis: {
+        categories: ['Joy', 'Sadness', 'Fear', 'Disgust', 'Anger'],
+        tickmarkPlacement: 'on',
+        lineWidth: 0
+    },
+    yAxis: {
+        gridLineInterpolation: 'polygon',
+        lineWidth: 0,
+        min: 0,
+        max: 100
+    },
+    tooltip: {
+      shared: true,
+      pointFormat: '<span style="color:{series.color}">Emotional score: <b>{point.y}</b><br/>'
+    },
+    legend: {
+      enabled: false
+    },
+
+    series: [{
+      name: 'Emotions',
+      data: <%=
+        [
+          (100 * analysis.joy_score).round(1),
+          (100 * analysis.sadness_score).round(1),
+          (100 * analysis.fear_score).round(1),
+          (100 * analysis.disgust_score).round(1),
+          (100 * analysis.anger_score).round(1)
+        ]
+      %>,
+      pointPlacement: 'on'
+    }]
+  });
+})
+</script>