分享一下我老师大神的人工智能教程。零基础!通俗易懂!风趣幽默!还带黄段子!希望你也加入到我们人工智能的队伍中来!https://blog.csdn.net/jiangjunshow
1、问题背景
地图根据不同等级可以放大缩小,并且中心点坐标不变
2、实现源码
<!DOCTYPE html><html> <head> <title>放大地图</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=ak密钥"></script> <style> body,html,#map{ width: 100%; height: 100%; overflow: hidden; margin: 0; font-size: 12px; font-family: "微软雅黑"; } </style> </head> <body> <div id="map"></div> </body></html><script> //创建地图实例 var map = new BMap.Map("map"); //初始化地图 map.centerAndZoom(new BMap.Point(114.309531, 30.59619),5); //放大到19级 setTimeout(function(){ map.setZoom(19); }, 4000); //启用滚轮放大缩小 map.enableScrollWheelZoom(true);</script>
3、实现结果
(1)初始化时
(2)过了4s之后
4、附录
(1)缩小
<!DOCTYPE html><html> <head> <title>放大地图</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=ak密钥"></script> <style> body,html,#map{ width: 100%; height: 100%; overflow: hidden; margin: 0; font-size: 12px; font-family: "微软雅黑"; } </style> </head> <body> <div id="map"></div> </body></html><script> //创建地图实例 var map = new BMap.Map("map"); //初始化地图 map.centerAndZoom(new BMap.Point(114.309531, 30.59619),19); //放大到16级 setTimeout(function(){ map.setZoom(5); }, 4000); //启用滚轮放大缩小 map.enableScrollWheelZoom(true);</script>
(2)初始化时
(3)过了4s之后
分享一下我老师大神的人工智能教程。零基础!通俗易懂!风趣幽默!还带黄段子!希望你也加入到我们人工智能的队伍中来!https://blog.csdn.net/jiangjunshow