Question

我已经创建了一个HTML文件，在本教程之后使用传单显示地图。

http://build-failed.blogspot.co.uk/2012/11/zoomable-image-with-leaflet.html

我的HTML代码如下......

<!DOCTYPE html>
<html>
  <head>
    <title>eso1119a</title>
    <meta charset="utf-8"/>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.6.4/leaflet.css" />
    <!--[if lte IE 8]>
    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.6.4/leaflet.ie.css" />
    <![endif]-->
    <script src="http://cdn.leafletjs.com/leaflet-0.6.4/leaflet.js"></script>
    <script>
      function init() {
        var mapMinZoom = 0;
        var mapMaxZoom = 3;
        var map = L.map('map', {
          maxZoom: mapMaxZoom,
          minZoom: mapMinZoom,
          crs: L.CRS.Simple
        }).setView([0, 0], mapMaxZoom);

        var mapBounds = new L.LatLngBounds(
            map.unproject([0, 1280], mapMaxZoom),
            map.unproject([1280, 0], mapMaxZoom));

        map.fitBounds(mapBounds);
        L.tileLayer('{z}/{x}/{y}.png', {
          minZoom: mapMinZoom, maxZoom: mapMaxZoom,
          bounds: mapBounds,
          attribution: 'Rendered with <a href="http://www.maptiler.com/">MapTiler</a>',
          noWrap: true          
        }).addTo(map);
      }
    </script>
    <style>
      html, body, #map { width:100%; height:100%; margin:0; padding:0; }
    </style>
  </head>
  <body onload="init()">
    <div id="map"></div>
  </body>
</html>

如何以与用户相同的方式将地图嵌入我的博客（tumblr）？ http://blog.thematicmapping.org/2013/06/showing-zoomify-images-with-leaflet.html

Answer 1

您需要将包含MapTiler生成的可缩放图像的文件夹上传到网站主办。

有关如何使其可用的教程 - 使用Dropbox或其他服务可以免费托管： http://www.maptiler.com/how-to/hosting/

（由于Tumblr不再支持静态文件托管，因此需要为地图提供不同的网络托管服务提供商。）。

执行此操作后，只需在Tumblr中创建一个新帖子，更改帖子＆＃34;文本编辑器＆＃34;并选择＆＃34; HTML＆＃34;并包含如下代码：

<iframe src="http://yourserver.com/path-to-your-folder/leaflet.html"
style="width: 100%; height: 450px;"></iframe>

请参阅此Thumblr示例帖子：

http://klokancz.tumblr.com/post/129075897775/maptiler-embedding-test

如何将HTML地图嵌入到博客中

1 个答案: