Non-Earth maps/projections (flat maps)?

[GarrettAlbright]

maplibre-gl-js version: All

Question

I'm investigating MapLibre as a more performant alternative for Leaflet for a client project (in particular we're finding maps which have very many markers are rather slow and cumbersome to use). The project does not display Earth maps; rather, maps representing levels or "worlds" in video games with markers indicating locations of collectible items and such. (We host our own tilesets for the maps.) Thus the maps never represent anything other than flat rectangles. We store marker locations as X, Y points in our database corresponding with the map being shown at the maximum zoom level.

With Leaflet this is possible using the Simple CRS, but as far as I can tell, this is not possible in MapBox; even if we cajoled the maxBounds option to force the map to only show an area much smaller than the real world, we still have the issue of MapLibre only using a map projection which would not show the lines of latitude and longitude as a grid of perfect squares, such that we couldn't accurately position our markers according to the X, Y locations we have stored for them.

Am I wrong? Is there a way to display an undistorted "flat" map in MapLibre and accurately place our markers without too much trouble?

[wipfli]

That is an interesting use case. Maybe your question is related to custom projections. https://roadmap.maplibre.org/c/91-custom-coordinate-system-epsg-non-mercator-projection

[wipfli]

By the way you might want to pack the points into vector tiles with something like tippecanoe or planetiler...

[GarrettAlbright]

That is an interesting use case. Maybe your question is related to custom projections. https://roadmap.maplibre.org/c/91-custom-coordinate-system-epsg-non-mercator-projection

I do think allowing for a different projection is part of this, yes. MapBox has an equirectangular projection which seems like it'd do what we need.

By the way you might want to pack the points into vector tiles with something like tippecanoe or planetiler...

I'm not sure what you're saying here. Are you saying we should make vectorized tiles instead of just using the bitmaps we're using now? While that might be a plan for the future, our current goal is just to find a faster mapping system which can match the functionality of what we currently have. From there we can start considering improvements like that. :)

[HarelM]

Is this a duplicate of #168?

[GarrettAlbright]

Is this a duplicate of #168?

Partially, though importantly, for my needs, "another way to project the globe" is not what I'm asking for; I'm asking for "a way to show a flat plane." Or, if it helps to think of it that way, "a way to show a map that is already projected" can also work.

By the way, in case it helps anyone else, what I ended up doing for my client is keeping Leaflet but using Leaflet.PixiOverlay to show markers. This uses PixiJS for drawing stuff which renders to either WebGL or the browser canvas; we ended up forcing the canvas approach because most of our markers used different marker images and this was causing issues with WebGL not wanting to use that many textures. It was a lot of work since all of the custom marker stuff we were doing with the DOM before had to be redone as Pixi commands, but the end result was sufficiently fast maps no matter how many markers we cram onto them.

[HarelM]

I think #168 is basically it, if you can specify coordinates system which will create flat plane you're good to go.
Also, as mentioned in the linked issue d3 can also help here I believe.
Feel free to add you use case to the linked issue.
Closing...