mgschoen/shapes-of-the-world

A map-based country guessing game for the browser

Shapes of the World

Can you identify all the world's nations just by their geographical shape and location? Find out with this map-based country guessing game for the browser. Built with Svelte.

Play the game

Specs

• uses Mapbox and Mapbox GL JS for map display and interaction
• geographical calculations are done with Turf.js
• geo data is obtained from open sources, but was aggregated and modified for this game
• styled with Tailwind CSS
• app written in Svelte JS

Development

Setup

$ npm install

You will need a Mapbox account and an access token to run and build the game locally.

Store your public token in an environment variable called MAPBOX_PUBLIC_TOKEN.

Run in watch mode

$ npm run dev

Debug mode

Append ?debug=true to the URL to enable debug controls.

Feature previews

This repository is integrated with Netlify. For each pull request, a deploy preview is created. Once the preview is ready, the Netlify bot will comment the links in your PR.

shapes-of-the-world's Issues

May need to make your mapbox style public

Awesome project!

According to the Mapbox docs, if your style is public, it should be accessible with any public access token, however I am getting a 404 (Not Found).

https://api.mapbox.com/styles/v1/argonns/ckxf3oh2k2xmo15phqc819m15?access_token={my public access token}

I was able to get it working using a map style connected to my public access token.