2

long time reader, first time question-asker etc...

So I'm trying to implement a search function on an app I'm building using data from cartodb in leaflet and this leaflet-search plugin: http://labs.easyblog.it/maps/leaflet-search/

As a bit of background, I've got a standard search working fine (calling my geojson using the leaflet-ajax plugin), but the problem is this only includes one field and I need it to pass multiple fields through the search. I know it's possible to do, and I think I've found a method to do it, but something's going wrong and I don't know why.

This example: http://labs.easyblog.it/maps/leaflet-search/examples/jsonp-filtered.html uses a jsonp call from mapquest, then splits the fields (don't ask me how this is useful, but it's just an example), so I'm pretty sure all it needs is to concatenate fields in the "key" var to make them search as one. code from example below

var jsonpurl = 'http://open.mapquestapi.com/nominatim/v1/search.php?q={s}'+
               '&format=json&osm_type=N&limit=100&addressdetails=0',
    jsonpName = 'json_callback';
//third party jsonp service 

function filterJSONCall(rawjson) {  //callback that remap fields name
    var json = {},
        key, loc, disp = [];

    for(var i in rawjson)
    {
        disp = rawjson[i].display_name.split(',');  

        key = disp[0] +', '+ disp[1];

        loc = L.latLng( rawjson[i].lat, rawjson[i].lon );

        json[ key ]= loc;   //key,value format
    }

    return json;
}

var searchOpts = {
        url: jsonpurl,
        jsonpParam: jsonpName,
        filterJSON: filterJSONCall,
        animateLocation: false,
        markerLocation: true,
        zoom: 10,
        minLength: 2,
        autoType: false
    };

map.addControl( new L.Control.Search(searchOpts) );

In my project I've got the concatenation working fine, but I can't for the life of me get my data into the filter. My code is identical save for the jsonp url and the callback

        var jsonpurl = 'http://stratiform.cartodb.com/api/v2/sql/?q=SELECT%20name,%20ST_AsGeoJSON%28the_geom%29%20FROM%20schools_points%20WHERE%20name%20ILIKE%20%27%25clunes%25%27&format=json',
        jsonpName = 'callback';

I've tried setting '&callback=whatever' on the url, tried using the ST_AsGeoJSON sql function, and I'm almost out of ideas!

Is there a problem with the cartodb jsonp url I'm using? Does it handle callbacks in a different way or something? Do I need to modify it to somehow to match this function? Is it a cross-origin thing?? I guess what I'm asking is why are the mapquest jsonp and cartodb jsonp links working and not working respectively?

I've got work-arounds for this problem, but it's obviously just cleaner to set this stuff up in the app itself. Can anyone help?

1

adding "callback" should work, I've tested it using this code:

<script>
function c(data) {
  console.log(data);
}
</script>

<script src="http://stratiform.cartodb.com/api/v2/sql/?q=SELECT%20name,%20ST_AsGeoJSON%28the_geom%29%20FROM%20schools_points%20WHERE%20name%20ILIKE%20%27%25clunes%25%27&format=json&callback=c"></script>
  • Hey thanks for the reply, you're totally right, firebug is registering the call each time in the console, and the callback is fine. There's some other problem here that I can't puzzle out. Luckily my work-around is fine for the moment. The leaflet-search code is just a bit opaque for my level of JS knowledge to get it to work properly! – tearsinkevin Dec 19 '14 at 10:12

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.