mapx sdk zoom min max

by fxi

HTML

<script src="https://app.mapx.org/sdk/mxsdk.umd.js"></script>
<div id="mapx" class="mapx"></div>

CSS

html,
body {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
}

.mapx {
  height: 100%;
  width: 100%;
}

.json {
  color: #0f0;
  position: absolute;
  top: 60px;
  left: 20px;
  pointer-events: none;
}

JavaScript

const elMapx = document.getElementById('mapx');

const m = new mxsdk.Manager({
  container: elMapx,
  url: "https://app.mapx.org",
  static: true,
  verbose: true,
  params: {
    language: 'en',
    closePanels: true,
    zoomToViews: false,
    p: 34.24,
    b: 85.698,
    z: 10.591,
    lat: 20.978,
    lng: 16.568,
    t3d: false,
    sat: true,
    theme: "water_light",
  }
});

m.on('ready', async () => {
  await m.ask('map', {
    method: 'setMinZoom',
    parameters: [10]
  });
  await m.ask('map', {
    method: 'setMaxZoom',
    parameters: [12]
  });
});