2014-02-12 51 views
0

我正在使用RGRaph.gauge和.thermometer插件。當我回到頁面時,RGraph畫布不會重繪。

當我第一次打開頁面時,所有顯示都正常。

但是,如果我跳轉到另一個頁面部分,然後回到頁面,畫布就是空的。

刷新也不起作用。必須按CTRL + F5才能重新加載沒有緩存的頁面。

我播種的可能的解決方案可能是RGraph.ObjectRegistry.Clear();的用法,但我不知道什麼時候調用它。

這是我最初的代碼:

<!-- Include the RGraph libraries --> 
<script src="ui/RGraph/libraries/RGraph.common.core.js" ></script> 
<script src="ui/RGraph/libraries/RGraph.gauge.js" ></script> 
<!--[if lt IE 9]><script src="ui/RGraph/excanvas/excanvas.js"></script><![endif]--> 

腳本和DIV:

<script> 
    function PRODgauge (PROD) 
    { 
     var gauge = new RGraph.Gauge('cvsPROD', 0,20,PROD) 

     .Set('units.post', ' K') 
     .Set('shadow', false) 
     .Set('zoom.shadow', false) 
     .Set('zoom.fade.in', false) 
     .Set('zoom.fade.out', false) 
     .Draw();  

     var s = document.getElementById('PRODvalue'); 
     s.innerHTML = PROD + ' K'; 
    } 

    function UATgauge (UAT) 
    { 
     var gauge = new RGraph.Gauge('cvsUAT', 0,20,UAT) 

     .Set('units.post', ' K') 
     .Set('shadow', false) 
     .Set('zoom.shadow', false) 
     .Set('zoom.fade.in', false) 
     .Set('zoom.fade.out', false) 
     .Draw();  

     var s = document.getElementById('UATvalue'); 
     s.innerHTML = UAT + ' K'; 
    } 

    window.onload = function() {   
     RGraph.AJAX.getNumber('pages/home/last_15min_PROD_data.jsp', PRODgauge); 
     RGraph.AJAX.getNumber('pages/home/last_15min_UAT_data.jsp', UATgauge); 
     setTimeout(window.onload, 300000);  
    } 
</script> 

<div id="stats-content"> 
<div id="chart1" style="display: inline-block;"></div> 
<div id="chart2" style="display: inline-block;"></div> 
<div id="chart3" style="display: inline-block;"><canvas id="cvsPROD" height="200" width="200">[No canvas support]</canvas><h3 style="position: relative; text-align: center; top: -45px;">PROD</h3><h2 style="text-align: center; position: relative; top: -45px;"><span id="PRODvalue"></span> 
</div> 
<div id="chart4" style="display: inline-block;"> 
     <canvas id="cvsUAT" height="200" width="200">[No canvas support]</canvas> 
     <h3 style="position: relative; text-align: center; top: -45px;">UAT</h3> 
     <h2 style="text-align: center; position: relative; top: -45px;"><span id="UATvalue"></span> 
</div> 
</div> 

非常感謝您 雷迪

回答

0

你的圖表顯示工作正常。如果是你正在談論的IE7/8(我不需要測試),我建議你也嘗試改變你的計時器來刷新頁面 - 儘管嘗試改變間隔爲5000.

http://www.rgraph.net/fiddle/view/two-gauge-charts

+0

你好,理查德, 我遇到的問題是在所有的瀏覽器。 它會正確顯示圖形,但是一旦我點擊某個子菜單,然後再次點擊主頁面就會顯示空白空間。只顯示 var s = document.getElementById('PRODvalue'); s.innerHTML = PROD +'K';' 我想有些東西是隱藏的,如果已經存在緩存或某處,不允許重畫畫布。 關於間隔;此功能完美運作。問題實際上只是通過重新加載頁面。 謝謝 –

+0

順便說一句:既不是''幫助。我仍然需要刷新頁面 –

+0

好吧,檢查您的JavaScript控制檯是否有任何錯誤消息。並嘗試將演示頁面在線併發布鏈接。 – Richard