Select to view content in your preferred language

Convert a graphicsLayer to JSON

12113
20
02-03-2012 03:25 PM
SowjanyaSunkara
Emerging Contributor
Is there a way to convert an entire GraphicsLayer to JSON?
I was able to use dojo.toJson(graphics.toJson()) and convert individual graphics from a GraphicsLayer to JSON, so could anyone throw light on how to convert the entire layer to JSON?
I'm trying to store/save the JSON format of a graphics layer and then re-load it back to the user.

Thnx in adavance,
SS.
0 Kudos
20 Replies
SowjanyaSunkara
Emerging Contributor
After converting the sketches to Json, I store each graphic as a datatable inside a XML dataset on the server.
And to read the Json back, I'm reading the XML file contents to a string variable.
0 Kudos
derekswingley1
Deactivated User
Nevermind then.
0 Kudos
hcgis
by
Deactivated User
Hi Sowjanya,
How did you store graphics in the database, can you explain more details?
thanks
0 Kudos
ReneRubalcava
Honored Contributor
I actually do this a lot.
Geometry has a toJson() method, notice the lowercase "son", you guys just had to be different 😉
http://help.arcgis.com/EN/webapi/javascript/arcgis/help/jsapi/geometry.htm#toJson
I then do a jsonObject.toString() and store this in a string field that gets saved in a SQL table field along with any other data that's required.

Then when I get my results from the db, I take that field and convert it to JSON using dojo or jquery or JSON.parse(). I'd avoid using eval if a public facing site, too risky, but once you have the JSON object of the geometry you saved, you can now convert it to a real Geometry with esri.geometry.fromJson.
http://help.arcgis.com/EN/webapi/javascript/arcgis/help/jsapi/namespace_geometry.htm#fromJson

Then you can create your graphics to show on the map.
t's fast, simple and efficient for basic needs.
0 Kudos
hcgis
by
Deactivated User
hi Rene,
thank you for your help, can you explain deeply how to save in the SQL table from the javascript application an can you provide a sample for that
many thanks
0 Kudos
ReneRubalcava
Honored Contributor
I don't really use dojo.xhr too often to do my CRUD, but it should look similar to this.
updateData = function(graphic) {
 var _args, attr, data, geom;
 attr = graphic.attributes;
 // JSON methods may not be available in all browsers
 // I think dojo.toJson(obj).toString() will
 // do the same thing.
 geom = JSON.stringify(graphic.geometry.toJson());
 data = {
  "Geometry": geom
 };
 _args = {
  // my .net service will handle the writing
  // to sql server
  url: "api/service/" + attr.id,
  postData: data,
  handleAs: "json"
 };
 // I think you'd use xhrRawPost for json data,
 // I'm not clear on this one.
 return dojo.xhrRawPost(_args);
};


Then to read the updated data at a later time.
graphics = []; // array that will hold my graphics
// results would be the response from
// from a REST request via dojo xhr or jquery ajax
dojo.forEach(results, function(result) {
 var g, res_geom, res_obj;
 // result is JSON, but Geometry is a string field
 // convert string field to JSON object
 res_obj = dojo.fromJson(result.Geometry);
 // convert json to geometry
 res_geom = esri.geometry.fromJson(res_obj);
 //create my graphic
 g = new esri.Graphic(res_geom, symbolHelper.lineSymbol(), {
   "Id": attribute.Id,
   "WorkOrderId": attribute.WorkOrderId
 });
 return graphics.push(g);
});
// In this case, I update a FeatureLayer, but you can easily just add
// graphics to a GraphicsLayer
prev_graphics = lineFeatures.graphics;
lineFeatures.applyEdits(graphics, null, prev_graphics);


Hope that helps a bit, I tweaked some stuff from a project for this example to simplify it a bit, but not too much.
0 Kudos
hcgis
by
Deactivated User
Are you storing graphics in a geodatabase or in other spatial databases
0 Kudos
ReneRubalcava
Honored Contributor
I just store them as strings in a SQL table. No spatial or gdb. In this case, it wasn't needed.
0 Kudos
hcgis
by
Deactivated User
OK, how to store it as geometry or geography type in SQL server
thank you for your reply
0 Kudos
RobertMEIER
Regular Contributor
Just thought I'd chime in on this, writing multiple Graphics as JSON to a file.

I spent the last couple of hours looking around at the forums and other online sources and came up with this:
//using jquery to loop through the graphics:

        var jsonval = "{";

        $.each(markupGrfLayer.graphics, function (index, grf) {
            var junk = grf.toJson();
            jsonval += "\"" + index + "\":" + dojo.toJson(junk) + ",";
        });

        jsonval = jsonval.substring(0, jsonval.length - 1); //trim comma
        jsonval += "}";


// this creates a string that looks like this:

"{"0":{"geometry":{"x":-12659674.40398411,"y":5195776.256527749,"spatialReference":{"wkid":102100}},
"symbol":{"color":[204,153,204,255],"size":3.75,"angle":0,"xoffset":0,"yoffset":0,"type":"esriSMS","style":"esriSMSCircle",
"outline":{"color":[153,255,153,255],"width":2.25,"type":"esriSLS","style":"esriSLSSolid"}}},
"1":{"geometry":{"x":-12547159.098348362,"y":5210452.165958499,"spatialReference":{"wkid":102100}},"symbol":{"color":[204,153,204,255],
"size":3.75,"angle":0,"xoffset":0,"yoffset":0,"type":"esriSMS","style":"esriSMSCircle","outline":{"color":[153,255,153,255],"width":2.2,
"type":"esriSLS","style":"esriSLSSolid"}}}}"

Write this to a file how ever you'd like.

Read the string from file however you'd like, recreate the graphics and add the to the graphics layer:

              var jsString = stringFromFile;
               var val = $.parseJSON(jsString);

               $.each(val, function (key, value) {
                  var gra = new esri.Graphic(value);
                  markupGrfLayer.add(gra);
               });


That's it!

I hope someone finds this useful!

-bert
0 Kudos