The Edible? Geographies of NYC

Posted on Dec 3, 2013 in Web
The Edible? Geographies of NYC

Final (Game Plan)

I make maps and infographics, so I’ve been trying to think about how I might integrate those mediums/outputs with the responsive capabilities of php. Of course the weird thing about looking at prototypical webpages, to see their mySQL or even GIS db use… (drumroll) is that you can’t really get at their php.


Take for example, StateImpact’s simple graphics- they use <div>’s for bar graphs and an initial mapbox map to enable a fairly cohesive and browse-able page for fracking information. (That’s right, I’m from Pittsburgh, under the largest fracking bubbles.)



…and some of the code looks like this:



Little signs: <form>, </form> and the ‘must-be a loop’ structure of the repetitive data display suggests some sort of php or mySQL action embedded within… There’s a project in there somewhere. Or maybe I should say, this array of components and code suggests that a bit of javascript, php, and mapbox might have a future together, but how and to  display what?

finding flicker geographies

I’ve also been thinking I should take a run at the flickr api and see what geo-tagged images might produce. So I think I’ll make a more whimsical visualization and have visitors input some more specific input (like food or coffee) and then produce a closer, nyc-centered map of geotagged ‘food porn’ shots with the same tag… a sort of edible geographies of the five boroughs….

I don’t want to get ahead of myself, so for now, the layout will be incredibly simple and linear:

  • an input form asking for a favorite food or beverage
  • the resultant leaflet/mapbox map of the returned json to geojson query from twitter (w/ bounded lat/long ranges for nyc or by nyc in tags or something)
  • a list of past food searches that can be clicked again

(Although it be great to see some food pron, pulling up imagery from flickr seems like a layout/space disaster waiting to happen and hover tags w/ pulled imagery seems a bit ambitious for one week.)


I know this doesn’t really work in psuedo code, but here’s a streamlined sketch of components/programs/code approaches:

mapbox=>geojson markers=>php query=>flicker api  and geotags (with stored query words in a new table)


Tuesday- 1) test flickr api and get simple returned json, visualize however seems appropriate (purge?), 2) leaflet tutorials on basic structure of javascript in mapbox, browse their api examples-

Wednesday- 3) setup basic database form for food/nyc query, try to pass to flickr, debug, debug, 4) leaflet tutorials on api marker creation and styling- basis of geocoded flickr food dots

Thursday 5) setup table and memory of query terms (not the returned json) and test aside query, 6) mapbox api- code and troubleshoot the handoff from php, flickr, mapbox

Friday- 7) catchup, catchup, catchup

Saturday- 8) full html, php page with mapbox inserted… begin debug and stylization

Sunday- debug/pcomp

Monday- debug/pcomp

Tuesday- debug