地图地区生成随机点

自己简单封装了下百度地图(这个网址直接用)

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>



原文地址:https://www.cnblogs.com/zjhblogs/p/15080228.html