CODEWITHSUNDEEP
javascriptleaflet
user3025915
user3025915

Reputation: 1

Getting leaflet custom marker to front with zIndexOffset

I'm trying to get marker #3 to the front so it isn't covered by marker #19 and #20.

http://infovisual.dk/xmas/

According to the documentation this must be done with zIndexOffset but I have tried a lot of different ways and nothing seems to work: The marker #3 stays partly hidden.

Can anyone give me a hint of what to do?

function start_up_biglayers(latitude, longitude, Day) {

var DayMarker = L.Icon.extend({
    options: {
    shadowUrl: './map_files/shadow-marker.png',
    iconSize:     [44, 70], // size of the icon
    shadowSize:   [80, 70], // size of the shadow
    iconAnchor:   [21, 67], // point of the icon which will correspond to marker's location
    shadowAnchor: [24, 68],  // the same for the shadow
    popupAnchor:  [-3, -76] // point from which the popup should open relative to the iconAnchor
        }
    });

var dec_1 = new DayMarker({iconUrl: './map_files/marker_1.png'}),
    dec_2 = new DayMarker({iconUrl: './map_files/marker_2.png'}),
    dec_3 = new DayMarker({iconUrl: './map_files/marker_3.png', ZIndexOffset: 100}),
    dec_24 = new DayMarker({iconUrl: './map_files/marker_24.png'}),
    dayMarker = new DayMarker({iconUrl: './map_files/marker_' + xmas[number].Day + '.png'})

    layer = new L.marker([latitude,longitude], {icon: dayMarker});

Upvotes: 0

Views: 2378

Answers (1)

Dr.Molle
Dr.Molle

Reputation: 117354

  1. javascript is case-sensitive, the property must start with a lowercase z
  2. you must set zIndexOffset for the L.Marker, not for the L.Icon

Upvotes: 2

Related Questions