Leaflet.emoji

Leaflet.emoji is a Leaflet plugin to render a layer into a emoji string.

• Emoji Maps: thematic mapping with emojis

• Emoji City: live OpenStreetMap data in emojis

Usage

The plugin is currently at a "proof of concept" stage, stability and performance are not there yet and API is likely to heavily change.

Basic usage

var emoji = L.emoji(geoJSON, {
  emoji: '😊'
}).addTo(map);

Set emoji size in grid

var emoji = L.emoji(geoJSON, {
  emoji: '👍',
  size: 30
}).addTo(map);

Using a configuration object

var emoji = L.emoji(geoJSON, {
  emoji: {
    property: 'countryName',
    values: {
      'United Kingdom': '☂️'
    },
    defaultValue: '☀️️',
    emptyValue: '🐟'
  }  
}).addTo(map);

• property: refers to the geoJSON property to be matched
• values: a property value - emoji hash
• defaultValue: the emoji to fill polygons if it doesn't match any value. Whitespace is rendered if omitted.
• emptyValue: the emoji to fill space outside all polygons. Whitespace is rendered if omitted.

Using shortcodes

var emoji = L.emoji(geoJSON, {
  emoji: ':sparkles:'
}).addTo(map);

Sequential scales

var emoji = L.emoji(geoJSON, {
  emoji: {
    property: 'hdi_2013',
    classes: {
      'breaks': [    4.3, 4.6, 4.9, 5.4    ],
      'emojis': ['😵', '🙁', '😐', '🙂', '😃']
    }
  }
}).addTo(map);

Using a function

var emoji = L.emoji(geoJSON, {
  emoji: function (feature) {
    if (!feature) {
      return null;
    }
    return L.Emoji.getShortcode(':flag_' + feature.properties.iso2.toLowerCase() + ':');
  },
  emojiFunctionEditableEmptyValue: '◻'
}).addTo(map);

emoji can be a function that will take the geoJSON feature as a parameter.

To render white space, return null. In editable mode, you will need to specify a Unicode character to fill in the blank, by setting emojiFunctionEditableEmptyValue (to L.Emoji.EMPTY for instance)

To match a shortcode with an emoji, use L.Emoji.getShortcode.

Options

debug show underlying geoJSON polygons canvas.

editable use copy-pastable textarea instead of individual <span>s. When set to true, emptyEmoji will be `

emptyEmoji character used to fill in whitespace, defaults to L.Emoji.EMPTY