Переглянути джерело

dashboard: fix chart height via maintainAspectRatio=false

Chart.js defaults maintainAspectRatio=true which overrides CSS container
height. The bar charts were ignoring the 480px tall container. Setting
maintainAspectRatio=false lets the CSS height take effect.

Entity and keyword detail fetchers already use the active time range
selector (from the previous commit).
Lukas Goldschmidt 1 тиждень тому
батько
коміт
0c194bfc04
1 змінених файлів з 2 додано та 2 видалено
  1. 2 2
      dashboard/dashboard.js

+ 2 - 2
dashboard/dashboard.js

@@ -359,7 +359,7 @@ function renderEntityChart() {
   _charts.entities = new Chart($('chart-entities').getContext('2d'), {
     type: 'bar',
     data: { labels: top15.map(function(e){return (e.canonical_label||e.label).substring(0,24)}), datasets: [{ label:'Mentions', data:top15.map(function(e){return e.count}), backgroundColor:'rgba(91,138,245,0.3)', borderColor:'#5b8af5', borderWidth:1 }] },
-    options: { indexAxis:'y', responsive:true, plugins:{legend:{display:false}}, scales:{ x:{ticks:{color:'#8a8f9b'},grid:{color:'rgba(42,46,58,.5)'}}, y:{ticks:{color:'#8a8f9b'},grid:{display:false}} } }
+    options: { indexAxis:'y', responsive:true, maintainAspectRatio:false, plugins:{legend:{display:false}}, scales:{ x:{ticks:{color:'#8a8f9b'},grid:{color:'rgba(42,46,58,.5)'}}, y:{ticks:{color:'#8a8f9b'},grid:{display:false}} } }
   });
 }
 
@@ -430,7 +430,7 @@ function renderKeywordChart() {
   _charts.keywords = new Chart($('chart-keywords').getContext('2d'), {
     type: 'bar',
     data: { labels: top15.map(function(k){return k.label.substring(0,24)}), datasets: [{ label:'Occurrences', data:top15.map(function(k){return k.count}), backgroundColor:'rgba(71,207,125,0.3)', borderColor:'#47cf7d', borderWidth:1 }] },
-    options: { indexAxis:'y', responsive:true, plugins:{legend:{display:false}}, scales:{ x:{ticks:{color:'#8a8f9b'},grid:{color:'rgba(42,46,58,.5)'}}, y:{ticks:{color:'#8a8f9b'},grid:{display:false}} } }
+    options: { indexAxis:'y', responsive:true, maintainAspectRatio:false, plugins:{legend:{display:false}}, scales:{ x:{ticks:{color:'#8a8f9b'},grid:{color:'rgba(42,46,58,.5)'}}, y:{ticks:{color:'#8a8f9b'},grid:{display:false}} } }
   });
 }