kopia lustrzana https://github.com/osm2vectortiles/osm2vectortiles
Improve Mapbox Studio Classic quickstart tutorial
rodzic
3fc7741e73
commit
496dcce179
|
@ -4,7 +4,7 @@ title: Create a new Style with Mapbox Studio Classic
|
|||
published: true
|
||||
---
|
||||
|
||||
# Create a new Style with Mapbox Studio Classic
|
||||
# Create a new Style with Mapbox Studio Classic
|
||||
|
||||
You can use [the same resources from Mapbox](https://www.mapbox.com/help/getting-started-studio/)
|
||||
for learning how to design maps with Mapbox Studio Classic. This tutorial will show you how to customize
|
||||
|
@ -26,7 +26,7 @@ In `Styles and Resources` create a new style and choose `OSM Bright 2`. Then sav
|
|||
Now you are based of the vector tiles from Mapbox Streets. To use our free and Open Source vector tiles
|
||||
you need to `Change Source` in `Layers`.
|
||||
|
||||
Enter the [TileJSON](https://github.com/mapbox/tilejson-spec) url of our vectortiles server `vectortiles.osm2vectortiles.org/world.json`.
|
||||
Enter the [TileJSON](https://github.com/mapbox/tilejson-spec) URL of our vectortiles server `https://osm2vectortiles.tileserver.com/v1.json`.
|
||||
You can later replace this with your own vector tiles server if you want to serve everything by yourself.
|
||||
|
||||
Because our vector tiles are to a large part Mapbox Streets compatible you won't see any drastic changes.
|
||||
|
@ -34,6 +34,17 @@ In fact you could even continue styling your project with Mapbox Streets and mak
|
|||
|
||||

|
||||
|
||||
## Design your Map
|
||||
|
||||
Create a awesome map with a great design. We recommend the
|
||||
[Mapbox Studio Classic Quickstart tutorial](https://www.mapbox.com/help/style-quickstart/)
|
||||
to get a overview of all the options you can use to create good looking maps.
|
||||
To get some inspiration you can
|
||||
look at the [example maps](/maps) that work together with osm2vectortiles.
|
||||
|
||||
[](/maps)
|
||||
|
||||
## Deploy your Map
|
||||
|
||||
Because you are no longer bound to Mapbox for hosting you can now host the maps yourself and save money.
|
||||
Learn [how to deploy a raster tile server with Docker](/docs/serve-raster-tiles-docker/)
|
||||
or get started by [displaying your first raster based map locally](/docs/start/).
|
||||
|
|
|
@ -4,13 +4,16 @@ title: Display Map with Mapbox GL
|
|||
published: true
|
||||
---
|
||||
|
||||
## Display Map
|
||||
# Display Map with Mapbox GL
|
||||
|
||||
To display a custom MapboxGL based map you need to create a HTML file and
|
||||
reference the public vector tile server of osm2vectortiles. You are free to download and
|
||||
To display a custom Mapbox GL based map you need to create a HTML file and
|
||||
reference [the public vector tile CDN](/docs/use-public-cdn/).
|
||||
You are free to download and
|
||||
host the vector tiles yourself but we provide a fast and distributed CDN service for serving
|
||||
the PBFs for you.
|
||||
|
||||
## Clone example Repository
|
||||
|
||||
The easiest way to get started is using the `mapbox-gl-js-exmaple` repository.
|
||||
Clone the repository and change into the directory.
|
||||
|
||||
|
@ -30,14 +33,14 @@ You can create your own styles with Mapbox Studio.
|
|||
|
||||
If you want to serve the Mapbox GL Style JSON without Mapbox you need to configure three URLs.
|
||||
|
||||
1. Change the `sources` URL to the free osm2vectortile serve or use your own server
|
||||
1. Change the `sources` URL to the free CDN server or use your own server
|
||||
2. Change the `sprite` URL to the location of your sprites
|
||||
3. Change the `glyphs` URL to the location of your fonts
|
||||
|
||||
```javascript
|
||||
"sources": {
|
||||
"mapbox": {
|
||||
"url": "http://vectortiles.osm2vectortiles.org/world.json",
|
||||
"url": "http://osm2vectortiles.tileserver.com/v1.json",
|
||||
"type": "vector"
|
||||
}
|
||||
},
|
||||
|
|
|
@ -61,13 +61,13 @@ published: true
|
|||
<div id="raster-map" class="map-preview"></div>
|
||||
<div id="map-container">
|
||||
<button id="raster-osm-bright" class="map-button">OSM Bright</button
|
||||
><button id="comic-map" class="map-button">Comic Map</button
|
||||
><button id="retro" class="map-button">Retro</button
|
||||
><button id="comic-map" class="map-button">Comic Map</button
|
||||
><button id="light-map" class="map-button">Light Map</button
|
||||
><button id="dark-map" class="map-button">Dark Map</button
|
||||
><button id="streets-basic" class="map-button">Streets Basic</button
|
||||
><button id="woodcut" class="map-button">Woodcut</butto><button id="pirates" class="map-button">Pirates</button
|
||||
><button id="wheatpaste" class="map-button">Wheatpaste</button
|
||||
><button id="retro" class="map-button">Retro</button>
|
||||
><button id="wheatpaste" class="map-button">Wheatpaste</button>
|
||||
</div>
|
||||
</br>
|
||||
<div id="raster-style-reference"></div>
|
||||
|
|
Plik binarny nie jest wyświetlany.
Przed Szerokość: | Wysokość: | Rozmiar: 1.7 MiB Po Szerokość: | Wysokość: | Rozmiar: 853 KiB |
Plik binarny nie jest wyświetlany.
Po Szerokość: | Wysokość: | Rozmiar: 2.3 MiB |
Ładowanie…
Reference in New Issue