Оформление карты

В этом документе описано, как настроить внешний вид карты, а также управлять видимостью данных и параметрами области просмотра. Это можно сделать следующими способами:

• Используйте облачное оформление карт.
• Задавайте параметры стиля карты непосредственно в собственном коде.

Оформите карту с помощью облачных инструментов для оформления карт.

Чтобы применить стиль карты к вашей JavaScript-карте для совместного использования поездок, укажите mapId и любые другие mapOptions при создании объекта JourneySharingMapView .

Следующие примеры показывают, как применить стиль карты с помощью идентификатора карты.

const mapView = new google.maps.journeySharing.JourneySharingMapView({
  element: document.getElementById('map_canvas'),
  locationProviders: [locationProvider],
  mapOptions: {
    mapId: 'YOUR_MAP_ID'
  }
  // Any other styling options.
});

const mapView = new google.maps.journeySharing.JourneySharingMapView({
  element: document.getElementById('map_canvas'),
  locationProviders: [locationProvider],
  mapOptions: {
    mapId: 'YOUR_MAP_ID'
  }
  // Any other styling options.
});

Сопоставление стилей непосредственно в вашем собственном коде

Вы также можете настроить стиль карты, задав параметры карты при создании JourneySharingMapView . В следующих примерах показано, как настроить стиль карты с помощью параметров карты. Для получения дополнительной информации о том, какие параметры карты можно установить, см. mapOptions в справочнике по JavaScript API Google Maps.

const mapView = new google.maps.journeySharing.JourneySharingMapView({
  element: document.getElementById('map_canvas'),
  locationProviders: [locationProvider],
  mapOptions: {
    styles: [
      {
        "featureType": "road.arterial",
        "elementType": "geometry",
        "stylers": [
          { "color": "#CCFFFF" }
        ]
      }
    ]
  }
});

const mapView = new google.maps.journeySharing.JourneySharingMapView({
  element: document.getElementById('map_canvas'),
  locationProviders: [locationProvider],
  mapOptions: {
    styles: [
      {
        "featureType": "road.arterial",
        "elementType": "geometry",
        "stylers": [
          { "color": "#CCFFFF" }
        ]
      }
    ]
  }
});

Управляйте видимостью данных задачи для SDK.

Вы можете управлять видимостью определенных объектов задач на карте с помощью правил видимости.

Видимость данных задачи по умолчанию

По умолчанию данные о задачах, назначенных транспортному средству, отображаются, когда транспортное средство находится в пределах 5 остановок от места выполнения задачи . Отображение данных прекращается после завершения или отмены задачи.

В этой таблице показана видимость по умолчанию для каждого типа задач. Вы можете настроить видимость для многих задач, но не для всех. Более подробную информацию о типах задач см. в разделе «Типы задач» в руководстве по запланированным задачам .

Настройте отображение открытых задач, связанных с транспортными средствами.

Интерфейс TaskTrackingInfo предоставляет ряд элементов данных о задачах, которые можно отобразить с помощью Consumer SDK.

Параметры видимости для каждой задачи

Вы можете настроить параметры видимости для каждой задачи отдельно, задав параметр TaskTrackingViewConfig при создании или обновлении задачи в Fleet Engine. Используйте следующие параметры видимости для создания критериев определения видимости элемента задачи:

Для иллюстрации предположим, что в примере настройки видимость трех элементов данных регулируется с использованием критериев, показанных в следующей таблице. Все остальные элементы подчиняются правилам видимости по умолчанию.

Следующий пример демонстрирует данную конфигурацию:

"taskTrackingViewConfig": {
  "routePolylinePointsVisibility": {
    "remainingStopCountThreshold": 3
  },
  "estimatedArrivalTimeVisibility": {
    "remainingDrivingDistanceMetersThreshold": 5000
  },
  "remainingStopCountVisibility": {
    "never": true
  }
}

Полилинии маршрута и правила видимости местоположения транспортного средства

Полилинии маршрута не могут быть видны, если не видно местоположение транспортного средства; в противном случае местоположение транспортного средства можно определить по концу полилинии.

Эти рекомендации помогут вам подобрать допустимое сочетание параметров видимости полилинии маршрута и местоположения транспортного средства.

    "taskTrackingViewConfig": {
      "routePolylinePointsVisibility": {
        "remainingStopCountThreshold": 3
      },
      "vehicleLocationVisibility": {
        "remainingStopCountThreshold": 5
      },
    }
    

  "taskTrackingViewConfig": {
    "routePolylinePointsVisibility": {
      "remainingStopCountThreshold": 3
    },
    "vehicleLocationVisibility": {
      "remainingDrivingDistanceMetersThreshold": 3000
    },
  }

Отключить автоматическую установку

Вы можете отключить автоматическую подгонку карты под транспортное средство и предполагаемый маршрут, чтобы предотвратить её автоматическую подгонку. В следующем примере показано, как отключить автоматическую подгонку при настройке режима просмотра карты для совместного использования маршрута.

const mapView = new
    google.maps.journeySharing.JourneySharingMapView({
  element: document.getElementById('map_canvas'),
  locationProviders: [locationProvider],
  automaticViewportMode:
      google.maps.journeySharing
          .AutomaticViewportMode.NONE,
  ...
});

const mapView = new
    google.maps.journeySharing.JourneySharingMapView({
  element: document.getElementById('map_canvas'),
  locationProviders: [locationProvider],
  automaticViewportMode:
      google.maps.journeySharing
          .AutomaticViewportMode.NONE,
  ...
});

Что дальше?

• Настройка маркеров
• Настройка полилиний