Маркер как изображение

Я пытаюсь создать карту мира, используя JVectorMap, но я бы поставил маркер как изображение (marker.png), а не круг по умолчанию. Я могу это сделать?

4 ответа

Официальный пример маркеров на основе изображений - http://jvectormap.com/examples/marker-icons/

Если вам нужен маркер изображения, используйте новый слой (div над слоем svg на карте), установите новый div для каждого маркера и установите положение.

Получить ссылку на карту

map = $("#world-map-gdp").vectorMap('get', 'mapObject');

и используйте функцию map.latLngToPoint(), чтобы найти точку в новом слое.

var newMarkerP = map.latLngToPoint(lat,lng);
$('#marker1').css('top',newMarkerP.x);
$('#marker1').css('left',newMarkerP.y); 

Вы можете переместить маркеры, если выполните масштабирование или перетаскивание, используйте ту же функцию и примените css влево и css top.

Может быть, вы можете играть с верхней и левой от новых маркеров, но это простое решение.

Пока нет, эта функция запланирована для одного из следующих выпусков.

В настройках стиля маркера вы можете использовать "изображение" вместо "r":

        var myMarkerStyle = {
          initial: {
            image: 'files/fkd/marker.png'
          }
        };
Другие вопросы по тегам