Options.style (customMapStyle) not applied.

[Diego251]

Hello, trying to apply a custom style as seen in this example (https://msdn.microsoft.com/en-us/library/mt823636.aspx) using the options object of the leaflet bing layer as follows:

var map = L.map('map').setView([51.505, -0.09], 13)

var myMapStyle = {
    "elements": {
        "water": { "fillColor": "#a1e0ff" },
        "waterPoint": { "iconColor": "#a1e0ff" },
        "transportation": { "strokeColor": "#aa6de0" },
        "road": { "fillColor": "#b892db" },
        "railway": { "strokeColor": "#a495b2" },
        "structure": { "fillColor": "#ffffff" },
        "runway": { "fillColor": "#ff7fed" },
        "area": { "fillColor": "#f39ebd" },
        "political": { "borderStrokeColor": "#fe6850", "borderOutlineColor": "#55ffff" },
        "point": { "iconColor": "#ffffff", "fillColor": "#FF6FA0", "strokeColor": "#DB4680" },
        "transit": { "fillColor": "#AA6DE0" }
    },
    "version": "1.0" 
};

var options = {
    bingMapsKey: BingKey,
    imagerySet: 'RoadOnDemand',
    culture: 'en',
    style: myMapStyle
};

L.tileLayer.bing(options).addTo(map);

However styles do not seem to be applied, the standard Bing style is displayed. Am I missing something? Thanks!

[Diego251]

Fix is to complete the metaDataUrl by properly formatting the style and adding it to the URL. This hardcoded example works:

// leaflet-bing-layer.js, line 105:
metaDataUrl = metaDataUrl + "&st=wt|fc:FF0000;lbc:00FF00_rd|fc:0000FF_g|landColor:FFFFFF";

According to Microsoft it can be passed as a POST request if URL is too long.