2016-11-24 68 views
0

我希望我的用户能够在他们自己的地图上(在他们的个人资料页面上)生成标记,当他们创建帖子并进入国家时。 现在,我可以创建帖子,选择一个国家,并使用geocoder gem保存经度和纬度,但是我无法使用ajax调用生成标记,这里是我的代码:使用rails,ajax和Mapbox生成标记

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') 
    } 
    }); 
}); 

我认为,在我的Ajax调用URL的问题,但是当创建GeoJSON的我不不知道要使用哪个网址。

回答

1

我相信你的application.js文件是这里的问题。你有这条线url: '/#{:id}/show.json',,你期待(?)的轨道将插你目前的user_id值你...

相反,我认为更好的解决办法是让一个叫grabUserData(user_id)功能,使URL行的AJAX调用url: '/' + user_id + '/show.json',...

从你的html中的某个地方调用这个JS函数,在那里你将user_id从rails导出到你的页面。

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

+0

嘿!谢谢您的回答 !我要去尝试一下! –

+0

它的工作!非常感谢你,感谢你的帮助! –