使用 rails、ajax 和 Mapbox 生成标记

Question

我希望我的用户在创建 post 并输入一个国家时能够在他们自己的地图上（在他们的个人资料页面上）生成标记。现在，我可以创建一个 post，选择一个国家，并使用地理编码器 gem 保存经度和纬度，但我无法使用 ajax 调用生成标记，这是我的代码：

users_controller.rb（显示方法）：

 def show
     @post_all = @user.posts
      @geojson = Array.new()
      @post_all.each do |pos|
        @geojson << {
          type: 'Feature',
          geometry: {
            type: 'Point',
            coordinates: [pos.longitude, pos.latitude]
          },
          properties: {
            name: pos.title,
            address: pos.country,
            :'marker-color' => '#d9534f',
            :'marker-symbol' => 'circle',
            :'marker-size' => 'medium'
          }
        }
      end
      respond_to do |format|
        format.html
        format.json { render json: @geojson }  # respond with the created JSON object
      end
  end

我的 application.js 文件：

$(document).ready(function(){
  L.mapbox.accessToken = "pk.eyJ1IjoiYW50b3RvIiwiYSI6ImNpdm15YmNwNTAwMDUyb3FwbzlzeWluZHcifQ.r44fcNU5pnX3-mYYM495Fw";
  var map = L.mapbox.map('map').setView([48.856614, 2.3522219000000177], 4);
  var style = L.mapbox.styleLayer("mapbox://styles/antoto/civn0z51d00002ko4tmlch2zn").addTo(map);
  var marker = L.marker([48.856614, 2.3522219000000177], {
      icon: L.mapbox.marker.icon({
        'marker-color': '#d9534f'
      })
    })
    .bindPopup('hello')
    .addTo(map);
  map.scrollWheelZoom.disable();

  $.ajax({
    dataType: 'json',
    url: '/#{:id}/show.json',
    success: function(data) {
      geojson = $.parseJSON(data)
      console.log(data)
      map.featureLayer.setGeoJSON(geojson)
    },
    error: function(data) {
      console.log(data + ' error')
    }
  }); 
});

我认为我的 URL 在 ajax 调用中存在问题，但是当创建 geojson 时我不知道要使用什么 url。

Answer 1

我认为您的 application.js 文件是这里的问题所在。你有这条线 url: '/#{:id}/show.json', 你期望的地方（？）rails 会为你插入你当前的 user_id 值...

相反，我认为更好的解决方案是创建一个名为 grabUserData(user_id) 的函数，并为 ajax 调用 url: '/' + user_id + '/show.json' 创建 url 行，...

从您的 html 中的某处调用此 JS 函数，您将 rails 中的相关 user_id 转储到您的页面。

var thisID = <%= current_user.id %>; grabUserData(thisID);

使用 rails、ajax 和 Mapbox 生成标记

Generate marker with rails, ajax and Mapbox

ruby

ajax

jquery

ruby-on-rails

mapbox