Question

在我的Rails应用程序中，我有一个帮助方法 location ，它获取给定IP地址的坐标，并使它们可用于所有控制器和视图。例如， location.latitude 会返回用户的纬度。你明白了。

我还有一些Javascript可以根据给定的纬度/经度对从Google Maps API中绘制地图。问题是我不知道如何将 location 参数传递给JavaScript！

JavaScript位于'application.js'中，如下所示：

$(document).ready(function() 
  { 

    //Map options...I want the params to go into the var 'MapOptions' below

    function initialize() {
      var mapOptions = {
        center: new google.maps.LatLng(40.764698,-73.978972),
        zoom: 13,
        mapTypeId: google.maps.MapTypeId.ROADMAP
        };

    //Setup and Draw the Map...
    //....................................
  };

地图本身在HTML中被调用。通过params没有明显的方法。

<div id="map_canvas">
  <!-- The Map gets drawn here! -->
</div>

我知道这可能是一个显而易见的问题，但我以前从未将这个参数从我的应用程序传递给Javascript。

Answer 1

我认为data attributes在这里运作良好。

HTML

<div id="map_canvas" data-latitude="40.764698" data-longitude="-73.978972">
  <!-- The Map gets drawn here! -->
</div>

或与您的助手

<div id="map_canvas" data-latitude="<%= location.latitude %>" data-longitude="<%= location.longitude %>">
  <!-- The Map gets drawn here! -->
</div>

JS

$(document).ready(function() { 

  //Map options...I want the params to go into the var 'MapOptions' below

  function initialize() {
    var mapDiv = $('#map_canvas');
    var lat = mapDiv.data('latitude'),
        lng = mapDiv.data('longitude');

    var mapOptions = {
      center: new google.maps.LatLng(lat,lng),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };

  //Setup and Draw the Map...
  //....................................
};

Answer 2

您可以将lat和long分配给视图中的隐藏字段。在你的applicatons.js脚本中，让它们像$("#lat").val()一样不是最终的解决方案，但应该运作良好。

Answer 3

在Gon gem的帮助下，可以简化将数据传递到javascript中例如，在控制器中使用 gon 定义任何内容：

class FooController < ApplicationController

  def show_map
    #....
    gon.mapLatLong = [40.764698,-73.978972]

接下来，在视图中输出此erb标记

<%= include_gon %>

该控制器中定义的 gon 值将更改为视图中的javascript变量。因此，你可以在你的javascript

中这样写

center: new google.maps.LatLng(gon.mapLatLong[0],gon.mapLatLong[1]),

参考：
https://github.com/gazay/gon
http://railscasts.com/episodes/324-passing-data-to-javascript

Answer 4

看一下下面的页面，该页面解释了如何将数据传递给JavaScript： http://railscasts.com/episodes/324-passing-data-to-javascript?view=asciicast

简而言之，只需使用：

<%= javascript_tag do %>
   window.productsURL = '<%= j products_url %>';
<% end %>

然后在脚本的任何位置引用productsURL。

将参数传递给JavaScript和来自JavaScript＆amp;轨道

4 个答案: