Jump to content
  • 0

Google Maps. Сложные маркеры


100kd
 Share

Question

Использую Google Maps JavaScript Version 3 и JQuery.

Как лучше всего сделать свой маркер?

Чтобы можно было так:

97859798.png37228672.png

Чтобы картинка и подложка были раздельными элементами:

90574070.png

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

<div class="my_marker" style="background-image: url(/i/label.png); ...other...">
<img src="/f/prew_id123.jpg">
<srong>Place name</strong>
</div>

Спросил и тут - http://stackoverflow.com/questions/3189315...-omplex-markers

Edited by 100kd
Link to comment
Share on other sites

10 answers to this question

Recommended Posts

  • 0

Что вам мешает перерисовать подложку? если я помню там в коде есть на нее ссылка вы можете поставить свою ) Или давайте разметку и код будем думать (Не думаете же вы что щас найдутся люди которые полезут на гугл мэп искать код вставки скрипт и разбирать все это...)

Edited by stars
Link to comment
Share on other sites

  • 0
Что вам мешает перерисовать подложку? если я помню там в коде есть на нее ссылка вы можете поставить свою ) Или давайте разметку и код будем думать (Не думаете же вы что щас найдутся люди которые полезут на гугл мэп искать код вставки скрипт и разбирать все это...)

Насколько я знаю, в стандартном маркере может содержаться только одна иконка, а в моем случае, в маркере должно содержаться несколько элементов.

Мне интересно узнать варианты действий — преобразовывать стандартные маркеры, писать что-то свое или ____.

Edited by 100kd
Link to comment
Share on other sites

  • 0

Ну так есть там везде один маркер подключается значит и картинка которую ты хочешь туда прикрепить везде будет одна? ) По-моему проще посмотреть как ставится этот маркер и попробовать поменять код так чтобы можно было везде ставить разные маркеры... В противном случаи уже думать как добавлять лишние элементы поверх маркеров...

Edited by stars
Link to comment
Share on other sites

  • 0
Думать как добавлять лишние элементы поверх маркеров

Да, как вариант.

Есть мысли о том как реализовать: использовать каждый элемент как отдельный маркер. Но мне эта идея не нравится.

Edited by 100kd
Link to comment
Share on other sites

  • 0

Хотелось бы, конечно, чтобы можно было маркер с какими-нибудь элементами в таком виде добавлять:

<div class="my_marker" style="background-image: url(i/label.png); ...other...">
<img src="/f/prew_id123.jpg">
<srong>Place name</strong>
</div>

Блин. Видимо придется с помощью JQuery находить код маркера на карте и добавлять в него чего душе угодно.

Я то планировал, как-нибудь, с помощью api самой карты сделать.

Edited by 100kd
Link to comment
Share on other sites

  • 0

А разве нельзя на одной точке карты расположить два маркера и у каждого задать иконку, иконка первого маркера будет подложкой, а иконка второго - фоткой. Почитал API - вроде там можно z-index регулировать...

Link to comment
Share on other sites

  • 0
ну выложите хотя-бы код этой вашей карты...

Если кратко:

...

// Функция в обработки и добавления маркеров.
xml_места.each(function() {
places.id = xml_места.id
places.name = xml_места.Имя
places.img = xml_места.Изображение
places.lat = xml_места.lat
places.lng = xml_места.lng
add_marker(places);
}

// Добавление маркера.
function add_marker(item, type) {
myLatlng = new google.maps.LatLng(item.lat,item.lng);
markers.places[item.id] = new google.maps.Marker({
position: myLatlng,
map: map,
title: item.name,
icon : '/img/map_place_point.png'
});
}

...

А разве нельзя на одной точке карты расположить два маркера и у каждого задать иконку, иконка первого маркера будет подложкой, а иконка второго - фоткой. Почитал API - вроде там можно z-index регулировать...

Как вариант рассматриваю, но на крайний случай.

Edited by 100kd
Link to comment
Share on other sites

  • 0

Ну а если так

function add_marker(item, type) {
myLatlng = new google.maps.LatLng(item.lat,item.lng);
markers.places[item.id] = new google.maps.Marker({
position: myLatlng,
map: map,
title: item.name,
switch (item.id) {
case '5': icon : '/img/map_place_point5.png'; break;
case '4': icon : '/img/map_place_point4.png'; break;
case '3': icon : '/img/map_place_point3.png'; break;
case '2': icon : '/img/map_place_point2.png'; break;
case '1': icon : '/img/map_place_point1.png'; break;
default: icon : '/img/map_place_point0.png';
}

});
}

Link to comment
Share on other sites

  • 0
Ну а если так

Спасибо, но проблема не в этом.

Вопрос был в том, как поместить в стандартный маркер свои элементы.

Вообще, задача специфическая и малопопулярная.

Чуть позже напишу как решил.

Edited by 100kd
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy