Ставим маркеры
ф
пачками
редко, кто пожелает ограничи-
ваться. Тогда предлагаю рас-
смотреть следующий пример.
Как и в предыдущих примерах,
уже известный код инициали-
зации опускаю. Во всё том же
теге SCRIPT объявляем ассо-
циативный массив.
На самом деле, тем нашим
читателям,
которые
знакомы
с языком Javascript, должно быть известно, что в
нём отсутствует такое понятие как ассоциативный
массив,
но имеется возможность объявлять объ-
екты с полями.
Как раз такой массив объектов и показан в следу-
ющем примере. Но это не помешает нам использо-
вать этот массив
c
ity
в
качестве ассоциативн
/ / Массив с данными для маркеров
var city = [
{‘х’ : 50.46275, ‘у’ : 30.522079, ‘comment’ : ‘город
Киев’},
{‘х’ : 50.247205, ‘у’ : 28.652344, ‘comment’ : ‘го-
род Житомир’},
О
дин
маркер
- это хоро-
шо.
Но
этим,
думаю,
,
Q
33 Щ З
%»■
.
/
Ш
to*
л
і л
Ji.
V
Подольск.
Рис. 7
, 1
t i
f
f
-
\ \
Соломвнсний;
І'
\ \
ф
С«а«йи'*#Ський
«рийговка
\^ ;
У щ п .
С ой
асмса
4
ч
is
Кйев
І
Я
■а
%
К -
-
*
Бору
€о$ Ьсъ*а
Ы х Ъ
Зне*а
;s
а '
в
»
<?
*
Печерский
т
•5
Jhujws ie
iitiiiwS
Р
^
*
С
ъ
%
идожовщииа
Гатиое
^
far»**
?
\
i
' * j
Своя картинка
для маркера
С
оздавать маркер стан-
дартного вида мы уже
научились. Но как это быва-
ет,
возникает
необходи-
мость
выделить
маркер
на
карте. Для этого следует на-
рисовать
картинку,
жела-
тельно
в
формате
PNG
со
слоем прозрачности. В сле-
дующем коде:
var mylcon = new Glcon();
/ / задаем файл с изобра-
жением значка
mylcon.image = “compmarker.png”;
mylcon.iconSize = new GSize(51,64); / / размер
значка
mylcon.iconAnchor = new GPoint(51, -64); / / сме-
щение значка от точки
mylcon.infoWindowAnchor = new GPoint(45, 5); / /
смещение информационного окна
/ / После этого определяем объект
GMarkerOptions
var markerOptions = { icon:mylcon };
map.addOverlay(new GMarker(new
GLatLng(50.417358,30.475594),
markerOptions));
командой
Glcon
мы создаём экземпляр объ-
екта
mylcon
картинки для маркера. Затем ука-
зываем имя файла картинки.
В коде веб-стра-
ницч путь к файлу лучше указывать полный, на-
пример,
Картинка может иметь любой размер, но ло-
гичнее делать его разумным, например, в пре-
делах 64x64 пикселя. В нашем случае картинка
comp
marker.png
(рис. 6)
имеет размер 51x64
(задаём командой
GSize)
в свойстве
mylcon. iconSize.
Исходя
из
её
размеров
командой
GPoint
в
свойстве
m ylcon.iconAnchor
задаём
смеще-
ние значка маркера в пикселях от точки на кар-
те, соответствующей координатам маркера, чтобы
маркер не перекрывал собой точку, на которую ука-
зывает. В нашем случае человечек-компьютер ука-
зывает рукой на точку.
Для корректного позиционирования информацион-
ного окна задаём смещение (в пикселях) в свойстве
mylcon.infoWindowAnchor.
Для обычного стандарт-
ного маркера это смещение соответствует (5,5).
Далее командой
map.addOverlay
добавляем мар-
кер
на карту.
При
этом
налету создаём
экземпляр
маркера и передаём его в качестве аргумента. То, что
должно получиться, выглядит, как показано на
рис. 7.
Следует
учесть,
что
в
старых
версиях
Internet
Explorer могут возникнуть проблемы с отображени-
ем полупрозрачных PNG. Для этого есть методики
устранения проблемы.
{‘х’ : 49.84861, ‘у’ : 24.01062, ‘comment’ : ‘город
Львов’},
{‘х’ : 49.592909, ‘у’ : 34.557495, ‘comment’ : ‘го-
род Полтава’}
];
/ / Функция создания маркера с указанными па-
раметрами
function createMarker(x, у, comment) {
/ / Создаем точку на карте с координатами х и у
var point = new GLatLng(x, у);
/ / Создаем маркер в указанной точке
var marker = new GMarker(point);
/ / Добавляем обработчик события нажатия на
маркер
GEvent.addl_istener(marker, “click”, function() {
предыдущая страница 44 Компьютер 2011 06 читать онлайн следующая страница 46 Компьютер 2011 06 читать онлайн Домой Выключить/включить текст