Question

所以我正在使用Ruby on Rails开发一个Web应用程序，我想找到一种方法，用户在创建他的帐户时可以设置他的位置。我正在考虑像用于rails的google maps API，用户可以选择他的居住地。

如果有人有任何提示，我会感激不尽！

Answer 1

有一个很好的SlideShare讨论在rails应用中启用地理位置。您可以使用javascript轻松获取用户的位置并将其设置为默认值。

假设您想要获取用户的当前位置并将其显示在您的视图中：首先包括适当的谷歌地图api js库：

<script src="https://maps.googleapis.com/maps/api/js"></script>

<强>视图/索引

<body>

  <div class="container">

    <div class="error-message">
    </div>

    <div class="jumbotron">
      <h1>Google Maps</h1>
    </div>

    <div class="location">
      <div class="loc longitude">
        <h3>Longitude</h3>
        <p id="longitude"><i class="fa fa-spinner fa-spin"></i></p>
      </div>
      <div class="loc latitude">
        <h3>Latitude</h3>
        <p id="latitude"><i class="fa fa-spinner fa-spin"></i></p>
      </div>
    </div>

    <div class="row">
      <div class="col-md-12 google-map-container">
        <div id="google-map">
          <h3>Map</h3>
          <div id="map_canvas">
            <div class="  ">
              <i class="fa fa-spinner fa-spin fa-5x"></i>
            </div>
          </div>
        </div>
      </div>
    </div>

  </div> <!-- /container -->

</html>

现在假设您有两个js文件，一个用于获取用户的经度和纬度，另一个用于创建并根据用户位置插入地图

<强> fetch_location.js

$(document).ready(function(){
    var x = document.getElementById("latitude");
    var y = document.getElementById("longitude");
    // $('.vertical-align').hide();
  function getLocation() {
        navigator.geolocation.getCurrentPosition(function(position){
            x.innerHTML =  position.coords.latitude.toFixed(4);
            y.innerHTML = position.coords.longitude.toFixed(4);

            insertMap(latitude,longitude);
        });

  }

  getLocation();
});

然后在 inser_map.js

中

function insertMap(latitude, longitude) {

$('#map_canvas').html(initialize(latitude,longitude));

    function initialize(latitude,longitude){
   var mapCanvas = document.getElementById('map_canvas');
    var mapOptions = {
      center: new google.maps.LatLng(latitude,longitude),
      zoom: 8,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(mapCanvas, mapOptions);
    google.maps.event.addDomListener(window, 'load', initialize);
  }
}

insertMap函数将使用地图和用户位置的图钉填充id map_canvas的div。

然后，您可以使用此信息将用户的位置保留到数据库。

Ruby on Rails，用户可以设置自己的位置

1 个答案: