jquery - Marker categories and Filters on Foursquare with MapBox? -
i have integrated foursquare api mapbox. it's working fine. add filters , show different category-based markers, e.g; cafe, school, restaurant, etc. please me achieving that. thanks. here code:
cityfqcn = cityname; var geodata = jquery.getjson( "http://gd.geobytes.com/getcitydetails?callback=?&fqcn="+cityfqcn, function (data) { $( "#map" ).remove(); $("<div></div>").attr('id','map').appendto('body'); var map = l.mapbox.map('map', 'examples.map-9ijuk24y', { attributioncontrol: true }) .setview([data.geobyteslatitude,data.geobyteslongitude], 14); map.featurelayer.on('ready', function() { //var typesobj = {}, types = []; var features = map.featurelayer.getgeojson().features; alert('asdf'+features.length); }); // setting ids var fsmapid = 'gg4ipx4dnsxoiwwq3fmbto2lvbfheumoe3r5vuvq4vrup2pd'; var fsmapsid = '4eq3reo4xuipjm22wc3uzvbayowslb2uzcnczlk4uksmshky'; // foursquare api endpoint call var api_endpoint = 'https://api.foursquare.com/v2/venues/search' + '?client_id=mpid' + '&client_secret=mpsecret' + '&v=20130815' + '&ll=latlon' + '&query=' + '&callback=?'; // group foursquare places on map var foursquareplaces = l.layergroup().addto(map); // constants replacepment , append fs api endpoint $.getjson(api_endpoint .replace('mpid', fsmapid) .replace('mpsecret', fsmapsid) .replace('latlon', map.getcenter().lat + ',' + map.getcenter().lng), function(result, status) { if (status !== 'success') return alert('request foursquare failed'); // transforming each venue marker on map. (var = 0; < result.response.venues.length; i++) { var ven = result.response.venues[i]; var myicon = l.icon({ iconurl: 'maki/renders/'+ven.categories.shortname+'-18.png', iconretinaurl: 'maki/renders/'+ven.categories.shortname+'-18@2x.png', //shadowurl: 'maki/renders/marker-24@2x.png', //shadowretinaurl: 'maki/renders/marker-24@2x.png', }); alert("features:"+ven.categories.shortname); var latlng = l.latlng(ven.location.lat, ven.location.lng); var marker = l.marker(latlng, {icon: myicon} ).bindpopup('<table><tr><td bgcolor="#cccccc" colspan=2><b>'+ven.name + '</b></td></tr><tr><td class="tooltip"><b>address:</b></td><td class="tooltip">'+ ven.location.address + '</td></tr> <tr><td class="tooltip"><b>distance:</b></td><td class="tooltip">'+ ven.location.distance + '</td></tr><tr><td class="tooltip"><b>checkin(s):</b></td><td class="tooltip">'+ ven.stats.checkinscount + '</td></tr></table>').addto(foursquareplaces); //l.marker([41.894140, 12.50], {icon: myicon}).addto(map); } }); });
}
Comments
Post a Comment