Host the Cities: Skylines map generator locally

There are times when the Cities: Skylines Map Generator at https://heightmap.skydark.pl is not available. The free MapBox token expires because of the number of requests it serves.

We can host the site ourselves on our workstation and use it any time.

Install XAMPP

XAMPP is a free web server created by Apache Friends.

• Download the installer for your workstation’s operating system at https://www.apachefriends.org/download.html
• Install the application. As the popup will warn you, do not install it in the Program Files directory, as Windows restricts the access there.

Download the Cities: Skylines Map Generator application

The source code of the application is available on GitHub.

• With your web browser navigate to https://github.com/sysoppl/Cities-Skylines-heightmap-generator
• Click the Code button and select Download Zip
  
• Extract the Zip archive

Place the application in the XAMPP directory

XAMPP contains the Apache web server which can host our JavaScript web application.

• Create a directory called map in the htdocs folder of XAMPP. If you installed XAMPP to the default location, it is at C:\xampp\htdocs
  
• Move the images and src directories of the map generator application into the map folder
  

Start XMAPP

• Start the XAMPP Control Panel from the Start Menu
  
• Start the Apache web server
  
• Open your web browser and navigate to http://localhost/map/src/
  
  

Changing the MapBox access token

If the MapBox access token expires

• Create a free access token for yourself at https://www.mapbox.com/
• Update the value of mapboxgl.accessToken in the src/app.js file in line 47
  

To host the app from another directory

With the default configuration, XAMPP is looking for the web application in the htdocs directory within the XAMPP installation folder.

If you want to keep the Map Generator in another directory and host it from there with XAMPP:

• Open the XAMPP control panel
• Stop the Apache server
  
• Click the Config button and select Apache (httpd.conf)
  
• Place the project location into the DocumentRoot and Directory lines
  
• Start the Apache server
  
• Open your web browser and navigate to http://localhost/src/