So my group decided on doing an app using emoji’s and mapbox, it’s Pokemon Go for chat where you (or businesses) could drop and discover messages (mockup screenshots below) around you. Well apparently you need to upload images to Mapbox Studio for custom marker icons in MapboxGL, the only other custom image (using css) was the user’s avartar which updated on map move rather than as a marker property. We thought we could upload all 1200+ emoji / 874 twemoji svg files and be done (they were only 1mb, why not?), but strangely there was an (AFAIK) undocumented 500 sprite limit.
Anyway emojis like flags and letters would not be too relevant for our purposes, so we just had to choose which emojis we would support. Based on http://emojitracker.com/ we thought that using the people + objects categories (425 twemojis) would cover well enough ground for people to post their reactions and activities.
The next step was to upload the svgs. To choose a subset of twemojis to upload to Mapbox Studio and to use with react-emoji-picker in our app, I had to first get the list of twemojis we would support on the emoji picker. There was a category to name mapping, then there was a name to unicode mapping, put the two together and a script and tada I got the files, here’s the repo.