前端leaflet离线地图未显示出来

Question

使用leaflet离线地图， 无法显示出来 未发现报错。

上图是代码， 和下载瓦片的格式。 瓦片存在，经纬度为长沙。

Answer 1

【相关推荐】

• 这个问题的回答你可以参考下: https://ask.csdn.net/questions/7760600
• 你也可以参考下这篇文章：Leaflet地图使用自定义控件
• 除此之外, 这篇博客: leaflet跨地图打点--学习记录中的 leaflet跨地图打点–学习记录 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:
  

  遇到相同问题的可以拿来参考。
  做项目遇到问题，需要多个地图打点。如果这样添加一个点会默认添加到中间地图。

  <script>
      /**
       * 智图地图内容
       */
      var normalmRight2 = L.tileLayer.chinaProvider('Geoq.Normal.PurplishBlue', {
          maxZoom: 18,
          minZoom: 1
      });
      var map = L.map("map", {
          center: [15.59, 220.29],
          zoom: 2,
          layers: [normalmRight2],
          zoomControl: false
      });
      var greenIcon = L.icon({
          iconUrl:'images/114dns.png',
          iconSize: [20, 20],    //  图标的大小    【值1，值2】 为具体你自定义图标的尺寸，比如我图标尺寸是32×52，表示该图标：宽度32像素，高度：52像素，那么值1:就是32，值2：就是52
          //shadowSize:   [35, 35], //  影子的大小    【值1，值2】 为具体你自定义阴影图标的尺寸，比如我图标尺寸是41×41，表示该图标：宽度41像素，高度：41像素，那么值1:就是41，值2：就是41
          iconAnchor: [10, 20],  //  图标将对应标记点的位置 这个是重点， 【值1，值2】，值1：为图标坐标第一个值(即32)的一半，值2：为图标坐标第二个值(即52)
          //shadowAnchor: [4, 62],  // 相同的影子
          popupAnchor: [3, -5] // 该点是相对于iconAnchor弹出信息的位置  这个是我手动调出来的，文档默认原始值是[-1，-76]，我是去一半值，取一半值调出来的
      })
      //增加一个marker ，地图上的标记，并绑定了一个popup，默认关闭(openPopup)
      L.marker([41, 123],{icon:greenIcon}).addTo(map).bindPopup("<b>Hello world!</b><br />I am a popup.").closePopup();
  
  </script>
  

  
  想要把点打到其它地图上，那么只需要改变该点的经度右侧地图+360度，左侧地图-360度，以此类推即可达到想要的效果；
  举例：

  //增加一个marker ，地图上的标记，并绑定了一个popup，默认关闭(openPopup)
      L.marker([41, 123],{icon:greenIcon}).addTo(map).bindPopup("<b>Hello world!</b><br />I am a popup.").closePopup();
      L.marker([41, 123+360],{icon:greenIcon}).addTo(map).bindPopup("<b>Hello world!</b><br />I am a popup.").closePopup();
  

  这样点就可以打到其他地图上了。
  
  连线也是一样的道理，改变点的经度即可。

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^