2013-08-29 3 views
11

У меня есть базовая программа geoJson в javascript с помощью API-интерфейса.javascript карта в листовке Как обновить

<html> 
<head> 

<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.6.4/leaflet.css" /> 
<script src="http://cdn.leafletjs.com/leaflet-0.6.4/leaflet.js"></script> 
<script src="india.js" type="text/javascript"></script> 

</head> 


<body> 
<div id = "map1" style="width: 1100px; height: 400px"> </div> 

<script> 

var area = L.map('map1', {center: [27.8800,78.0800], zoom: 4 }); 

L.tileLayer('http://a.tiles.mapbox.com/v3/raj333.map-gugr5h08/{z}/{x}/{y}.png').addTo(area); 

var indiaLayer= L.geoJson(india, {style: {weight: 2, 
     opacity: 1, 
     color: 'white', 
     dashArray: '3', 
     fillOpacity: 0.1}}); 

     area.addLayer(indiaLayer); 

     function clicked(){ 

     this.options.style.fillOpacity = 0.8; 
      //how to refresh layer in the given map 

     } 

     indiaLayer.on('click', clicked);     
</script> 
</body> 
</html> 

проблема заключается в том, как автоматически обновлять содержимое слоя на карте.

пример здесь

   function clicked(){ 

     indiaLayer.style.fillOpacity = 0.8; 
      //how to refresh layer in the given map 

     } 

     indiaLayer.on('click', clicked); 

, когда пользователь нажимает на indiaLayer, переменные изменения fillOpacity но не отражает обратно на карте, которая понимается, поскольку я не обновляя карту. Я не знаю, как это сделать.

пожалуйста, помогите

P/s: эти функции, доступные на объекте indiaLayer (т.е. этот объект внутри щелкнули функции ... который один использовать для этой цели, или не существует ни)

Вы можете проверьте список доступных методов GEOJson в Leaflef documentation. Это ссылка на v.0.7.7, которая является наиболее доступной для использования в этом примере.

ответ

17

Последний раз я использовал

map._onResize(); 

и которые помогают мне освежить карту. Может быть, немного взломать, но это работает.

В коде будет area._onResize()

PS: Может быть, вы должны попытаться изменить способ, чтобы установить новое значение непрозрачности - попробуйте изменить

function clicked(){ 
    this.options.style.fillOpacity = 0.8; 
} 

к этому

function clicked(){ 
    this.setStyle({fillOpacity: 0.2}); 
} 
+1

не work..nothing происходит на карту из этого кода :( – user609306

+0

только изменил мой ответ я надеюсь, что это помогает – Elephant

+0

Эй @elephant ..yes this.setStyle ({fillOpacity: 0,2}) работает .... Spacibo – user609306

15
map.invalidateSize(); 

map._onResize() - это взлом, и нет гарантии, что он не будет удален в будущих версиях. .

+3

Фактически invalidateSize не будет работать, если размер карты не изменился.Из документов: «Проверяет, изменился ли размер контейнера карты и обновил карту, если это так» – a1an

+0

Моя проблема была в этом sitaution: Моя карта была изначально скрыта, и когда я ее отображал, она не была инициализирована (не все плитки были загружен). После того, как я добавил этот метод, эта проблема была исправлена. Поэтому я думаю, что он все равно обновляет. –

0

area.fitBounds(area.getBounds());

+0

Op спросил: «Проблема в том, как я автоматически обновляю содержимое слоя на карте. пример здесь – justDev7a3

+3

@ImportanceOfBeingErnest Пожалуйста, прочитайте вопрос и ответ перед просмотром. –