Эдементы dom карты
<div id="map_canvas" style="width: 100%; height: 100%"></div>
Чтобы карту отобразить на веб-странице, следует зарезервировать для нее место. Обычно это осуществляется путем создания именованного элемента div и получения ссылки на него в модели объекта документа (DOM) браузера.
В приведенном выше примере определен элемент <div> с именем "map_canvas", и с помощью атрибутов стиля установлен его размер. Обратите внимание, что для данного размера установлено значение "100%", и на мобильных устройствах размер будет увеличиваться для соответствия размеру экрана. В зависимости от размеров экрана браузера и отступов может потребоваться корректировка этих значений. Обратите внимание, что карта всегда принимает размер содержащего ее элемента, поэтому всегда требуется явно указывать размер в элементе <div>.
Параметры карты
var mapOptions = { center: new google.maps.LatLng(-34.397, 150.644), zoom: 8, mapTypeId: google.maps.MapTypeId.ROADMAP };
Для инициализации карты в первую очередь создается объект Map options для включения в него переменных инициализации карты. Этот объект не конструируется, а создается как литерал объекта.
var mapOptions = {};
Географические координаты
Поскольку в нашем примере требуется с помощью свойства center поместить карту в конкретную точку, мы создаем объект LatLng для хранения этого местоположения и передаем координаты в порядке {широта, долгота}:
center = new google.maps.LatLng(-34.397, 150.644)
Процесс преобразования адреса в географическую точку называется геокодированием. Данная версия API Google Карт поддерживает геокодирование. Подробнее см. в разделе Геокодирование главы Службы этого руководства.
Уровни масштабирования
Начальное разрешение, используемое при отображении карты, устанавливается в свойстве zoom, причем значение 0 соответствует наименьшему уровню масштабирования. При увеличении этого значения увеличивается разрешение изображения карты.
zoom: 8
Чтобы показать карту Земли на одном изображении, потребуется использовать либо огромную карту, либо маленькую карту с очень низким разрешением. По этой причине изображения карты в Google Картах и API Google Карт подразделяются на фрагменты с разными уровнями масштабирования. При низких уровнях масштабирования небольшой набор фрагментов позволяет представить обширную область, а при высоких уровнях масштабирования фрагменты имеют более высокое разрешение и представляют меньшую область.
Типы карт
На этом этапе также необходимо задать начальный тип карты.
mapTypeId: google.maps.MapTypeId.ROADMAP
Поддерживаются следующие типы карт:
ROADMAP – стандартные двухмерные фрагменты Google Карт.
SATELLITE – фрагменты, представленные сделанными со спутника фотографиями.
HYBRID – фотографические фрагменты с наложенным слоем, содержащим наиболее важные объекты (дороги, названия городов).
TERRAIN – фрагменты топографической карты с рельефом местности, высотами и гидрографическими объектами (горы, реки и т. д.).
В большинстве случаев пользователям достаточно карт этих основных типов.