2015-02-19 2 views
0

Я работаю в сети, которая показывает информацию о маршрутах в Природном парке. Когда пользователь нажимает на дорожку, он должен обновить div «#info» с информацией о треке (внешний html на geojson). Я не могу получить детали работы!Обновить содержимое конкретного div с каким-либо другим контентом

Вот это Javascript код:

var map = L.mapbox.map('map', 'pokomoko.l6e2j9h1'); 

var geojson = [{ 
    "type": "FeatureCollection", 
     "crs": { 
     "type": "name", 
     "properties": { 
      "name": "urn:ogc:def:crs:OGC:1.3:CRS84" 
     } 
    }, 
    "features": [{ 
     "type": "Feature", 
     "properties": { 
      "Name": "Camí circular", 
      "Descriptio": null, 
      'id': 2, 
      "stroke": "blue", 
      "stroke-opacity": 1, 
      "stroke-width": 6, 
      "URL": 'Circular/circular_cat.html' 
     }, 
     "geometry": { 
      "type": "LineString", 
      "coordinates": [ 
       [1.768113361018627, 41.609716521663515], 
       [1.768283835249583, 41.609747082164205], 
       [1.768422882004483, 41.609779001160376], 
       [1.7685547698433, 41.609805665922217], 
       [1.768687708285772, 41.609832049115262], 
       [1.768817761141674, 41.609857849364609], 
       [1.768905770134774, 41.609893436891795], 
       // .... 
      ] 
     }]; 

    // Create a feature layer that will hold the GeoJSON above. 
    var features = L.mapbox.featureLayer().addTo(map); 

    features.setGeoJSON(geojson); 

    features.on('mouseover', function (e) { 
     focusline(e.layer.feature.properties.id); 
    }); 

    features.on('click', function() { 
         $("#info").load(getURL(features)).hide().fadeIn('slow'); 
        }); 

    function focusline(focus) { 
     // Iterate through each feature in the 
     // features object and alter the properties. 
     features.eachLayer(function (l) { 
      var props = l.feature.properties; 
      props['stroke-opacity'] = (props.id !== focus) ? 0.25 : 1; 
     }); 

     // Rerun the geojson 
     features.setGeoJSON(geojson); 
    } 
+0

Что такое 'getPage()'? Эта функция не входит в ваш код –

+0

Является ли событие щелчка даже срабатывающим? И 'getPage (features)' возвращает строку, которая содержит допустимый URL? И как уже сказал Джереми: где определяется 'getPage()'? – Jens

+0

Да, я не очень хорошо разбираюсь в javascript, и это не мой код, который я проверил на другом примере в Интернете, если кто-то может помочь мне запустить щелчок, я бы очень признателен! спасибо, что я уже изменил страницу для действительного URL-адреса, но это тоже не сработало. – pokomoko

ответ

0

Вот один из способов сделать это.

    var features = L.mapbox.featureLayer().addTo(map); 

        features.setGeoJSON(geojson); 

        features.on('click', function(e) { 
        loadIframe(e.layer.feature.properties.data);  
        }); 

        features.on('mouseover', function(e) { 
        focusline(e.layer.feature.properties.id); 
        }); 

        function loadIframe (url) { 
        $("#info").load(url).hide().fadeIn('slow'); 
        // Rerun the geojson 
        features.setGeoJSON(geojson); 
        }; 

        function focusline(focus) { 
        // Iterate through each feature in the 
        // features object and alter the properties. 
        features.eachLayer(function(l) { 
        var props = l.feature.properties; 
        props['stroke-opacity'] = (props.id !== focus) ? 0.5 : 1;}); 
          } 
Смежные вопросы