Question

嘿，我对电子很新，但我想把它里面的Leaflet用于一些神奇的映射。

我根据基本示例使用index.js创建了一个基本的电子应用程序。我还添加了一个基本的index.hetml：

<!DOCTYPE html>
<html>

<head>

    <title>Page Title</title>

</head>

<body>
    <div id="map"></div>
</body>

<script>
    require('./renderer')
</script>

</html>

并且在renderer.js中的Leaflet内容

window.L = require('leaflet')

var map = L.map('map').setView([51.0420175, 13.7358889], 12)

    L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
        attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
    }).addTo(map);

当我运行应用程序时，窗口正在打开，并且还会显示一些MapTiles。但他们并没有全部加载，当我重新调整窗口时它们会搞砸：

和

我的代码出了什么问题？

Answer 1

我遇到了同样的问题。我认为最好的解决方案是

bower install leaflet

，然后在.html文件的头部使用

<link rel="stylesheet" href="bower_components/leaflet/dist/leaflet.css" />
<style>
  body { margin:0; padding:0;  }
  #map { position: absolute; top:0; bottom:0; right:0; left:0;  }
</style>

单张在电子中翻转瓷砖

1 个答案: