-1

I'm trying to incorporate markers on a map using Mapbox GL on my rails app.

In my controller file i have:

@boatramps = Boatramp.all.limit(6)
@geojson = {"type" => "FeatureCollection", "features" => []}
@boatramps.each do |boatramp|
  @geojson["features"] << {
    geometry: {
    type: 'Point',
    coordinates: [boatramp.long, boatramp.lat]
    },
    properties: {
    title: boatramp.id,
    :'marker-symbol' => 'monument'
    }
  }
end
respond_to do |format|
  format.html
  format.json{render json: @geojson}
end

for my ajax call I have

style.layers.push({
    "id": "markers",
    "type": "symbol",
    "source": "markers",
    "layout": {
      "icon-image": "{marker-symbol}-12",
      "text-field": "{title}",
      "text-font": "Open Sans Semibold, Arial Unicode MS Bold",
      "text-offset": [0, 0.6],
      "text-anchor": "top"
    },
    "paint": {
      "text-size": 12
    }
  });
$.ajax({
    type: 'GET',
    url: '/virginia',
    dataType: 'json',
    success: function(response){
        console.log(response)
        var markers = new mapboxgl.GeoJSONSource({ data: response});

        map.addSource('markers', markers);
    },
    error: function(){

    }
})

When I have 5 markers the call works fine and i get the boatramp id to show.(Also having issues with the "icon image" to show) As soon as I increase the limit to 6 or more. I get an error:

Uncaught TypeError: Cannot read property 'leaf' of undefined

As I zoom in and out on the map it executes the same error. Additionally, once I Have a considerable amount of objects 40 +, some of them don't show. Any ideas?

1 Answer 1

0

This is a known issue. https://github.com/mapbox/mapbox-gl-js/issues/987

I also asked aboutit on Github yesterday and I was told it would be fixed in the next release, in about a week.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.