search

mapbox / mapbox-gl-js

Interactive, thoroughly customizable maps in the browser, powered by vector tiles and WebGL
https://docs.mapbox.com/mapbox-gl-js/
Other
11.24k stars 2.23k forks source link

Click is offseted on chrome on mobile #13269

Closed Linkens closed 2 months ago

Linkens commented 2 months ago

My map has numerous circles drawn, the click triggers about 1cm below the visual. I have no problem if I toggle the on desktop version on the same device. I tried @3.6.0 and @2.15.0 and I have the same behaviour. I hav no problem on my desktop, even if I toggle the "mobile mode" in my chrome dev tools.

      <div data-tap-disabled="true" id="map" style="position:relative; height:100%; width:100%; border-radius: 6px; box-shadow: 0 0 10px rgb(0 0 0 / 40%); background: #ddd;">
       </div>

I tried to isolate my map in a separate div but no dice.

I'm hosting the web site with asp.net core on linux, with a nginx web server.

stepankuzmin commented 2 months ago

Hi @Linkens,

Could you please isolate the issue into a minimal reproducible example (i.e. only Mapbox map)? We recommend using https://jsbin.com/.

Linkens commented 2 months ago

I fixed the issue by removing the scaling on my html.

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1" />
</head>