Как я могу вставить простой URL-адрес mapbox, используя директиву leaflet?

Я новичок в Mapbox и Leaflet, и после ознакомления с директивой leaflet и документацией Mapbox я могу получить примеры карт для работы, но теперь, когда я интегрирую их и использую URL, с которым мне нужно работать, http://a.tiles.mapbox.com/v3/myMap.map-12341234.html например.

Это должно быть достаточно просто, но у меня проблема с картой белого цвета.

мой HTML выглядит

<leaflet tiles="tiles"defaults="defaults"></leaflet>

и JS

angular.extend($scope, {
    // tiles: 'http://a.tiles.mapbox.com/v3/myMap.map-12341234.html',
    tiles: 'myMap.map-12341234',
    defaults: {
      scrollWheelZoom: false
    }
  });
})

как я могу вставить URL, как мой http://a.tiles.mapbox.com/v3/myMap.map-12341234.html

Источник

1 ответ

Я не уверен, что правильно вас понял. Вы просто пытаетесь использовать буклет с вашим собственным стилем Mapbox? Если это так, вот пример:

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Plain Leaflet API</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src='https://api.mapbox.com/mapbox.js/v2.4.0/mapbox.js'></script>
<link href='https://api.mapbox.com/mapbox.js/v2.4.0/mapbox.css' rel='stylesheet' />
<style>
  body { margin:0; padding:0; }
  #map { position:absolute; top:0; bottom:0; width:100%; }
</style>
</head>
<body>


<div id='map'></div>

<script>
L.mapbox.accessToken = '<your access token here>';
// Replace 'mapbox.streets' with your map id.
var mapboxTiles = L.tileLayer('https://api.mapbox.com/v4/myMap.map-12341234/{z}/{x}/{y}.png?access_token=' + L.mapbox.accessToken, {
    attribution: '© <a href="https://www.mapbox.com/map-feedback/">Mapbox</a> © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
});

var map = L.map('map')
    .addLayer(mapboxTiles)
    .setView([42.3610, -71.0587], 15);
</script>


</body>
</html>

Надеюсь, что это помогает вам!

Источник
Другие вопросы по тегам