自己简单封装了下百度地图(这个网址直接用)
https://static-d9bc5ad6-69a7-454e-a8e4-80069e587f92.bspapp.com/map.html
如果网址炸了请手动:
<!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>
<script
type="text/javascript"
src="https://api.map.baidu.com/api?v=2.0&ak=kx3YUGkPTCwLcX8FMEAcLgxNzf7b8Hug"
></script>
<script
type="text/javascript"
src="https://api.map.baidu.com/library/GeoUtils/1.2/src/GeoUtils_min.js"
></script>
</head>
<body>
<div>注意需要关闭广告拦截插件!拦截插件会把百度地图生成组件屏蔽导致无法生成坐标</div>
<div>
地区名:
<input
id="name"
type="text"
placeholder="地区名:太仓市"
value="太仓市"
/>
随机生成数:
<input
id="num"
type="text"
name="num"
placeholder="随机生成数"
value="500"
/>
</div>
<button onclick="generatePos()">生成</button>
</div>
<div id="allmap" style=" 1000px; height: 500px"></div>
</body>
</html>
<script type="text/javascript">
var map = {}; //初始化全局map
window.onload = function () {
map = new BMap.Map("allmap");
//中心点坐标
map.centerAndZoom(new BMap.Point(113.665336, 34.753203), 5);
map.enableScrollWheelZoom();
};
// 生成坐标点
function generatePos() {
var areaName = document.getElementById("name").value;
var num = document.getElementById("num").value;
var bdary = new BMap.Boundary();
//要显示的行政区域 可以是为 市 县 区
bdary.get(areaName, function (rs) {
//获取行政区域
map.clearOverlays(); //清除地图覆盖物
var count = rs.boundaries.length; //行政区域的点有多少个
if (count === 0) {
alert("未能获取当前输入行政区域");
return;
}
let lat_max = 0;
let lat_min = 360;
let lng_max = 0;
let lng_min = 360 ;
rs.boundaries.forEach(v => {
v.split(";").forEach(vv => {
let n = vv.split(",");
lng_max = n[0] > lng_max?n[0]:lng_max;
lng_min = n[0] < lng_min?n[0]:lng_min;
lat_max = n[1] > lat_max?n[1]:lat_max;
lat_min = n[1] < lat_min?n[1]:lat_min;
});
});
lat_range = lat_max - lat_min;
lng_range = lng_max - lng_min;
console.log(lat_max,lat_min,lat_range)
console.log(lng_max,lng_min,lng_range)
var pointArray = [];
for (var i = 0; i < count; i++) {
var ply = new BMap.Polygon(rs.boundaries[i]); //建立多边形覆盖物
map.addOverlay(ply); //添加覆盖物
pointArray = pointArray.concat(ply.getPath());
map.setViewport(pointArray);
var x = 0;
var y = 0;
var pt = null;
var arr = [];
for (var i = 0; i < num; i++) {
x = (lng_min*100)/100 + (Math.random() * lng_range);
y = (lat_min*100)/100 + (Math.random() * lat_range);
console.log(x,y)
pt = new BMap.Point(x, y);
if (BMapLib.GeoUtils.isPointInPolygon(pt, ply)) {
arr.push({
lat: y,
lng: x,
});
var marker = (marker = new BMap.Marker(new BMap.Point(x, y)));
map.addOverlay(marker);
}
}
console.log(arr);
console.log(JSON.stringify(arr));
}
alert("生成成功!数量:" + arr.length + ",请查看console.log");
});
}
</script>