小册子地图灰色屏幕为geoJSON层

时间:2017-08-23 14:44:22

标签: leaflet

想知道是否有人可以提供帮助,这有点奇怪。我的传单地图独立工作,但当添加到某些现有代码时,geoJSON(world-map.geojson)似乎没有添加到图层,我只是得到一个带有传单地图控件的灰色屏幕。但是,当leaflet.css被注释掉时你可以看到已经添加了geoJSON层...我没有错误,如果我注释掉对其他JS文件的引用它没有任何区别。

由于这似乎是各种各样的冲突,我预计不会有一个硬性和快速的答案,但如果有人之前遇到过这个或者可以提出任何指示,那将非常感激。

HTML

<link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.3/dist/leaflet.css">
<script type="text/javascript" src="leaflet.js"></script>
<script type="text/javascript" src="world-map.geojson"></script>

<style type="text/css">
    #map {
        height: 600px;
        width: 100%;
    }
</style>

<div id="map"></div>
<script src="map.js"></script>

JS - 右后卫

var geojson,
    layer,
    map = L.map('map').setView([43.8476, 18.3564],3);

// style each continent
function countriesStyle(feature) {
    return {
        fillColor: "#FED976",
        weight: 1,
        opacity: 1,
        color: "white",
        dashArray: 1,
        fillOpacity: 0.7
    };
}

// add layer
geojson = L.geoJson(countries, {
    style: countriesStyle,
    maxZoom: 2,
    minZoom: 2
}).addTo(map);

// works. countries var is in the DOM
for(var i = 0; i < countries.features.length; i++) {
    console.log(countries.features[i].properties.name)
}

0 个答案:

没有答案