Question

我正在创建一个基本的地图应用程序。当我加载图块时，地图以块显示，而不是完整地图。

图片就是它的样子。

https://i.stack.imgur.com/ABgGw.jpg

怎么了？

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
    <script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
    <script src='https://api.tiles.mapbox.com/mapbox.js/v1.6.4/mapbox.js'></script>
    <style type="text/css">
    #map {
        width: 600px;
        height: 400px;
    }
    </style>
</head>
<body>
    <div id="map"></div>

    <script type="text/javascript">
    var mapboxTiles = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
        attribution: '<a href="http://www.mapbox.com/about/maps/" target="_blank">Terms &amp; Feedback</a>'
    });

    var map = L.map('map')
        .addLayer(mapboxTiles)
        .setView([35.65188895052401,-97.43681781720626], 10);
        var marker = L.marker([35.65188895052401,-97.43681781720626]).addTo(map);
    </script>
</body>
</html>

Answer 1

典型的 CSS 问题，可能是由于 Leaflet 和 mapbox.js 的混合使用

如果您想使用 mapbox.js，您可能还需要来自 mapbox 的特定 CSS 文件。而且您可能不需要 Leaflet JS 和 CSS 文件。

OSM 中缺少磁贴

1 个答案: