Leaflet.label icon indicating copy to clipboard operation
Leaflet.label copied to clipboard

Offsets seem broken and markers shrink with PhantomJS

Open lgo opened this issue 9 years ago • 2 comments

Using PhantomJS screen capture to PDF, page.render, things seem to go bad. I'll look into the problem and try to make a sample page where this is reproducible when running PhantomJS on it.

Most notably all of the marker labels are lined up in display: block; fashion in the upper-right and the markers seem to get the same width attribute as the label from inspection.

The bit of code which uses Leaflet.Label is

    marker.bindLabel(e.label, {
      direction: 'left',
      noHide: true,
      offset: [(e.label || "").length * -4 /* right */, -40 /* down */]
    });
    marker.showLabel();

although varying and removing options seem to not affect the issue.

leafletlabelbug

PhantomJS 1.9.8 Leaflet.Label 0.2.2-dev

lgo avatar Mar 03 '15 16:03 lgo

It seems the markers shrinking in width is caused specifically by having CSS media type print and is unrelated to PhantomJS, while the labels going to the corner is specific to PhantomJS.

The labels showing in the topleft seem to be caused by the transform: translate3d not working as intended from within PhantomJS.

lgo avatar Mar 03 '15 16:03 lgo

Can you post a snippet of all the relevant css for these markers?

MattSidor avatar Mar 03 '15 18:03 MattSidor