06. Icons Configuration

Icons Section in the Config

  "icons": {

// These fields set which categories you want your users to be able to change the icons for.
// Valid options include all of the top level folders here: https://github.com/UIcons/UIcons.
// I would not recommend enabling or setting a default for "misc" or "weather", however.

    "customizable": [
      "gym",
      "invasion",
      "pokemon",
      "pokestop",
      "reward",
      "team",
      "type"
    ],

// Default Icons section can be used to set your defaults 
// to a mix of different style combinations if desired

   "defaultIcons": {
      "pokemon": "PMSF",
      "raid": "Home",
   },

// Add your icon styles here, only "name" and "path" are required.
// It's okay if your repo only has some of the folders. ReactMap will automatically 
//    search for the folders and only list what is found.
// ie, if you make a custom repo with only Gyms, your custom icon set will only be 
//    listed in the Gyms icon section for your users to select.

    "styles": [
      {
        "name": "Default",
        "path": "https://raw.githubusercontent.com/WatWowMap/wwm-uicons/main/",

// Modifiers for each icon set are completely optional. They can be enabled for the same 
//    top level folders supported by UICONS.
// Modifier values are generally multipliers, so only small adjustments are usually necessary.
// Special modifier notes are noted below
// The defaults for offSetX, offSetY, and sizeMultiplier are 1, for reference.
// The defaults for popupX and popupY are 0 and are additive, for reference.

        "modifiers": {
          "gym": {

// Gyms have some special properties to enable manual offsets per number of defenders.
// Only necessary if your gym icons are sized according to the number of defenders in them.

            "0": 1,
            "1": 1,
            "2": 1,
            "3": 3,
            "4": 4,
            "5": 4,
            "6": 18
          }
        }
      },
      {
        "name": "PMSF",
        "path": "https://raw.githubusercontent.com/whitewillem/PogoAssets/main/uicons-outline/",
  // Must place the entirely of the uicons directory into public/images/uicons, in this case in a folder named "PMSF"
  // See this PR: https://github.com/WatWowMap/ReactMap/pull/292
        "local": "PMSF",
        "modifiers": {
          "reward": {
            "offsetX": 0.2,
            "offsetY": 0.5,
            "sizeMultiplier": 1.15,
            "popupX": 0,
            "popupY": 0
          },
          "invasion": {
            "offsetX": -0.45,
            "offsetY": 1.7,
            "sizeMultiplier": 2
          },
          "pokestop": {
            "sizeMultiplier": 2
          }
        }
      },
      {
        "name": "Home",
        "path": "https://raw.githubusercontent.com/nileplumb/PkmnHomeIcons/master/UICONS/"
      },
      {
        "name": "Shuffle",
        "path": "https://raw.githubusercontent.com/nileplumb/PkmnShuffleMap/master/UICONS/"
      },
      {

// "invasion" also includes "removeQuest" prop which will only show invasions when a stop 
//    has an invasion and a quest, similar to PMSF.

          "invasion": {
            "offsetX": 0.05,
            "offsetY": 0.7,
            "sizeMultiplier": 1.5,
            "removeQuest": true
          },

// "manualPopup" is for making small adjustments to the popup position

          "pokestop": {
            "sizeMultiplier": 2,
            "manualPopup": -100
          }
        }
      }
    ],

// Here you can override the sizes for each of the categories. 
// Most them follow the same UICONS parent folder structure but with some additions for ReactMap.

    "sizes": {
      "device": {
        "sm": 15,
        "md": 30,
        "lg": 50,
        "xl": 70
      },
      "nest": {
        "sm": 20,
        "md": 40,
        "lg": 60,
        "xl": 80
      },
      "gym": {
        "sm": 20,
        "md": 35,
        "lg": 50,
        "xl": 65
      },
      "raid": {
        "sm": 20,
        "md": 35,
        "lg": 50,
        "xl": 65
      },
      "pokestop": {
        "sm": 15,
        "md": 25,
        "lg": 35,
        "xl": 45
      },
      "invasion": {
        "sm": 10,
        "md": 20,
        "lg": 30,
        "xl": 40
      },
      "reward": {
        "sm": 20,
        "md": 30,
        "lg": 40,
        "xl": 50
      },
      "pokemon": {
        "sm": 20,
        "md": 40,
        "lg": 60,
        "xl": 80
      },
      "spawnpoint": {
        "sm": 0.5,
        "md": 1,
        "lg": 2,
        "xl": 3
      }
    }
  },