How to create a map from a video game

Question

I saw this question severall times (e.g. What projection to use to get a game map into QGIS? and How do I specify a CRS for a fictional game map in QGIS?) but since I am new to GIS, I need further instructions.

I am trying to port the map from the game PLAYERUNKNOWN's BATTLEGROUNDS to the right format for a tileserver. My goal is to create an android app which shows the map using some SDK like Google Maps or Mapbox. There already exists an online version from another developer.

So far I used MapTiler to convert an image of the map to map tiles. However, when I use "Standard Tiles", the map is projected on a globe an therefore the image is stretched and clinched. Using the option "Raster Tiles" creates some white borders around my map and I think makes it harder to add POIs later, because I don't have a coordinate system.

Can anyone tell me how to convert this image of the map into a GIS format while still preserving the coordinate system from the game so that I can later add POIs (spawn locations for vehicles and items) on the map using the same coordinates as in the game?

For reference: The distance between two white lines on the linked map is 100m and the distance between two yellow lines is 1km.

I am an experienced android developer but this projections and coordinates stuff is very confusing for an outsider.

Answer 1

I don´t think you should be concerned too much about the spherical projection as your map only covers a few sqkm...as long as you do a correct georeferencing. In order to add POIs and alter the map later, QGIS could be the software of your choice. A general workflow (QGIS/MapTiler) would be:

1. georeference the picture into WebMercator (EPSG:3857)
2. add vector layer and populate with POIs
3. style the POIs
4. export to GeoTiff (this is a nasty part...)
5. import in MapTiler (use Mercator Tiles)

Georeferencing means you define a couple of points on your map and add their respective coordinates (x,y in Meter for WebMercator) to let the software derive, transform and interpolate coordinates to every single pixel of the picture. To minimize stretching you should calculate the centerpoint (preferrably at an grid intersection) as coordinates 0, 0 and add the grid cell size in meter accordingly (as in euclidian plane). As reference points you should use equally distributed grid intersections.