Skip to content

Reset the previous icon's styles when a marker reuses its element - #10538

Merged
mourner merged 3 commits into
Leaflet:mainfrom
b84330808:fix-seticon-stale-styles
Nov 7, 2026
Merged

mourner merged 3 commits into
Leaflet:mainfrom
b84330808:fix-seticon-stale-styles

Conversation

@b84330808

Copy link
Copy Markdown
Contributor

setIcon reuses the marker's element, but the icon only writes what it defines. Whatever the new icon leaves out stays from the old one:

  • width, height, margins and transform origin, including on the shadow
  • backgroundPosition from a DivIcon bgPos
  • crossOrigin, so an image from a host without CORS headers can fail to load

For example, setIcon(new DivIcon({iconSize: 'auto'})) on a default DivIcon stays 12×12, because the inline size wins over CSS. With [100, 'auto'] the height stays too, because autopx is an invalid value and gets ignored.

_setIconStyles now clears these before setting them, so a reused element looks like a fresh one. DivIcon and Icon do the same for backgroundPosition and crossOrigin.

Marker#setIcon hands the current element to the new icon, but
_setIconStyles, DivIcon#createIcon and Icon#_createIcon only write what the
new icon defines. Whatever it leaves out stays on the element from the old
icon: width, height, margins, transform origin, background position and
crossOrigin. An icon sized by CSS keeps the old inline size, and an image
that doesn't allow CORS fails to load under the old crossOrigin.

@Falke-Design Falke-Design left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Makes sense to me

Comment thread src/layer/marker/Icon.js Resolved
Comment thread spec/suites/layer/marker/MarkerSpec.js Resolved
@mourner
mourner merged commit 96ed26a into Leaflet:main Nov 7, 2026
10 checks passed
simon04 pushed a commit to maplair/maplair that referenced this pull request Nov 8, 2026
The size, anchor, background position and crossOrigin of the previous icon
stayed on the reused element if the new icon didn't set them.

Leaflet: Leaflet/Leaflet#10538
Leaflet commit: Leaflet/Leaflet@96ed26a
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants