FontAwesome in SceneView

quooston

It would be good if someone posted a modern working example of using FontAwesome in a SceneView that actually works. 

It's so common to use FontAwesome and when we're embedding maps into apps that can use FA it would be very nice to easily know how to place FA icons into a map and also for labels. 

Thanks

ArnoFiva

Try this: https://codepen.io/arnofiva/pen/ExRONxX

It's based on the online documentation, showing how to load and use fonts in label:
https://developers.arcgis.com/javascript/latest/labeling/#fonts-for-sceneview

CSS

 

@font-face {
  font-family: "FontAwesome";
  font-style: normal;
  font-weight: 400;
  font-display: auto;
  src: url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.ttf")
    format("truetype");
}

 

JavaScript

 

labelingInfo = [{
  labelPlacement: "above-center",
  labelExpressionInfo: {
    expression: `"\uf024 " + $feature.NAME`
  },
  symbol: {
    type: "label-3d",
    symbolLayers: [
      {
        type: "text",
        material: {
          color: "black"
        },
        font: {
          family: "FontAwesome, Avenir Next",
          weight: "bold"
        },
        size: 10
      }
    ]}
}];