2016-03-30 7 views
0

Ich habe ein Problem mit Leaflet Control Search, ich teste auf C9.io, benutze Laravel 5.2, ich versuche eine L.geojson-Ebene zu suchen, aber alles kommt mit ist „Ort nicht gefunden“ und die Konsole gibt Fehler: „Can not Eigenschaft‚nennen‘undefinierte lesen“Leaflet Search Control - Eigenschaft 'call' von undefined nicht lesen

ich habe eine globalen Variablen, die die Karte, L.geojson Schichten und Fliesen halten.

var map, allcalls, mapquest; 

mapquest = new L.TileLayer("http://{s}.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.png", { 
    maxZoom: 18, 
    subdomains: ["otile1", "otile2", "otile3", "otile4"], 
    }); 
map = new L.Map('map', { 
    center: new L.LatLng(39.90973623453719, -93.69140625), 
    zoom: 3, 
    layers: [mapquest] 
    }); 
var promise = $.getJSON("leaflet_php/get_users.php"); 
promise.then(function(data) { 

    allcalls = L.geoJson(data, { 
     onEachFeature: function (feature, layer) { 
    layer.bindPopup(feature.properties.fn + '<br>' +feature.properties.gender + '<br>' + feature.properties.addr + '<br>'+ feature.properties.city); 
} 
    }); 
    map.fitBounds(allcalls.getBounds(), { 
     padding: [20, 20] 
    }); 

    allcalls.addTo(map); 
}); 

Dann beginne ich die L.control.search, und es zeigt auf der Karte, aber wenn ich ich keine Ergebnisse gif der Lader zu bekommen suchen hört nie auf, und ich Konsole Fehler „Kann Eigenschaft‚nennen‘undefinierter nicht lesen "

var controlSearch = new L.Control.Search({ 
    layer: allcalls, 
    position:'topleft', 
     propertyName: 'city', 
}); 
    map.addControl(controlSearch); 

ich erzeuge die json https://github.com/bmcbride/PHP-Database-GeoJSON verwenden. Mein Json hat mindestens 1000 Funktionen, jede Funktion hat 30 Eigenschaften. Das ist also eine abgekürzte Version. Dies ist ein Beispiel für den JSON, den ich bekomme:

{"type":"FeatureCollection","features":[{"type":"Feature","geometry": {"type":"Point","coordinates":[-80.191626,26.339826]},"properties":{"id":1,"fn":"SAMUEL","mi":null,"ln":"STANTON","name_pre":"MR","addr":"9 HONEYSUCKLE DR","apt":null,"city":"AMELIA","st":"OH","zip":45102,"z4":9722,"dpc":99,"fips_cty":25,"latitude":26.339826,"longitude":-80.191626,}}, 

Jede Hilfe wird sehr geschätzt. Danke im Voraus.

+0

Instanziieren Sie Ihre 'L.Control.Search' innerhalb Ihres Promise Callbacks? – ghybs

+0

Nein Es ist nicht, aber ihre Beispiele initiieren nicht innerhalb des Rückrufs. – jsrosas

Antwort

0

Sie sollten L.Control.Search innerhalb Ihres Promise-Rückrufs instanziieren oder mindestens setLayer() method innerhalb dieses Rückrufs verwenden.

Es aussieht wie Sie haben ein classic asynchronous issue: Sie initiieren eine AJAX-Anforderung (durch jQuery getJSON), die den Wert Ihrer allcalls Variablen zuweisen wird einmal aufgelöst.

Parallel instanziert Ihre L.Control.Search und geben allcalls als die Layergruppe in gesucht werden. Doch zu diesem Zeitpunkt wird die AJAX noch verarbeitet (das heißt nicht aufgelöst), so allcalls noch nicht zugewiesen ist (das heißt undefined).

Daher kennt Ihr Suchsteuerelement nichts von der Ebenengruppe L.geoJson, die später in der AJAX-Auflösung erstellt wird.