Search code examples
ruby-on-railsleafletmimemapboxgeojson

render geojson w/ respond_to rails & mapbox/leaflet


So I am currently trying to request some geojson data from my rails controller. I am using the loadURL method provided to me through mapbox/leaflet to make the ajax call to my controller.

$(document).on("ready", function() {
  L.mapbox.accessToken = 'token is here';
  var userMap = L.mapbox.map('user-map', 'mapbox.run-bike-hike')
    .addControl(L.mapbox.geocoderControl('mapbox.places'))
  .setView([37.7833, -122.4167], 12);
  var featureLayer = L.mapbox.featureLayer().loadURL('http://localhost:3000/users/1/trails.geoJson').addTo(userMap)
  console.log(featureLayer);
  // getTrailPoints(userMap);
  featureLayer.on('ready', function(){
    userMap.fitBounds(featureLayer.getBounds());
  });
});

The above code is able to hit my controller and my controller is able to retrieve the correct data. Here is what I have in my controller:

def index
    user = User.find_by(id: params[:user_id])
    @trails = user.trails
    @geojson = Array.new
    build_geojson(@trails, @geojson)
    p "*" * 50
    p @geojson

    respond_to do |format|
      format.html
      format.geojson { render geojson: @geojson }
    end

end

The build_geojson method works fine, you will have to trust that. However, what is not working is the format.geojson and rendering it as geojson. I'm pretty sure I need to create a Mime but I am unsure how to do so or in what way I should go about doing it with geojson. Any help would be greatly appreciated. I will also answer any questions.

I do currently have it formatted in just json because geojson is just json. However with mapbox when I do that, I get the following error:

http://a.tiles.mapbox.com/v4/marker/pin-l-tree+00607d.png?access_token=pk.e…hIjoiNDQ5Y2JiODdiZDZmODM0OWI0NmRiNDI5OGQzZWE4ZWIifQ.rVJW4H9TC1cknmRYoZE78w Failed to load resource: the server responded with a status of 400 (Bad Request)

The error basically results in the image not being loaded.


Solution

  • There is no tree icon in the currently-supported Mapbox icons. Use park instead, which is also a picture of a tree.