Карты Bing - невозможно установить собственный стиль карты - PullRequest
0 голосов
/ 27 мая 2019

Я пытаюсь использовать собственный стиль на своей карте, но что бы я ни делал, я не могу, чтобы они работали.Моя функция инициализации:

this.init = (mapSelector, api, title = '', poi = false, prefix = '', cache = true) => {
      return new Promise((r, j) => {
        if (api.slice(-1) !== '/')
          this.setPrefix(prefix);

        this.setCache(cache);
        this.setPOI(poi);
        this.setTitle(title);

        try {
          getMapKey().then(key => {
            if(mapSelector) {
              _map = new Microsoft.Maps.Map(mapSelector, {
                credentials: key,
                center: new Microsoft.Maps.Location(_latitude, _longitude),
                zoom: 13,
                disableBirdseye: true,
                disableStreetside: true,
                showDashboard: false,
                customMapStyle: JSON.parse(sampleStyle),
              });
            } else {
              j('error');
            }
          });
        } catch (error) {
          console.log(error);
        }
      });
    };

В настоящее время она прекрасно отображает стандартную карту.но независимо от того, что я передаю в customMapStyle, ничего не работает, JSON.parse был добавлен, чтобы убедиться, что данные были в формате JSON, потому что у меня заканчиваются идеи. Я скопировал JSON из примеров:

https://bingmapsv8samples.azurewebsites.net/#Set%20Custom%20Map%20Style

Вот некоторые из стилей, которые я пытался использовать:

const darkMode = {
  "version": "1.0",
  "settings": {
    "landColor": "#0B334D"
  },
  "elements": {
    "mapElement": {
      "labelColor": "#FFFFFF",
      "labelOutlineColor": "#000000"
    },
    "political": {
      "borderStrokeColor": "#144B53",
      "borderOutlineColor": "#00000000"
    },
    "point": {
      "iconColor": "#0C4152",
      "fillColor": "#000000",
      "strokeColor": "#0C4152"
    },
    "transportation": {
      "strokeColor": "#000000",
      "fillColor": "#000000"
    },
    "highway": {
      "strokeColor": "#158399",
      "fillColor": "#000000"
    },
    "controlledAccessHighway": {
      "strokeColor": "#158399",
      "fillColor": "#000000"
    },
    "arterialRoad": {
      "strokeColor": "#157399",
      "fillColor": "#000000"
    },
    "majorRoad": {
      "strokeColor": "#157399",
      "fillColor": "#000000"
    },
    "railway": {
      "strokeColor": "#146474",
      "fillColor": "#000000"
    },
    "structure": {
      "fillColor": "#115166"
    },
    "water": {
      "fillColor": "#021019"
    },
    "area": {
      "fillColor": "#115166"
    }
  }
};

const sampleStyle = {
  "elements": {
    "park": { "fillColor": "#A9A9D4BE" },
    "controlledAccessHighway": { "fillColor": "#e6c317", "strokeColor": "#D3B300", "labelColor": "#444444", "labelOutlineColor": "#60ffffff" },
    "highway": { "fillColor": "#e6c317", "strokeColor": "#D3B300", "labelColor": "#444444", "labelOutlineColor": "#60ffffff" },
    "water": { "fillColor": "#B7CDDE" },
    "medicalBuilding": { "fillColor": "#fceced" },
    "majorRoad": { "fillColor": "#f0d85a" },
    "education": { "fillColor": "#f0e8f8" },
    "arterialRoad": { "fillColor": "#ffed91" },
    "structure": { "fillColor": "#faf8ed" },
    "buildinglobal": { "fillColor": "#e5e0d8" },
    "forest": { "fillColor": "#deebdd" },
    "vegetation": { "fillColor": "#deebdd" },
    "reserve": { "fillColor": "#deebdd" },
    "street": { "fillColor": "#ffffff", "strokeColor": "#e6e3df" },
    "roadShield": { "fillColor": "#ffffff" },
    "medical": { "fillColor": "#ffddee" },
    "educationBuildinglobal": { "fillColor": "#f6f0f1" },
    "golfCourse": { "fillColor": "#c5dabb" }
  },
  "settings": { "landColor": "#F6F4E3" }
};

Кто-нибудь знает, как активировать пользовательский стиль?Если это невозможно, могу ли я активировать темный режим, что я и пытаюсь сделать.

Спасибо

Ответы [ 2 ]

0 голосов
/ 04 июня 2019

Мне нужно было установить setOption, это не имело ничего общего со стилем карты, который я пытался применить.

0 голосов
/ 31 мая 2019

Я бы посоветовал взглянуть на приложение-редактор таблиц стилей карты - оно позволит вам интерактивно настроить стиль и покажет пример кода для инициализации этого стиля во всех элементах управления картами Bing (HTML, UWP и статические карты).).https://www.microsoft.com/en-us/p/map-style-sheet-editor/9nbhtcjt72ft

...