|
|
@@ -44,7 +44,7 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</header>
|
|
|
- <div class="ui text container">
|
|
|
+ <div class="ui basic segment container">
|
|
|
<div class="ui basic segment">
|
|
|
<section class="ui celled selection link list">
|
|
|
{% for network in networks %}
|
|
|
@@ -68,16 +68,16 @@
|
|
|
</div>
|
|
|
</section>
|
|
|
</article>
|
|
|
- <section class="ui padded equal width centered grid">
|
|
|
- <div class="ui four wide column">
|
|
|
+ <section class="ui padded center aligned equal width grid">
|
|
|
+ <div class="ui column">
|
|
|
<div class="header">
|
|
|
<i class="users icon"></i>
|
|
|
Messages per network
|
|
|
</div>
|
|
|
<script type="text/javascript">
|
|
|
google.charts.load("current", {packages:["corechart"]});
|
|
|
- google.charts.setOnLoadCallback(drawChart);
|
|
|
- function drawChart() {
|
|
|
+ google.charts.setOnLoadCallback(drawChart1);
|
|
|
+ function drawChart1() {
|
|
|
var data = google.visualization.arrayToDataTable([
|
|
|
['Network', 'Users'],
|
|
|
{% for network in networklist.items %}
|
|
|
@@ -91,10 +91,13 @@
|
|
|
var chart = new google.visualization.PieChart(document.getElementById('messageschart'));
|
|
|
chart.draw(data, options);
|
|
|
}
|
|
|
+ $(window).resize(function(){
|
|
|
+ drawChart1();
|
|
|
+ });
|
|
|
</script>
|
|
|
- <div id="messageschart" ></div>
|
|
|
+ <div id="messageschart" style="width:100%; height: 400px;"></div>
|
|
|
</div>
|
|
|
- <div class="four wide column">
|
|
|
+ <div class="ui column">
|
|
|
<div class="header">
|
|
|
<i class="users icon"></i>
|
|
|
Users per network
|
|
|
@@ -116,8 +119,12 @@
|
|
|
var chart = new google.visualization.PieChart(document.getElementById('userschart'));
|
|
|
chart.draw(data, options);
|
|
|
}
|
|
|
+ $(window).resize(function(){
|
|
|
+ drawChart();
|
|
|
+ });
|
|
|
</script>
|
|
|
- <div id="userschart" ></div>
|
|
|
+ <div id="userschart" style=height:400px;
|
|
|
+ "> </div>
|
|
|
</div>
|
|
|
|
|
|
</section>
|
tBKwtWS