Персонализированный маркер с персонализированным значком и HTML на Leaflet - PullRequest
0 голосов
/ 09 сентября 2018

Мне нужно создать персонализированный маркер с пользовательским значком и внутренними строками HTML. Слияние DivIcon, Icon и функции маркера.

пример

Изображение не может быть вставлено CSS, поскольку мне придется вызывать его динамически.

Мой результат

var myIcon = L.divIcon({
	className: 'my-div-icon',
	iconSize: [60, 15],
    iconAnchor: [60, 15],
	html: "<?php echo "<a href='http://www.......' target='_blank'>{$arraydatareadILAZIOCI9[2]} °C</a>"; ?>"});
    L.marker([41.591, 12.831], {
	icon: myIcon,
	}).addTo(temperature);

Спасибо в

1 Ответ

0 голосов
/ 15 сентября 2018

Я не понимаю, зачем вам изображение, просто используйте css вот так:

.my-div-icon {
    background-color: #fd8424;
    border-radius: 3px;
    border: 2px solid #ca6a1b;
}

Даже если вы хотите иметь разные цветные маркеры в зависимости от содержимого, вы просто делаете что-то вроде:

.my-div-icon {
    background-color: #fd8424;
    border-radius: 3px;
    border: 2px solid #ca6a1b;
}

.my-div-icon.blue{
    background-color: blue;
}

затем при динамическом создании маркеров добавьте цвет как класс:

var myIcon = L.divIcon({
    className: 'my-div-icon <?php echo $array[$i]['colour'];?>',
    iconSize: [60, 15],
    ...
...