谷歌地图 v3 FontAwesome5

Question

我正在尝试创建一个使用动态 fontAwesome 标记的 googleMap

不过，我似乎无法将“Font Awesome 5 Free”设置为要使用的字体。

我可以设置有效的“Fontawsome”，但它不是网络字体（它是我系统中安装的 .TTF）

      var marker0 = createMarker({
        position: new google.maps.LatLng(33.808678, -117.918921),
        map: map,
        icon: {
          path: google.maps.SymbolPath.CIRCLE,
          fillColor: '#F00',
          fillOpacity: 1,
          strokeWeight: 0,
          scale: 15
        },
        label: {
          fontFamily: "FontAwesome",
          fontWeight: '900',
          text: eval("'\\u"+'f0ab'+"'"),
          color: 'white'
        }
        }, "<h1>Marker 0</h1><p>This is the home marker.</p>");
    });

这是 jsfiddle：https ://jsfiddle.net/robsilva/hxt5jcu5/

看起来谷歌地图没有将 font-family 属性应用于我创建的标记标签。根据谷歌的文档，语法看起来是正确的，但由于某种原因，所有的风格都没有被应用。以下是我们手动将字体系列样式放置在正确元素上的一些前后屏幕...

Answer 1

Just enclose the font family in either double or single quotes.

fontFamily: "'Font Awesome 5 Free'" // or '"Font Awesome 5 Fee"'

As already cited by rsilva, this seems to be a bug in the API. Simulated in v3.31:

1. It can't handle the spaces which invalidates the font-family attribute.
2. 它也如不把该值作为字符串 这里

解决方法