BIGEMPA Js API示例中心
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='UTF-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<title>鼠标测距</title>
<link href='http://www.bigemap.com:9000/bigemap.js/v2.1.0/bigemap.css' rel='stylesheet' />
<script src='http://www.bigemap.com:9000/bigemap.js/v2.1.0/bigemap.js'></script>
<link rel="stylesheet" href="/Public/offline/measure/bm.measure.css"/>
<script src="/Public/offline/measure/bm.measure.js"></script>
<style>
* {
margin: 0;
padding: 0;
}
#map {
position: absolute;
top: 0;
bottom: 0;
width: 100%;
}
.disMarker {
pointer-events: none !important
}
</style>
</head>
<body>
<div id='map'></div>
<script>
BM.Config.HTTP_URL = 'http://www.bigemap.com:9000';
var map = BM.map('map', 'bigemap.zhongkexingtu', {
center: [30.4, 104.5],
zoom: 7,
zoomControl: true,
attributionControl: false
});
var marker = BM.marker(map.getCenter(),).addTo(map);
//添加对应的比例尺插件
BM.control.scale({
maxWidth: 240,
metric: true,
imperial: false,
position: 'bottomleft'
}).addTo(map);
var plugin = BM.control.measure({
// 显示位置
position: 'topleft',
// 是否启用键盘控制
keyboard: true,
// 启用键
activeKeyCode: 'M'.charCodeAt(0),
// 取消键，默认esc
cancelKeyCode: 27,
// 线颜色
lineColor: 'red',
// 线宽
lineWeight: 2,
// 虚线配置
lineDashArray: '6, 6',
// 透明度
lineOpacity: 1,
// 格式化距离
// formatDistance: function (val) {
// return Math.round(1000 * val / 1609.344) / 1000 + 'mile';
// }
container: map,//容器,如需不添加按钮以函数形式调用必须要给这个配置项,给了这个配置项需要调用清除地图才能执行addTo
once: true,
}).clearMap().addTo(map);
plugin._startMeasuring()
map.on('start_measure', function () {
console.log('start');
})
map.on('stop_measure', function (e) {
console.log('stop', e._layer);
})
map.on('finish_measure', function (e) {
console.log('finish', e._layer);
})
</script>
</body>
</html>