localhost vector tiles support?

[cdqrain]

I have a Vector Tiles server on my native enviroment. The Address like this http://localhost:5000/VectorTiles/layer/{z}/{x}/{y}, it return mapbox spec vectortiles. How to add it as a Source ?

[pathmapper]

Sources -> Add New Source

[cdqrain]

I know, but after add the source, I can not see the map. when zoom in/out, the chrome Network in Developer Tool can not capture request url.

[ImreSamu]

@cdqrain : some debugging tips:

• vector is XYZ URL , so your original link is not OK ( "/{z}/{x}/{y}.pbf" )
• Check in "Inspect Mode"
• OSMLab QA Tiles (Mapbox ) has only 1 zoom level [ z=12 ] - so zoom in - zoom out is not working.

[orangemug]

This might be the http/https issue as described in #177. If you using maputnik.github.io I believe you'll only be able to use https tile sources due to the same-origin policy.

You should see warnings in the browsers inspector

[cdqrain]

@orangemug I use maputnik in my local machine, should I change the tile server from HTTP to HTTPS?

[cdqrain]

@ImreSamu I serve the vector tile from .NET Core WebAPI, the URL MUST be ended with .pbf ?

[orangemug]

@cdqrain if maputnik is served locally over http:// then you can ignore my suggestion.

[cdqrain]

@orangemug But why maputnik can not request the source URL that I added?
when I add layer, it shows the error layers[1]: layer "test" must specify a "source-layer"

[orangemug]

It'll probably be one of 2 things

• The url you provide isn't returning the any of the correct data
• Some permissions issue with the request

As @ImreSamu suggested, console and network logs from the browsers inspector will help diagnose the issue

[ImreSamu]

@cdqrain :

I serve the vector tile from .NET Core WebAPI, the URL MUST be ended with .pbf ?

Your vector tile URL should work from the browser or via wget.
see more (.mvt , .vector.pbf, .pbf): mapbox/vector-tile-spec#69

You can replace manually the z/x/y values in your url, and you can test - it is working or not.

Sometimes it is a special link like http://localhost:3000/my-test-data/14/4823/6160.vector.pbf?access_token=my-top-secret-key, so you have to double check your server.

• Is it a static or dynamic server?
• Is it working with other vector tiles viewer?

[cdqrain]

@ImreSamu The issue is maputnik can not initiate request the Vector Tiles. Chrome Network inspector is empty.
It is a static tile server. Tile data store in sqlite, server get the tile data according to the xyz value and return pbf file.
I'm sure the server is working. I can view the tiles with Leaflet.VectorGrid.

[orangemug]

Ok so a few more things that might help. Maputnik is really just a JSON editor so lets work backwards from that

1. Export -> Download the style and check that the vector x/y/z source you expect is present the sources section of that JSON file.
2. Have you created a layer that uses the source in your style?

[cdqrain]

@orangemug When I added a layer, it gave me some error
warning.js:33 Warning: Failed prop type: The prop value is marked as required in MinZoomBlock, but its value is undefined.
in MinZoomBlock (created by LayerEditor)
in LayerEditor (created by App)
in div (created by ScrollContainer)
in ScrollContainer (created by AppLayout)
in div (created by AppLayout)
in div (created by AppLayout)
in AppLayout (created by App)
in App

warning.js:33 Warning: Failed prop type: The prop value is marked as required in MaxZoomBlock, but its value is undefined.
in MaxZoomBlock (created by LayerEditor)
in LayerEditor (created by App)
in div (created by ScrollContainer)
in ScrollContainer (created by AppLayout)
in div (created by AppLayout)
in div (created by AppLayout)
in AppLayout (created by App)
in App

warning.js:33 Warning: Failed prop type: Invalid prop value supplied to ZoomSpecProperty.
in ZoomSpecProperty (created by PropertyGroup)
in PropertyGroup (created by LayerEditor)
in div (created by Unknown)
in Unknown (created by Collapse)
in div (created by Unknown)
in Unknown (created by Collapse)
in Collapse (created by LayerEditorGroup)
in div (created by LayerEditorGroup)
in LayerEditorGroup (created by LayerEditor)
in div (created by LayerEditor)
in LayerEditor (created by App)
in div (created by ScrollContainer)
in ScrollContainer (created by AppLayout)
in div (created by AppLayout)
in div (created by AppLayout)
in AppLayout (created by App)
in App

Warning: Failed prop type: Invalid prop value supplied to SpecField.
in SpecField (created by ZoomSpecProperty)
in ZoomSpecProperty (created by PropertyGroup)
in div (created by PropertyGroup)
in PropertyGroup (created by LayerEditor)
in div (created by Unknown)
in Unknown (created by Collapse)
in div (created by Unknown)
in Unknown (created by Collapse)
in Collapse (created by LayerEditorGroup)
in div (created by LayerEditorGroup)
in LayerEditorGroup (created by LayerEditor)
in div (created by LayerEditor)
in LayerEditor (created by App)
in div (created by ScrollContainer)
in ScrollContainer (created by AppLayout)
in div (created by AppLayout)
in div (created by AppLayout)
in AppLayout (created by App)
in App

mapbox-gl.js:233 [object ProgressEvent]
Evented.fire @ mapbox-gl.js:233
Evented.fire @ mapbox-gl.js:233
Evented.fire @ mapbox-gl.js:233
o._tileLoaded @ mapbox-gl.js:99
i @ mapbox-gl.js:105
Actor.receive @ mapbox-gl.js:213

[orangemug]

@cdqrain they are just warnings and look fine to me. Can you also provide the details requested in #208 (comment)

[cdqrain]

@orangemug Hi, Maputnik can request my VectorTiles when I add layer. But for my VT projection is EPSG:4326 that Mapbox GL does't support. So I still can not view the data. Is it possible that Mapbox GL can use EPSG4326?

[pathmapper]

@cdqrain

Maputnik can request my VectorTiles when I add layer

Good to hear, sounds like your issue here is solved.

Is it possible that Mapbox GL can use EPSG4326

Never tried the following, but maybe these are good starting points:

• Alternative projections (4326 / WGS84; LAEA Arctic etc) openmaptiles/openmaptiles#179 (comment)
• https://www.developmentseed.org/blog/2016/12/15/dirty-reprojectors/

[orangemug]

Is it possible that Mapbox GL can use EPSG4326?

For anybody else finding this ticket, this comment provides a good answer mapbox/mapbox-gl-js#3184 (comment)

[orangemug]

This looks to be resolved. Closing the ticket, just shout if I've missed something and I'll reopen.