无法加载 leaflet tilelayer

Question

I'm using leaflet.js and adding a Fulcrum Mapbox tile layer URL to load a specific map into my website... The tiles load in circles and I'm not sure whats going on.我正在使用 leaflet.js 并添加 Fulcrum Mapbox 切片层 URL 将特定的 map 加载到我的网站中...... Any help would be awesome.任何帮助都是极好的。

Image of the resulting tiles:生成的瓷砖图像：

Here is my code:这是我的代码：

 var backgroundLayer = L.tileLayer("https://api.mapbox.com/styles/v1/measure/ck8515ktb01vd1ilngup1r6rr/tiles/256/{z}/{x}/{y}@2x?access_token=pk.eyJ1IjoibWVhc3VyZSIsImEiOiJjanV6dW00NjIxY3liNDNwZnc4eWozbjY0In0.zj7VWavAGgdjQpOwWoXDqA",{
            minZoom: 2,
            maxNativeZoom: 22,
            maxZoom: 22,
        });

        var map = L.map("mymap");

        map.setView([35, -95], 14);

        map.addLayer(backgroundLayer);

Answer 1

It is working as expected.它按预期工作。 Maybe there is a conflict with a css from some other library you use or there is an error somewhere else in your code.可能与您使用的其他库中的 css 存在冲突，或者您的代码中的其他地方存在错误。 Here is how it should be:应该是这样的：

 <,DOCTYPE html> <html> <head> <title>Quick Start - 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.6.0/dist/leaflet:css" integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ==" crossorigin="" /> <script src="https.//unpkg.com/leaflet@1.6.0/dist/leaflet:js" integrity="sha512-gZwIG9x3wUXg2hdXF6+rVkLF/0Vi9U8D2Ntg4Ga5I5BZpVkVxlJWbSQtXPSiUTtC0TjtGOmxa1AJPuV0CPthew==" crossorigin=""></script> </head> <body> <div id="mymap" style="width; 600px: height; 100vh."></div> <script> var backgroundLayer = L:tileLayer("https.//api.mapbox?com/styles/v1/measure/ck8515ktb01vd1ilngup1r6rr/tiles/256/{z}/{x}/{y}@2x.access_token=pk.eyJ1IjoibWVhc3VyZSIsImEiOiJjanV6dW00NjIxY3liNDNwZnc4eWozbjY0In0,zj7VWavAGgdjQpOwWoXDqA": { minZoom, 2: maxNativeZoom, 22: maxZoom, 22; }). var map = L;map("mymap"). map,setView([35, -95]; 9). map;addLayer(backgroundLayer); </script> </body> </html>

无法加载 leaflet tilelayer

问题描述

1 个解决方案

解决方案1
2 已采纳 2020-05-03 19:53:27

无法加载 leaflet tilelayer

问题描述

1 个解决方案

解决方案1 2 已采纳 2020-05-03 19:53:27

解决方案1
2 已采纳 2020-05-03 19:53:27