{"action":"opened","issue":{"url":"https://api.github.com/repos/Leaflet/Leaflet/issues/5080","repository_url":"https://api.github.com/repos/Leaflet/Leaflet","labels_url":"https://api.github.com/repos/Leaflet/Leaflet/issues/5080/labels{/name}","comments_url":"https://api.github.com/repos/Leaflet/Leaflet/issues/5080/comments","events_url":"https://api.github.com/repos/Leaflet/Leaflet/issues/5080/events","html_url":"https://github.com/Leaflet/Leaflet/issues/5080","id":188096726,"number":5080,"title":"Overlapping GeoJSON Layer features have unexpected mouse event behavior","user":{"login":"jbccollins","id":8915552,"avatar_url":"https://avatars.githubusercontent.com/u/8915552?v=3","gravatar_id":"","url":"https://api.github.com/users/jbccollins","html_url":"https://github.com/jbccollins","followers_url":"https://api.github.com/users/jbccollins/followers","following_url":"https://api.github.com/users/jbccollins/following{/other_user}","gists_url":"https://api.github.com/users/jbccollins/gists{/gist_id}","starred_url":"https://api.github.com/users/jbccollins/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/jbccollins/subscriptions","organizations_url":"https://api.github.com/users/jbccollins/orgs","repos_url":"https://api.github.com/users/jbccollins/repos","events_url":"https://api.github.com/users/jbccollins/events{/privacy}","received_events_url":"https://api.github.com/users/jbccollins/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2016-11-08T20:35:18Z","updated_at":"2016-11-08T20:35:18Z","closed_at":null,"body":"I believe there is a bug with the way mouse events are handled when there are multiple overlapping features rendered using a canvas renderer.\r\n\r\n## How to reproduce\r\n\r\n- Leaflet version: 1.0.0-beta.2\r\n- Browser: Chrome 54.0.2840.71\r\n- OS: Windows 10\r\n\r\n## What behaviour I'm expecting and which behaviour I'm seeing\r\n\r\nI expect that when there are multiple features that have overlapping pixels (not necessarily overlapping geometries) the mouse events for the feature that is rendered on top should take precedence over mouse events for features beneath it. This event precedence issue only occurs when using the canvas renderer. I see my expected behavior when using the default renderer. See the attached .gif for an example use case.\r\n\r\n## Minimal example reproducing the issue\r\n- Note that I am using rollup/es6\r\n\r\n```javascript\r\n    const colors = [\"#ff0000\", \"#00ff00\"];\r\n    const geoJsonLayer = Leaflet.geoJson(roads.features, {\r\n      style: (feature) => {\r\n        return {\r\n          // Alternate red/green\r\n          color: colors[feature.id % 2],\r\n          weight: 7\r\n        };\r\n      },\r\n      onEachFeature: (feature, layer) => {\r\n        layer.on(\"mouseover\", () => {\r\n          layer.setStyle({color: 'blue'});\r\n        });\r\n        layer.on(\"mouseout\", (e) => {\r\n          geoJsonLayer.resetStyle(e.target);\r\n        });\r\n      }\r\n    }).addTo(map);\r\n```\r\n![mouseover_precendence](https://cloud.githubusercontent.com/assets/8915552/20116001/860c5a80-a5c8-11e6-9a54-e1b4b5f4f569.gif)\r\n\r\n"}}
{"actor":{"display_login":"jbccollins"}}