Search code examples
cssfontspropertiesbing-mapsbing

Bing Maps - How do I change font family on map labels?


Per these guidelines:
https://learn.microsoft.com/en-us/bingmaps/styling/map-style-sheet-entry-properties#mapelement-properties

I am trying to set the map style. All properties are working except "fontFamily" I'm using this google font temporarily, but I have also tried 'serif', 'Times', and 'Times New Roman' and none of them show any difference.

    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Rye&display=swap" rel="stylesheet">
var sampleStyle = {
    "elements": {
        "mapElement": {
            "labelVisible": true,
            "fontFamily": 'Rye',
            //"fontFamily": 'serif',
            //"fontFamily": 'Times',
            //"fontFamily": 'Times New Roman',
            "labelColor": "#007bff",
        },
    },
    "settings": {
        "landColor": "#F6F4E3"
    },
    "version": "1.0"
};

Solution

  • The fontFamily style option I believe is only supported by the Bing Maps UWP map control (Windows). Most of the Bing Maps styling was designed for the UWP control and only a subset of those styles were exposed in the Web SDK and static map image service. Unfortunately it doesn't look like they have clearly called out which styles are supported where in their documentation.