8. fitBounds(用了这个你就不用在设置zoom, minZoom, maxZoom, center) 

 1 <!DOCTYPE html>
 2 <html lang="zh">
 3     <head>
 4         <meta charset="UTF-8">
 5         <meta name="viewport" content="width=device-width, initial-scale=1.0">
 6         <meta http-equiv="X-UA-Compatible" content="ie=edge">
 7         <link rel="stylesheet" type="text/css" href="leaflet/leaflet.css" />
 8         <title></title>
 9         <style type="text/css">
10             body {
11                 margin: 0;
12             }
13 
14             html,
15             body {
16                 height: 100%;
17             }
18 
19             #mapid {
20                 height: 500px;
21             }
22         </style>
23     </head>
24     <body>
25         <div id="mapid"></div>
26 
27         <script type="text/javascript" src="leaflet/leaflet.js"></script>
28 
29         <script type="text/javascript">
30             const {
31                 dir
32             } = console;
33 
34 
35             const mymap = L.map('mapid');
36 
37             const imageUrl = './leaflet/images/b1-floor1-full-h.png';
38             const imageBounds = [
39                 [50.52728768645296, 30.62301635742188],
40                 [50.472692651662115, 30.376853942871097]
41             ];
42 
43             const imageOverlay = L.imageOverlay(imageUrl, imageBounds).addTo(mymap);
44 
45             // 用了这个你就不用在设置zoom, minZoom, maxZoom, cenger
46             // 将地图的视图设置在给定的矩形地理范围内,地图会自动计算最大缩放级别和中心点。
47             mymap.fitBounds(imageBounds) 
48         </script>
49 
50     </body>
51 </html>

不过不是很智能

posted @ 2022-04-15 16:35  sky-su  阅读(151)  评论(0)    收藏  举报