动态将所有点放在最佳视野内-百度地图

功能描述
经纬度坐标是一个一个从后台取出,加载在地图上,确保所有点都在屏幕之内

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>动态将所有点放在最佳视野方位内</title>
        <meta http-equiv="pragma" content="no-cache" />
        <meta http-equiv="cache-control" content="no-cache" />
        <meta http-equiv="expires" content="0" />
        <script type="text/javascript" src="jquery-1.7.1.min.js" ></script>
        <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4"></script>
    </head>
    <body style="padding: 0; background: #f7f7f7;">
        动态将所有点放在最佳视野方位内(每隔3秒新增一个点)
        <!--百度地图容器-->
        <div style="width:500px;height:560px;" id="allmap"></div>
        </div>
        <script type="text/javascript">
            var map = new BMap.Map("allmap");    // 创建Map实例
            map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);
            map.enableScrollWheelZoom();   //启用滚轮放大缩小,默认禁用
            map.enableContinuousZoom();    //启用地图惯性拖拽,默认禁用
            var pointsView = [];    //存放点的数组
            window.setInterval(createPt, 3 * 1000); //设置动态加点,3秒一次
            function createPt() {
                var pt = new BMap.Point(Math.random()*40 + 85, Math.random() * 30 + 21);
                pointsView.push(pt);
                var marker = new BMap.Marker(pt);
                map.addOverlay(marker);
                map.setViewport(pointsView); //将所有的点放置在最佳视野内
            }
        </script>
    </body>
</html>

查看视频效果
所有点都在视野范围内

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

尤成军军军

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值