0

私は最近 Leaflet ライブラリを使用しています。作業と学習が非常に簡単であることがわかりました。チュートリアルは GeoJSON とコントロール レイヤーで非常に優れていますが、GeoJASON ファイルでのコントロール レイヤーの使用に関するチュートリアルは 1 つも見つかりません。次のスクリプトを作成します。

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
  <link rel="stylesheet" type="text/css" href="leaflet.css"/>
  <script src="leaflet-src.js"></script>


<script src="GeoJason/mpios.geojson"type="text/javascript"></script>
<script src="GeoJason/roads.geojson"type="text/javascript"></script>
<script src="GeoJason/city.geojson"type="text/javascript"></script>
<script src="GeoJason/towns.geojson"type="text/javascript"></script> 


<style>
        html, body, #map {
            height: 100%;
        }
</style>
</head>
<body>
<div id="map"></div>
<script type="text/javascript">

  var map = L.map('map').setView([20.990584, -98.65644], 12);

    L.geoJson(mpios).addTo(map);
    L.geoJson(roads).addTo(map);
    L.geoJson(city).addTo(map);
    L.geoJson(towns).addTo(map);


var baseLayers = {
    "roads": roads,
        "mpios": mpios
};


var overlays = {
       "city": city,
        "towns": towns
};

L.control.layers(baseLayers, overlays).addTo(map);
    </script>

</body>
</html>

しかし、それはレイヤーを表示し、コントロールボタンは機能しません.thx.

4

1 に答える 1

2

baseLayers と overlays で設定しているレイヤー値は geoJSON フィーチャ セットですが、マップ上に存在するリーフレット レイヤーまたはレイヤーへの参照である必要があります。

L.geoJson からの戻り値を次のような変数に設定することで、各 geoJSON レイヤーのレイヤー参照を保存できます。

var mpios_l = L.geoJson(mpios).addTo(map);
var roads_l = L.geoJson(roads).addTo(map);
var city_l = L.geoJson(city).addTo(map);
var towns_l = L.geoJson(towns).addTo(map);

次に、これらの項目をコントロールに追加します。

var baseLayers = {
    "roads": roads_l,
        "mpios": mpios_l
};


var overlays = {
       "city": city_l,
        "towns": towns_l
};

L.control.layers(baseLayers, overlays).addTo(map);
于 2013-10-23T15:12:27.757 に答える