openmaptiles / fonts

Font glyphs for GL Styles with open fonts
https://fonts.openmaptiles.org/
217 stars 97 forks source link

Add Font Awesome! #9

Open melroy89 opened 5 years ago

melroy89 commented 5 years ago

Font Awesome is free (also for commercial use): https://fontawesome.com/free

Support Font Awesome out of the box: https://github.com/mapbox/mapbox-gl-js/issues/3605#issuecomment-290110941 https://github.com/mapbox/mapbox-gl-styles/issues/241

This makes it possible to use Font-Awesome icons in the text-field. So you can use font awesome icons and scale the image up as much as you want (and the icon keeps sharp)!

Using Font awesome icons also makes it possible to color the icons.

Example using geojson data & Font Awesome + color icon:

map.on('load', function() {
  map.addSource('markers', {
    type: 'geojson',
    data: './data/data.geojson'
  });

  map.addLayer({
    'id': 'markers',
    "interactive": true,
    "type": "symbol",
    "source": "markers",
    "layout": {
      'text-line-height': 1, // this is to avoid any padding around the "icon"
      'text-padding': 0,
      'text-anchor': 'center',
      'text-allow-overlap': true,
      'text-field': String.fromCharCode(62405),
      'icon-optional': true, // since we're not using an icon, only text.
      'text-font': ['Font Awesome 5 Free Solid'],
      'text-size': 25
    },
    "paint": {
      'text-translate-anchor': 'viewport', // up to you to change this -- see the docs
      'text-color': '#67A48E' // whatever you want -- can even be data driven using a `{featureProperty}`,
    }
  });
});
melroy89 commented 5 years ago

Merge?

anadolskiy commented 5 years ago

Any updates on this PR?

melroy89 commented 5 years ago

I would like to get it merged in. But nobody is maintaining this repository!!? Hello?

petrsloup commented 6 months ago

Hey, several notes/questions:

Ideally, clean up the PR to add only the original ttfs/otfs the same way as other fonts are added and let them be generated into PFBs with the same script as the rest of the fonts..