Proper way to create tile maps for Leaflet.js? - openstreetmap

I am trying to build a custom-designed map, with correct geodata. It could even be an image created in illustrator, but it has to be exported as a set of tiles in correct map format - so that it can be read by tools like Leaflet.js
What confuses me is that none of the available map tools seem to work very well together. I did find Tilemill, which looks very promising (it has a very clean interface and works with CSS), but:
Openstreetmaps does not allow downloading tile images, only XML data in OSM format.
Tilemill does not allow importing Openstreetmaps XML data (why!).
Even if you manage to design a map in Tilemill, you still cannot export tile images, only a proprietary SQL database format? What's the point of that?
If Tilemill is useless, are there other tools that allow opening OSM XML data and applying your own design styles?
There are some sources that talk about building your own tile server:
This source suggests converting OSM to PostGIS using SQL, and then using a custom python script and a tool named Mapnik. Then it says that it's not recommended to use Mapnik for OSM....
This source sounds promising, but then it casually mentions that you have to build and run your own custom Linux distribution...
Is there a simpler way to create map tiles with correct filenames and folders for Leaflet.js?

Tilemill does not allow importing Openstreetmaps XML data (why!).
OpenStreetMap XML is an interchange format: it's a way to transfer things around, not to use them. You can import it into PostGIS and use it in TileMill.
Even if you manage to design a map in Tilemill, you still cannot export tile images, only a proprietary SQL database format? What's the point of that?
If you export millions of tile images, you'll fill up your hard disk and run out of inodes. It's a bad deal. That's why we made MBTiles, which is not proprietary, but very much open source in every definition of the word, and you can export it to disk with mb-util if you so wish.
If Tilemill is useless, are there other tools that allow opening OSM XML data and applying your own design styles?
TileMill isn't useless, but if you want another option, you can use Maperitive, though it is proprietary in every sense of the word.

Related

Import .ai (illustrator file) in Unity and display them

I want to load an illustrator file in my game. Unity should recognize different layers, colors, and forms, and layers with text and display them in a 2d canvas.
The goal is that the players can click on different forms and that unity recognize them as individual forms. Do you know any unity asset or a way to make this possible?
For example when you import an image like this as an illustrator file -> https://www.mandala-bilder.de/mandala/erwachsenemandalas/mandala-ideen-erwachsene.pdf
I thought about an SVG file but then I canĀ“t use the different layers.
Illustrator has a proprietary file format, it has no publicly available documentation for newer versions. While you can dig out old specifications (this is why some programs only support AI files saved in ancient versions) http://www.idea2ic.com/File_Formats/Adobe%20Illustrator%20File%20Format.pdf I do not think you can just go in and start supporting a 2021 variant without requesting (and motivating) the spec from Adobe. They might also want to charge you for it.
SVG on the other hand is free and it's spec is public so there is much widely spread support. also SVG supports groups which can get your around the need for layers
Vector Express is a free conversion API you should be able to use. (requires a network connection, though)
https://github.com/smidyo/vectorexpress-api
You should be able to POST a request (https://docs.unity3d.com/ScriptReference/Networking.UnityWebRequest.Post.html) to this endpoint, with the raw AI file as the body:
POST https://vector.express/api/v2/public/convert/ai/gs/pdf/psd2svg/svg/
This will return a JSON object with a link to an SVG file that you can then download and display.

Get/list source-layers from Mapbox GL JS vector source

In Mapbox GL JS I am adding a vector tile source from a locally hosted mbtiles file. Adding this source to my map instance is easy like below.
map.addSource("polylinesSource",{
"type":"vector",
"tiles": [
"http://localhost:8000/polylinesJoined/{z}/{x}/{y}.pbf"
]
})
The source-layers from this service will be dynamic and I am hoping for a way to reference all those layers once the source is loaded. Is it possible to list all the layers in a source once loaded?
This is surprisingly fiddly to do. Mapbox-GL-JS doesn't expose any methods to list the vector tile source layers available within a tileset.
I built vector inspector to solve this exact problem. The code here shows you the process for extracting that information from a .pbf: https://github.com/stevage/vector-inspector-api/blob/master/server.js
Alternatively, since you have the local mbtiles file, another option is to extract it locally. Using another tool I built, tileinfo.
Also, if you serve the tiles using something like tessera you can access the layers info directly at the TileJSON endpoint.

Multiple gpx layers in Mapbox Studio style editor

If I upload a gpx trace to
convert it into a tileset, I can use it in the Style editor just as expected. But if I upload a second and want to use it as a data source for another or even the same layer, It is greyed out with the following notice:
This source includes vector layer names that are already in your composite source. vector layer names must be unique.
I didn't set any name myself or changed the gpx traces in a weird way. I even renamed the style layer. I looked into the details of the automatically created tileset but I couldn't see a name which was the same on both sources. The only thing that both gpx traces had was the "tracks" part of the source, which contained the actual trace.
But I can't figure out how to change this name.
Is there some way to upload two gpx traces and use them in the same style?
I want to avoid workarounds if possible but if it doesn't work another way, I imagine that there are at least two workarounds:
1. Convert into a geojson file, upload as a dataset and convert into a tileset.
2. Somehow append multiple gpx files into one, but keep the traces separate.
What would be the downsides, apart from having more files to keep up2date? Is (2) even possible?
Update:
In the end I did convert the gpx files into geojson tracks. THis did work exactly as hoped. But I'm still interested if there's a shorter way or if I just did something wrong previously.
Disclaimer: I work at Mapbox.
It isn't possible to upload multiple GPX files directly to the same map style in Mapbox because their layer names are automatically set as track. To fix this, I recommend following these steps:
Convert your data to GeoJSON using a tool like toGeojson
Upload the GeoJSON to Mapbox Studio
Add the data to your map in Studio or GL JS
So to answer your question: you are going about this the correct way. One thing to note: you don't have to upload it as a dataset first. You can upload your GeoJSON as a tileset directly, unless you have some editing you want to do first.

Use existing offline raster mbtiles to display on mapbox map

I'd like to transition the map in my app from currently Apple-Maps-SDK to Mapbox. My users already downloaded a lot of offline maps into several .mbtiles tiles containing raster data.
My question now is if it's possible to still use those while the user will be transitioning to the new maps? I just don't simply want to delete all offline maps and tell the user that he needs to download everything again right now, but rather give them a time-window to do that...
I was looking at MGLRasterTileSource/MGLSource and thought that I can create a subclass and somehow provide my own data to the map, but this does not seem to be supported. There are no datasource methods on it for that purpose...
Would be great if somebody could point me into the direction on how to archive what I want.
EDIT:
So I thought it might work that way... I migrate my existing raster tiles into a downloaded pack inside the mapbox offline database. So I had a look at the caches.db but at least the data in there is not just a plain png/jpg (tried with the mapbox satellite images, which should be raster).
Cause there is no public interface for getting existing raster-tiles in there, is there?
I've seen an other solution where somebody is hosting a webserver inside the app... but that somehow looks like quite an overkill to me?!?
https://gist.github.com/namannik/3b7c8b69c2d0768d0c2b48d2ed5ff71c

How to compact mbtiles with mbutil

I'm creating maptiles with arc2earth and ArcGIS and it creates a lot of duplicate tiles.
I would like to reduce its size using mbtiles. I think it is possible to "compact" tiles, but I don't find the way.
Do you know if mbtiles still have compact command or it is just been deprecated?
Thanks!
At the moment mbutil doesn't expose this as an option - TileMill is the only client that supports properly compressed tiles. Of course, mbutil is an open source project, so if you're game, you can built it and add it.