Plot points using ArcGIS javascript api from co-ordinates

Question

I would like to map co-ordinates that I got from the exif in photo's using my own command line tool that I made. As opposed to uploading your private photo's for everyone to see on flickr.

How to I get the coordinates plotted on a map like this: http://help.arcgis.com/en/webapi/javascript/arcgis/jssamples/#sample/map_graphics

Using a file generated from the stdout of my command line tool, here is an example: http://dpaste.com/880696/plain/

I can't find any info on how esri.request works in the Javascript API for arcGIS. I also tried looking at this loading text sample in arcgis javascript api's sample section, the example doesn't seem to work.

Basically all I'm asking is what is the simplest method to plot co-ordinates on the map as they are doing in the example with flickr, but from a text file. Perhaps I should first turn them into the format that is being used in the example with flickr? I tried using this format: on georss dot org but using sed to replace the values with my own values but it didn't work.

Answer 1

If you look at the json output from Flickr's API, the result is something like this:

jsonFlickrFeed({
        "title": "Recent Uploads with geodata",
        "link": "http://www.flickr.com/photos/",
        "description": "",
        "modified": "2013-01-21T11:31:25Z",
        "generator": "http://www.flickr.com/",
        "items": [
       {
            "title": "P1200041",
            "link": "http://www.flickr.com/photos/wheelsy1/8401974364/",
            "media": {"m":"http://farm9.staticflickr.com/8351/8401974364_cbfd14a295_m.jpg"},
            "date_taken": "2013-01-20T14:12:19-08:00",
            "description": " <p><a href=\"http://www.flickr.com/people/wheelsy1/\">wheelsy1<\/a> posted a photo:<\/p> <p><a href=\"http://www.flickr.com/photos/wheelsy1/8401974364/\" title=\"P1200041\"><img src=\"http://farm9.staticflickr.com/8351/8401974364_cbfd14a295_m.jpg\" width=\"180\" height=\"240\" alt=\"P1200041\" /><\/a><\/p> ",
            "published": "2013-01-21T11:31:25Z",
            "author": "[email protected] (wheelsy1)",
            "author_id": "7529477@N03",
            "tags": "snow ice walking peakdistrict scramble scrambling kinderscout wintermountaineering richardwiles wheelsy1 wheelsy",
                        "latitude" : "53.388969",
                    "longitude" : "-1.880673"
       }
      ]})

In the sample that you linked, the important parts are in the following callback function

function addPhotos(data){
       var symbol = new esri.symbol.PictureMarkerSymbol("http://dl.dropbox.com/u/52777651/flickr.png", 24, 24);
       var template = new esri.dijit.PopupTemplate({
          title: "{title}",
          description:"{description}"
        });

        dojo.forEach(data.items, function(item){
          var loc = new esri.geometry.Point(item.longitude, item.latitude);
          map.graphics.add(new esri.Graphic(loc, symbol, item, template));
        });

      }

The code is looping over each of the objects that are returned, and is adding a new graphic at each point.

You just need to write a function to call your data (it need not be in JSON format, though JSON makes things very easy in JavaScript), and once you have your data, you too can show those as points on the map, using code similar to:

 var loc = new esri.geometry.Point(item.longitude, item.latitude);
 map.graphics.add(new esri.Graphic(loc, symbol, item, template));