1

我有一个 Rails 模板,它使用 ajavascript_tag来获取变量@user.lat@user.lng客户端,以便在生成 Google 地图的函数中使用。

问题是这些变量是动态的并且可以经常改变,但是我的javascript标签只知道页面渲染时变量的值。当我点击我的应用程序(触发实际页面加载)时,我可以看到值发生了变化,但在javascript_tag初始页面加载后,其中的值没有更新。

如何在刷新页面或编写代码重复向服务器查询这些变量的情况下使客户端上的变量保持最新?

4

2 回答 2

2

您采用的javascript_tag方法不支持“观察”变量的变化。换句话说,您将数据发送给客户端的方法有点像“设置它并忘记它”,客户端永远不会知道服务器上的值是否在没有重新加载页面的情况下发生变化。

另一种方法是使用预滚动的解决方案将动态服务器端数据发送到客户端,并密切关注它们的变化,例如Gon。具体来说,您可能想查看该 gem 提供的“监视”功能。

另一种方法可能是编写一个函数,该函数对服务器进行 AJAX 调用,以每隔一段时间请求最新值。但是,您将只是手动推出一个与先前建议完全相同的解决方案。

于 2013-05-09T00:39:06.960 回答
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');
}

现在可以享受美食了。

于 2013-05-28T22:28:01.160 回答