Maplibre x MapBox API

[weleo]

maplibre-gl-js version: 2.1.9

I am trying to use Maplibre with the Mapbox API as describes here,
but I am getting URL scheme "mapbox" is not supported..

1. Are the docs up-to-date?
2. To what extent do I need to change Mapbox style specifications so that they can be consumed by Maplibre?

[acalcutt]

I'm pretty sure support for "mapbox://" urls has been dropped from maplibre 2.x . I think the consensus is if you are using mapbox sources, you should be using the offical mapbox-gl-js to comply with their license.

You might be able to use something like this

sources: {
	mapbox: {
		type: 'vector',
		attribution: 'Mapbox',
		tiles: ['https://a.tiles.mapbox.com/v4/mapbox.mapbox-streets-v7/{z}/{x}/{y}.vector.pbf?access_token=your_key']
	}
}

example: https://stackblitz.com/edit/web-platform-dbcb9a

[HarelM]

Yup, mapbox scheme support was dropped.
Converting this into a discussion.
Note that there's already a discussion that was done before dropping the support to notify the community.

[acalcutt]

Is there a reason why a workaround like #1226 (comment) wouldn't work for you? It's mostly updating the urls in your style to not have mapbox:// and including your key. I admit changing the style is a but of a pain, but if you only have a few styles that use mapbox it doesn't seem like a huge change. (see the example in that post)

[itbeyond]

I have now managed to make this work via a hard code of the styles. I also just want to clarify that when you do this and use MapLibre vs Mapbox the MapBox billing adjusts from a Map Load model to a Tile Load model as the map.load event is not fired from MapLibre which it is in MapBox even in V1, The V1 to V2 difference is that map.load is fired when a mapbox map is rendered V1 vs map.load is fired when the map object is created V2. Moving to a tile load model I believe for most people will actually cost more for the MapBox services which is also fine and does reinforce my comment about paying for services, so I think it is wrong to insinuate that people will not be paying MapBox if they want to use MapBox styles in the MapLibre library.

I need to do a bit more playing and work with addProtocol to understand how a plugin could be created.

[wipfli]

The way I understood the message was the people using Mapbox should pay for their great services. I think I did not see someone saying that using MapLibre with their services will allow you to circumvent paying for tiles...

[wipfli]

But anyway, I am glad that you found a solution @itbeyond and it is great if you can switch to MapLibre GL JS!

[wipfli]

So welcome to the club :)

[rowanwins]

I have just published the first version of a small library with the aims of helping to transform styles for use in MaplibreGL
https://www.npmjs.com/package/maplibregl-mapbox-request-transformer

Feedback or collaborators welcome.

import { isMapboxURL, transformMapboxUrl } from 'maplibregl-mapbox-url-transformer'

const mapboxKey = 'pk.123'

const transformRequest = (url, resourceType) => {
  if (isMapboxURL(url)) {
    return transformMapboxUrl(url, resourceType, mapboxKey)
  }
  
  // Do any other transforms you want
  return {url}
}

var map = new maplibregl.Map({
  container: 'map',
  center: [-122.420679, 37.772537],
  zoom: 13,
  style: 'mapbox://styles/mapbox/satellite-streets-v11',
  transformRequest
});

[ghost]

This looks very useful.

Please add it to https://github.com/maplibre/awesome-maplibre and make sure you mention buzzwords that people might search for.
I'd recommend adding https://github.com/rowanwins/maplibregl-mapbox-request-transformer instead of the npm address though.