Search code examples
javascriptmapsmapboxopenstreetmapmapbox-gl-js

OSMBuilding with MapBox key


Looking at the example here: https://osmbuildings.org/examples/

In the JS section they define event for click:

 osmb.click(function(e) {
  var url = 'https://data.osmbuildings.org/0.2/uejws863/feature/'+ e.feature +'.json';
  ajax(url, function(json) {
    var content = '<b>OSM ID '+ e.feature +'</b>';
    for (var i = 0; i < json.features.length; i++) {
      content += '<br><em>OSM Part ID</em> '+ json.features[i].id;
      content += '<br>'+ formatJSON(json.features[i].properties.tags);
    }

    L.popup({ maxHeight:200, autoPanPaddingTopLeft:[50,50] })
      .setLatLng(L.latLng(e.lat, e.lon))
      .setContent(content)
      .openOn(map);
  });
});

In this code uejws863 is "YOUR_MAPBOX_KEY". I can find my MAPBOX access token but it still says "unauthorized" if i change uej.. with my token. Basically i'm trying to run this example on localhost. What should i do next to find the key or change api call?


Solution

  • Looking at OSM Buildings examples the "YOUR_MAPBOX_KEY" is used when making tile requests to MapBox servers, like:

    map.addMapTiles('https://{s}.tiles.mapbox.com/v3/[YOUR_MAPBOX_KEY]/{z}/{x}/{y}.png');
    

    When making requests to OSM Buildings servers they are using anonymous as a key:

    map.addGeoJSONTiles('https://{s}.data.osmbuildings.org/0.2/anonymous/tile/{z}/{x}/{y}.json');
    

    Although I´m getting results with the anonymouskey, for example:

    https://data.osmbuildings.org/0.2/anonymous/style.json

    I suggest you to register to get a key from OSM Buildings, not from MapBox

    https://osmbuildings.org/login/