I 'am trying to disable all movement of the map, except rotation and zoom to a set point. But on a touch device I can still move the 'camera' from the set point with two fingers, it works fine on a non touch device.

This is what I currently have, and that is not fully working I can still move the camera center point with two fingers on a touch device. I 'am using typescript with ionic/angular.

this.map = new mapboxgl.Map({
      container: 'game_map',
      style: 'mapbox://styles/mapbox/light-v10',
      center: [coords],
      zoom: 20,
      touchZoomRotate: {around: 'center'},
      scrollZoom: {around: 'center'},
      pitch: 60,
      bearing: -60,
      antialias: true,
      attributionControl: false,
      maxZoom: 22,
      minZoom: 17
    });

I 'am trying to disable all movement of the map, except rotation and zoom to a set point. But on a touch device I can still move the 'camera' from the set point with two fingers, it works fine on a non touch device.

This is what I currently have, and that is not fully working I can still move the camera center point with two fingers on a touch device. I 'am using typescript with ionic/angular.

this.map = new mapboxgl.Map({
      container: 'game_map',
      style: 'mapbox://styles/mapbox/light-v10',
      center: [coords],
      zoom: 20,
      touchZoomRotate: {around: 'center'},
      scrollZoom: {around: 'center'},
      pitch: 60,
      bearing: -60,
      antialias: true,
      attributionControl: false,
      maxZoom: 22,
      minZoom: 17
    });

• javascript
• typescript
• mapbox
• mapbox-gl-js

1 Answer 1

You can disable user panning by adding:

 dragPan: false,

to that initialisation statement. More info.