From: yanyx <yanyx@umcloud.com>
Date: Mon, 7 Aug 2017 10:14:14 +0000 (+0800)
Subject: pybind: fix chart becomes bigger when refresh
X-Git-Tag: v13.0.1~1164^2
X-Git-Url: http://git-server-git.apps.pok.os.sepia.ceph.com/?a=commitdiff_plain;h=edf93427734ce156f5eaac7a25f4c16a92852b98;p=ceph.git

pybind: fix chart becomes bigger when refresh

Fixes: http://tracker.ceph.com/issues/20746
Signed-off-by: Yixing Yan <yanyx@umcloud.com>
---

diff --git a/src/pybind/mgr/dashboard/base.html b/src/pybind/mgr/dashboard/base.html
index 1d4947c26de..95c13ab8c68 100644
--- a/src/pybind/mgr/dashboard/base.html
+++ b/src/pybind/mgr/dashboard/base.html
@@ -233,6 +233,11 @@
             font-weight: bold;
         }
 
+        .chart-container {
+            width: 100%;
+            height: 100%;
+        }
+
         .dataTables_wrapper .dataTables_filter {
             color: #ddd
         }
diff --git a/src/pybind/mgr/dashboard/health.html b/src/pybind/mgr/dashboard/health.html
index 59dc312d9fa..48cea82f109 100644
--- a/src/pybind/mgr/dashboard/health.html
+++ b/src/pybind/mgr/dashboard/health.html
@@ -165,7 +165,7 @@
                     },
                     options: {
                         center_text: raw_usage_text,
-                        responsive: false,
+                        responsive: true,
                         legend: {display: false},
                         animation: {duration: 0}
                     }
@@ -199,7 +199,7 @@
                         ]
                     },
                     options: {
-                        responsive: false,
+                        responsive: true,
                         legend: {display: false},
                         animation: {duration: 0}
                     }
@@ -297,13 +297,15 @@
                                 <td>
                                     <span style="font-size: 45px;">{df.stats.total_objects | dimless}</span>
                                 </td>
-                                <td>
-                                    <canvas id="raw_usage_chart"
-                                            style="height:120px; width:120px;"></canvas>
+                                <td >
+                                    <div style="height:120px; width: 120px;">
+                                        <canvas id="raw_usage_chart"></canvas>
+                                    </div>
                                 </td>
                                 <td>
-                                    <canvas id="pool_usage_chart"
-                                            style="height:120px; width: 120px;"></canvas>
+                                    <div style="height:120px; width: 120px;">
+                                        <canvas id="pool_usage_chart"></canvas>
+                                    </div>
                                 </td>
                             </tr>
                             <tr>