问题
Hey im new to electron but i want to use Leaflet inside it to some magic mapping stuff.
I created an basic electron application with the index.js according to the basic example. I added also an basic index.hetml:
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<div id="map"></div>
</body>
<script>
require('./renderer')
</script>
</html>
And the Leaflet stuff inside the renderer.js
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: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
When I'm running the app the window is opening and also some MapTiles are displayed. But they they are not all loaded and they get messed up when im reseizing the window:
and
What's wrong with my code?
回答1:
I ran into the same problem. I think the best solution is to
bower install leaflet
and than use this in the head of your .html file:
<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>
来源:https://stackoverflow.com/questions/50586793/leaflet-flipping-tiles-in-electron