2016-04-18 10 views
0

私はMapbox Studioでスタイルを作っており、リーフレットプロジェクトでそのスタイルを使用できるかどうか疑問に思っていました。スタイルURLとアクセストークンは持っていますが、マップボックスIDはありません。リーフレットでこの作業を行うにはどうすればよいですか?出来ますか?リーフレットでMapbox製作のスタイルを使用することはできますか?

スタイルのURL:mapbox://スタイル/ gustavsvensson/cin1hwd9a00bncznomsx507se

+0

スタイルをMapboxにアップロードしましたか? – BDD

答えて

1

あなたがオンラインMapboxにアップロードしたり、エンタープライズシステムアトラスサーバーを使用してMapbox IDを取得する必要があります。彼らはそれを置くことができ、あなたのスタイルIDを得ることができる無料のアカウントを持っています。

スタジオで作成したマップスタイルでテストしたスニペットの例を次に示します。タイルを適切にレンダリングするには、キー、ユーザー名、およびマップボックスIDを指定する必要があることに注意してください。

<!DOCTYPE html> 

<html> 
    <head> 
     <meta charset=utf-8 /> 
     <title>Add styles made with Mapbox Studio to a Leaflet map</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'; 
     var map = L.map('map').setView([38.97416, -95.23252], 15); 


     // Add tiles from Mapbox Style API(https://www.mapbox.com/developers/api/styles/) 
     // Tiles are 512x512 pixels and are offset by 1 zoom level 
     L.tileLayer(
     'https://api.mapbox.com/styles/v1/<mapbox username>/<style ID>/tiles/{z}/{x}/{y}?access_token=' + L.mapbox.accessToken, { 
      tileSize: 512, 
      zoomOffset: -1, 
      attribution: '© <a href="https://www.mapbox.com/map-feedback/">Mapbox</a> © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>' 
     }).addTo(map); 
     </script> 
    </body> 
</html> 
関連する問題