Mapbox markers do no render

Question

I am trying to populate a mapbox map using data from a public API call without success. I have tried many things but for some reason the markers are not rendering onto the map. Has anyone experienced similar problem?

Codepen

Thank you in advance.

JS

// Provide your access token
L.mapbox.accessToken = 'pk.eyJ1IjoiZGllZ29vcmlhbmkiLCJhIjoiY2lvcmQ1ZDRiMDAweXZrbTJ2dmlub2dtaSJ9.1JJGPZzeB3TWfIsTvMvRpA';

var coordinates = []
var commonName = []
geoJson = []

//Data
$.getJSON( "https://api.tfl.gov.uk/BikePoint", function( data ) {

  //i = number of loops / val = object
  $.each( data, function( i, val ) {
    coordinates.push(data[i].lat + ", " + data[i].lon);
    commonName.push(data[i].commonName);

    geoJson.push(
    {
      "type": "Feature",
      "geometry": {
          "type": "Point",
          "coordinates": [coordinates[i]]
      },
      "properties": {
          'Name': commonName[i],
          'marker-color': '#3ca0d3',
          'marker-size': 'large',
          'marker-symbol': 'rocket',
      }
    }); 
  });
  //console.log(coordinates);
  //console.log(commonName);
});

var mapSimple = L.mapbox.map('map_simple', 'mapbox.light')
  .setView([51.494, -0.171], 14);
var myLayer = L.mapbox.featureLayer().setGeoJSON(geoJson).addTo(mapSimple);
mapSimple.scrollWheelZoom.disable();

console.log(geoJson)

HTML

<html>

<head>
  <meta charset=utf-8 />
  <title></title>
  <script src='https://api.mapbox.com/mapbox.js/v3.0.1/mapbox.js'></script>
  <link href='https://api.mapbox.com/mapbox.js/v3.0.1/mapbox.css' rel='stylesheet' />

</head>

<body>
  <div id='map_simple' class='map'> </div>
</body>

</html>

Answer 1

I strongly suspect that you are calling the invalid 'marker-symbol'. In Mapbox Studio, rocket symbol usually comes with the number determining exact style, for example 'rocket-11', not just 'rocket'.

Open your style in MapboxStudio and check the exact name of your rocket icon.

Mapbox markers do no render

Question

1 answers

solution1
0 2017-04-02 13:47:32

Mapbox markers do no render

Question

1 answers

solution1 0 2017-04-02 13:47:32

solution1
0 2017-04-02 13:47:32