Утилиты

• Расчет расстояния между двумя географическими точками
• Метод getAdaptiveIcon()
  • Правила создания иконок под мобильные устройства

Расчет расстояния между двумя географическими точками

Возвращает расстояние между двумя заданными точками (в метрах).

Параметры:

Возвращает:

Пример использования:

var kiev = new DG.GeoPoint(30.523333, 50.450001);
var moscow = new DG.GeoPoint(37.617634, 55.755787);

var distance = DG.Utils.getDistance(kiev, moscow);

Метод getAdaptiveIcon()

Метод getAdaptiveIcon() создает иконку типа DG.Icon наиболее подходящую под данный тип экрана. В качестве параметра, функция принимает объект, атрибутами которого являются необходимые данные для создания иконки как для компьютера так и для мобильного устройства.

Первым атрибутом входящего объекта является массив "desktop", который содержит 4 значения: url, width, height, calculateOffset.

Значения массива:

Пример массива "desktop":

desktop: ['desktop-standard.png', 27, 27, function() { return new DG.Point(-14, -14)}]

Вторым атрибутом входящего объекта, является массив "mobile", который предназначен для создания иконки под мобильные устройства. Массив "mobile" подобен массиву "desktop" но имеет следующие правила:

• в url иконки необходимо вставить тег {density}, который будет автоматически заменен на одно из следующих значений: ldpi, mdpi, hdpi, xhdpi (в зависимости от плотности экрана устройства).
• значения width и height должны содержать значения ширины и высоты иконки под mdpi-устройство(эталона). Все последующие размеры иконок будут вычислены опираясь на это значение.

Пример массива "mobile":

mobile: ['{density}-standard.png',34, 34]

Правила создания иконок под мобильные устройства

Экраны мобильных устройств условно разделены на 4 группы: ldpi, mdpi, hdpi, xhdpi. Иконки под разные мобильные экраны, необходимо готовить в следующих пропорциях: 0.75/1/1.5/2.

То есть, если Вы создали иконку 100х100, то ldpi-иконка будет иметь размер 75х75, mdpi-иконка 100х100, hdpi-иконка 150х150, а xhdpi-иконка будет иметь размер 200х200.

Пример:

• ldpi: 24 × 24 для экранов низкой плотности (т.е. × 0,75);
• mdpi: 32 × 32 для экранов средней плотности (наш базовый 1 × 1 );
• hdpi: 48 × 48 для экранов с высокой плотностью (× 1,5);
• xhdpi: 64 × 64 для экранов очень высокой плотности (× 2,0).

Полный пример инициализации функции getAdaptiveIcon()

DG.Utils.getAdaptiveIcon({
           desktop: ['desktop-standard.png',27, 27],
           mobile:  ['{density}-standard.png',34, 34]               
});

Ниже дан пример скрипта создания маркера, использующего функцию getAdaptiveIcon для создания иконки маркера, подстраивающегося под размер экрана устройства пользователя:

// Создаем обработчик загрузки страницы: 
DG.autoload(function() { 
    // Создаем объект карты, связанный с контейнером: 
    var myMap = new DG.Map('myMapId'); 
    // Устанавливаем центр карты, и коэффициент масштабирования: 
    myMap.setCenter(new DG.GeoPoint(82.927810142519,55.028936234826), 15); 
    // Добавляем элемент управления коэффициентом масштабирования: 
    myMap.controls.add(new DG.Controls.Zoom()); 
    // Создадим адаптивную иконку для разных девайсов
    var myAdaptiveIcon = DG.Utils.getAdaptiveIcon({
        desktop: ['images/desktop-standard.png',27, 27],
        mobile:  ['images/{density}-standard.png',34, 34]  
    });

    // Создаем маркер:
    var marker = new DG.Markers.MarkerWithBalloon({
        geoPoint: point,
        icon: myAdaptiveIcon,               
        balloonOptions: {
            hasOwnBalloon: false,
            shouldHideIcon: false,                  
            adjustMapCenterToBalloon: true
        }
    });
    // Добавить маркер на карту:
    myMap.markers.add(marker);

 });