ВебмастерМетрикаВиджетыРекламная сетьДиректПоиск для сайтаAPI
Войти

JavaScript API 2.x

YMapsML 1.x

Карта и её параметры

С помощью YMapsML можно задавать тип и область показа карты. Для этого предназначен элемент repr:View.

API Яндекс.Карт поддерживает показ трех встроенных типов карт:

  • MAP — тип карты «Схема». Схематичное отображение объектов местности. Используется по умолчанию.
  • SATELLITE — тип карты «Спутник». Спутниковая карта местности.
  • HYBRID — тип карты «Гибрид». Спутниковая карта местности с нанесёнными на неё названиями географических объектов.

Элемент repr:mapType может содержать один из приведённых в списке идентификаторов типа карты.

Область показа карты представляет собой прямоугольную область, которая определяется заданием координат нижней и верхней вершин. Для указания области показа карты используется элемент gml:boundedBy.

Рассмотрим следующий пример. Разместим на HTML-странице карты всех поддерживаемых сервисом типов — «схема», «спутник» и «гибрид» и зададим для каждой из них область показа.

maptypes.html (http://api.yandex.ru/maps/ymapsml/examples/maptypes.html)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Примеры YMapsML. Параметры карты</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script src="http://api-maps.yandex.ru/1.1/index.xml?key=<API-ключ>" type="text/javascript"></script>
    <script language="JavaScript" type="text/javascript">
var map;

function init () {
var mapMap = new YMaps.Map(document.getElementById("YMapsMapTypeId"));
var mlMap = new YMaps.YMapsML("http://api.yandex.ru/maps/ymapsml/examples/xml/maptype.xml");
mapMap.addOverlay(mlMap);
mapMap.setCenter(new YMaps.GeoPoint(-1,-1));

var mapSatellite = new YMaps.Map(document.getElementById("YMapsSatelliteTypeId"));
var mlSatellite = new YMaps.YMapsML("http://api.yandex.ru/maps/ymapsml/examples/xml/satellitetype.xml");
mapSatellite.addOverlay(mlSatellite);
mapSatellite.setCenter(new YMaps.GeoPoint(-1,-1));

var mapHybrid = new YMaps.Map(document.getElementById("YMapsHybridTypeId"));
var mlHybrid = new YMaps.YMapsML("http://api.yandex.ru/maps/ymapsml/examples/xml/hybridtype.xml");
mapHybrid.addOverlay(mlHybrid);
mapHybrid.setCenter(new YMaps.GeoPoint(-1,-1));
};
</script>
</head>

<body onload="init();">
    <div id="YMapsMapTypeId" style="width:640px; height:400px;"></div>
    <div id="YMapsSatelliteTypeId" style="width:315px; height:200px; float: left; margin: 10px 10px 0 0"></div>
    <div id="YMapsHybridTypeId" style="width:315px; height:200px; float: left; margin: 10px 0 0 0"></div>
</body>


</html>

maptype.xml (http://api.yandex.ru/maps/ymapsml/examples/xml/maptype.xml)

<?xml version="1.0" encoding="UTF-8"?>
<ymaps:ymaps xmlns:ymaps="http://maps.yandex.ru/ymaps-1.x" xmlns:gml="http://www.opengis.net/gml">
    <repr:Representation xmlns:repr="http://maps.yandex.ru/representation-1.x">
        <repr:View>
            <repr:mapType>MAP</repr:mapType>
            <gml:boundedBy>
                <gml:Envelope>
                    <gml:upperCorner>45 60</gml:upperCorner>
                    <gml:lowerCorner>30 50</gml:lowerCorner>
                </gml:Envelope>
            </gml:boundedBy>
        </repr:View>
    </repr:Representation>
</ymaps:ymaps>

satellitetype.xml (http://api.yandex.ru/maps/ymapsml/examples/xml/satellitetype.xml)

<?xml version="1.0" encoding="UTF-8"?>
<ymaps:ymaps xmlns:ymaps="http://maps.yandex.ru/ymaps-1.x" xmlns:gml="http://www.opengis.net/gml">
    <repr:Representation xmlns:repr="http://maps.yandex.ru/representation-1.x">
        <repr:View>
            <repr:mapType>SATELLITE</repr:mapType>
            <gml:boundedBy>
                <gml:Envelope>
                    <gml:upperCorner>37.8 55.85</gml:upperCorner>
                    <gml:lowerCorner>37.4 55.65</gml:lowerCorner>
                </gml:Envelope>
            </gml:boundedBy>
        </repr:View>
    </repr:Representation>
</ymaps:ymaps>

hybridtype.xml (http://api.yandex.ru/maps/ymapsml/examples/xml/hybridtype.xml)

<?xml version="1.0" encoding="UTF-8"?>
<ymaps:ymaps xmlns:ymaps="http://maps.yandex.ru/ymaps-1.x" xmlns:gml="http://www.opengis.net/gml">
    <repr:Representation xmlns:repr="http://maps.yandex.ru/representation-1.x">
        <repr:View>
            <repr:mapType>HYBRID</repr:mapType>
            <gml:boundedBy>
                <gml:Envelope>
                    <gml:upperCorner>37.8 55.85</gml:upperCorner>
                    <gml:lowerCorner>37.4 55.65</gml:lowerCorner>
                </gml:Envelope>
            </gml:boundedBy>
        </repr:View>
    </repr:Representation>
</ymaps:ymaps>

При просмотре файла maptypes.html в браузере карты будут выглядеть следующим образом.