Как стилизовать карту

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

  • Как использовать облачные стили карт
  • Настройка стиля карты непосредственно в коде

Как настроить стиль карты с помощью облачных стилей карт

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

В примерах ниже показано, как применить стиль карты с помощью идентификатора карты.

JavaScript

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

TypeScript

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 документации по Google Maps JavaScript API.

JavaScript

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

TypeScript

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

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

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

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

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

Тип задачи Настройки приватности по умолчанию Можно ли настраивать? Описание
Задачи, связанные с недоступностью Не отображается Нет Используется для перерывов водителей и заправки. Если маршрут к задаче доставки также содержит другую остановку транспортного средства, эта остановка не показывается, если она содержит только задачи недоступности. Расчетное время прибытия и расчетное время выполнения задачи по-прежнему показываются для самой задачи доставки.
Открыть задачи для транспортных средств Показывать Да Она перестанет быть видна, когда задача будет выполнена или отменена. Вы можете настроить видимость открытых задач, связанных с транспортными средствами. Подробнее о том, как настроить видимость открытых задач для транспортных средств…
Задачи по закрытым транспортным средствам Не отображается Нет Вы не можете настраивать видимость выполненных задач для транспортных средств.

Как настроить видимость открытых задач для транспортных средств

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

Настраиваемые элементы данных задач

Ломаные линии маршрутов

Расчетное время прибытия

Расчетное время выполнения задачи

Оставшееся расстояние до задачи

Оставшееся количество остановок

Местоположение транспортного средства

Настройки доступа для каждой задачи

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

Настройки доступа

Оставшееся количество остановок

Время до расчетного времени прибытия

Оставшееся расстояние

Показывать всегда

Никогда не показывать

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

Элемент данных для корректировки Доступ Критерий
Ломаная линия маршрута Показать Транспортное средство находится в пределах трех остановок.
Прибытие Показать Оставшееся расстояние меньше 5000 метров.
Оставшееся количество остановок Никогда не показывать Транспортное средство находится в пределах трех остановок.

Пример такой конфигурации:

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

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

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

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

Те же настройки доступа Критерий видимости Инструкции
Для ломаных линий маршрута задан параметр "Всегда показывать". Установите для местоположения автомобиля значение "Всегда видно".
Местоположение автомобиля никогда не показывается. Скрыть ломаные линии маршрута.
Варианты настроек доступа:
  • осталось остановок
  • время до расчетного времени прибытия
  • оставшееся расстояние

Задайте для параметров ломаной линии маршрута значение, которое меньше или равно значению, заданному для местоположения транспортного средства. Пример:

    "taskTrackingViewConfig": {
      "routePolylinePointsVisibility": {
        "remainingStopCountThreshold": 3
      },
      "vehicleLocationVisibility": {
        "remainingStopCountThreshold": 5
      },
    }
Разные варианты доступа Критерии видимости Инструкции
Местоположение автомобиля видно

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

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

В этом примере местоположение транспортного средства видно, только если до пункта назначения осталось не менее трех остановок И не менее 3000 метров.

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

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

JavaScript

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

TypeScript

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

Дальнейшие действия