如何使用传单将世界地图居中

Question

我正在尝试使用传单显示完整地图。 Code Pen

我正在尝试通过传单实现以下目标：

我以为用mymap.fitWorld()就可以达到效果，结果不是

Answer 1

您可以像这样将 minZoom 和 maxZoom 级别设置为 1：

var map = L.map('map', {
    minZoom: 1,
    maxZoom: 1,
 });

然后定义setView如下：

map.setView([0, 0], 0);

<!DOCTYPE html>
<html>
<head>
 
 <title>Zoom Levels Tutorial - Leaflet</title>

 <meta charset="utf-8" />
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
 <link rel="shortcut icon" type="image/x-icon" href="docs/images/favicon.ico" />

    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.4.0/dist/leaflet.css" integrity="sha512-puBpdR0798OZvTTbP4A8Ix/l+A4dHDD0DGqYW6RQ+9jxkRFclaxxQb/SJAWZfWAkuyeQUytO7+7N4QKrDh+drA==" crossorigin=""/>
    <script src="https://unpkg.com/leaflet@1.4.0/dist/leaflet.js" integrity="sha512-QVftwZFqvtRNi0ZyCtsznlKSWOStnDORoefr1enyq5mVL4tmKB3S/EnC3rRJcxCPavG10IcrVGSmPh6Qw5lwrg==" crossorigin=""></script>


 <style>
  html, body {
   height: 100%;
   margin: 0;
  }
  #map {
   width: 600px;
   height: 400px;
  }
 </style>

 
</head>
<body>

<div id='map'></div>

<script>

 var map = L.map('map', {
  minZoom: 1,
  maxZoom: 1,
 });

 var cartodbAttribution = '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, &copy; <a href="http://cartodb.com/attributions">CartoDB</a>';

 var positron = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', ).addTo(map);


 map.setView([0, 0], 0);
</script>



</body>
</html>

如何使用传单将世界地图居中

How to center world map using leaflet

javascript

maps

openstreetmap

leaflet