2013-05-09 18 views
1

我有一個Rails模板,它使用javascript_tag將變量@user.lat@user.lng傳送給客戶端,以便在生成Google地圖的函數中使用。爲客戶端使用保持軌道變量爲最新

問題是,這些變量是動態的,可以經常更改,但我的javascript標記只知道頁面呈現時變量的值。當我點擊我的應用程序(觸發實際的頁面加載)時,我可以看到這些值發生了變化,但javascript_tag中的值在初始頁面加載後未更新。

如何讓客戶端上的變量保持最新狀態,而不用刷新頁面或編寫代碼來反覆查詢服務器上的這些變量?

回答

0

「你正在做不支持‘看’的變量變化的javascript_tag辦法......」

是的,真正的,甚至當我點擊我的周圍應用和重新加載頁面時, javascript_tag中的值保持不變。這就像我的應用程序啓動時我的js文件加載一樣,@user的經度和緯度值保持不變,即使它們應該改變,並且地圖總是以相同的座標繪製。

'Gon'寶石也不適合我。非常少的文檔,特別是像我這樣的新手。

什麼成功:要生成

在哪裏,我想在地圖的頁面,show.html.erb:

<!-- This is here, to generate the user's latitude and longitude dynamically --> 
<!-- The data-lat and lng attributes are used in 'initialise_google_maps' function, in scripts.js' --> 
<div id="user-position" class="hidden" data-lat="<%= @user.lat %>" data-lng="<%= @user.lng %>"></div> 

然後在我的scripts.js中:

function initialize_google_maps() { 

    var user_longitude = $("#user-position").attr("data-lng"); 
    var user_latitude = $("#user-position").attr("data-lat"); 

var currentlatlng = new google.maps.LatLng(user_latitude, user_longitude); 

var zoom = 10; 
var myOptions = { 
    zoom: zoom, 
    center: currentlatlng, 
    mapTypeId: google.maps.MapTypeId.ROADMAP, // ROADMAP, SATELLITE, HYBRID 
    streetViewControl: false 
    }; 
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

    var marker = new google.maps.Marker({map: map, position: currentlatlng, icon:{oppacity:0}}); 

    var circle = new google.maps.Circle({ 
    map: map, 
    fillOpacity: 0, 
    strokeWeight: 2, 
    strokeOpacity: 0.7, 
    radius: 10000, 
    }); 
    circle.bindTo('center', marker, 'position'); 
} 

現在工作。

2

您所採用的javascript_tag方法不支持「觀察」變更變量。換句話說,將數據提供給客戶端的方法是「設置並忘記它」,客戶端永遠不會知道服務器上的值是否在沒有頁面重新加載的情況下發生變化。

另一種方法是使用預先滾動的解決方案將動態服務器端數據發送到客戶端,並密切關注其更改,如Gon。具體來說,你可能想看看那個寶石提供的the "watch" functionality

另一種方法可能是編寫一個函數,使服務器的AJAX調用每隔一段時間請求一次最新值。但是,你只需要手動滾動一個與前面的建議完全相同的解決方案。

+0

乾杯克里斯,我會看看Gon。問題也看起來更好。 – CHarris 2013-05-09 08:19:12