网站建设项目预算海南自贸港跨境电商怎么做

一、mapbox中提供了比例尺控件，在创建地图后可使用此方式显示比例尺控件

map.addControl(new mapboxgl.ScaleControl(), 'bottom-left')

可通过修改css改变自带比例尺样式

二、计算得出当前scale， 具体代码可在mapbox源码中查看，此处仅以单位Meters为例

let maxWidth = 100; // mapbox源码中默认值为100
let y = map._containerHeight / 2;
let x = map._containerWidth / 2 - maxWidth / 2;
let left = map.unproject([x, y]);
let right = map.unproject([x + maxWidth, y]);
let scale = Math.floor(left.distanceTo(right));

源码位置于： src/ui/control/scale_control.js