Based on #4042 and 
https://github.com/openstreetmap/openstreetmap-website/pull/4042/files#r1966844335

This PR adds a Leaflet.Maplibregl-based layer using Versatiles Colorful.

The issue I'm having right now is relative URLs. To use relative URLs for 
sprites, tiles, and glyphs, you need to use 
[`TransformStyleFunction`](https://maplibre.org/maplibre-gl-js/docs/API/type-aliases/TransformStyleFunction/).
 This can only be supplied to 
[`Map.setStyle()`](https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/#setstyle).

In the demo page I did this [fairly 
easily](https://github.com/openstreetmap/vectortile-website/blob/6d459cec4940e8488d0f7695940256f5f5dc8feb/demo/shortbread/index.html#L62-L69),
 but I wasn't dealing with Leaflet.Maplibregl.

I'm not sure what the best approach here is. Some options I considered are
1. making colorful.json use absolute paths. This has a few secondary effects
   a. I'd still need to use `TransformStyleFunction` on the demo page since 
vector.openstreetmap.org should load tiles/sprites/glyphs via the CDN and 
dribble.openstreetmap.org should load tiles/sprites/glyphs off of dribble
   b. I'd want to put CORS restrictions on 
`https://vector.openstreetmap.org/demo/shortbread/colorful.json` restricting it 
to OSM domains and testing domains (e.g. localhost). Users of the tile layer 
should be hosting the style on their website, not depending on what we're 
hosting
2. Figuring out how to use `TransformStyleFunction` in Leaflet. I'm not 
sure if this is possible or where to start.

I did consider building the colorful.json style in this repo but decided 
against it. Some aspects of the style (glyphs, sprites) will have to be built 
externally no matter what, and it's best to keep the style JSON build with 
those other parts.

What I need is some input on what approach to take with the relative/absolute 
URLs.
You can view, comment on, or merge this pull request online at:

  https://github.com/openstreetmap/openstreetmap-website/pull/6137

-- Commit Summary --

  * Add Shortbread-based vector tile layer

-- File Changes --

    M app/assets/config/manifest.js (1)
    M app/assets/javascripts/leaflet.map.js (19)
    M app/assets/javascripts/osm.js.erb (3)
    M app/controllers/application_controller.rb (2)
    M config/eslint.config.mjs (3)
    M config/initializers/content_security_policy.rb (2)
    M config/layers.yml (9)
    M config/settings.yml (1)
    M package.json (3)

-- Patch Links --

https://github.com/openstreetmap/openstreetmap-website/pull/6137.patch
https://github.com/openstreetmap/openstreetmap-website/pull/6137.diff

-- 
Reply to this email directly or view it on GitHub:
https://github.com/openstreetmap/openstreetmap-website/pull/6137
You are receiving this because you are subscribed to this thread.

Message ID: <openstreetmap/openstreetmap-website/pull/6...@github.com>
_______________________________________________
rails-dev mailing list
rails-dev@openstreetmap.org
https://lists.openstreetmap.org/listinfo/rails-dev

Reply via email to