Welcome to the forum Bill.Saving map info and graphics is one of the more complex concepts in web mapping with the jsapi. It takes some serious planning, coding and testing to get it working reliably. Here's a simple overview.There's a few ways to save map parameters like extent, and graphics. The key is json. Many of the esri classes have a toJson method which creates a json object, which is easily saved as plain text, and which can be used to easily recreate esri class objects. Take graphics for example:Here's a snippet from a function that prepares map annotation (graphics) for saving.var time = new Date().getTime().toString();
//javascript object with params for the save itself
// and arrays for the various geometry types
var saveObj = {
name: name,
description: description,
time: time,
userId: userId,
department, department,
project: project,
polygons: [],
polylines: [],
points: [],
markers: [],
text: []
};
//create json of each polygon object and push it to the polygon array
dojo.forEach(app.map.getLayer('gl_anno_polygon').graphics, function (g) {
var obj = g.toJson();
saveObj.polygons.push(obj)
});
//do the same polylines, points, etc
//convert js object to json
var save = dojo.toJson(saveObj);
//use ajax and some form of RDBMS to save json object
//parameters like name, userId, etc are also saved in separate fields in the database entryHere's the json of 1 polygon.{
"geometry": {
"rings": [[[-13715131.833534349, 5759372.32022381], [-13714845.194678271, 5759200.336910164], [-13715299.039533727, 5758751.269368976], [-13715514.018675784, 5759042.685539322], [-13715131.833534349, 5759372.32022381]]],
"spatialReference": {
"wkid": 102100
}
},
"attributes": {
"id": "1375306164892"
},
"symbol": {
"color": [0, 115, 197, 51],
"outline": {
"color": [0, 115, 197, 255],
"width": 1.5,
"type": "esriSLS",
"style": "esriSLSSolid"
},
"type": "esriSFS",
"style": "esriSFSSolid"
},
"infoTemplate": {
"title": "Polygon",
"content": "<div style=\"line-height:1.5;\"><a style=\"cursor:pointer;text-decoration:none;\" onclick=\"app.anno.editStyle(${id}, 'polygon')\">Edit Polygon Style</a><br /><a style=\"cursor:pointer;text-decoration:none;\" onclick=\"app.anno.bringTop(${id}, 'polygon')\">Bring to Top</a><br /><a style=\"cursor:pointer;text-decoration:none;\" onclick=\"app.anno.sendBottom(${id}, 'polygon')\">Send to Bottom</a><br /><a style=\"cursor:pointer;text-decoration:none;\" onclick=\"app.anno.deleteGraphic(${id}, 'polygon')\">Delete</a></div>"
}
}On the flip side bring graphics back in by using ajax to retrieve saves by a specific user/department and display them in a data grid for the user to load a specific save. Here's a snippet that adds polygons back to the map.dojo.forEach(loadObj.polygons, function (polygon) {
//the polygon param is the json for a single polygon
// simply creating a graphic with the json recreates it attributes, symbol and info template
var graphic = new esri.Graphic(polygon);
//array of all loaded graphics for zooming
features.push(graphic);
//graphic id to identify polygon to edit, delete, etc
graphic.graphic_id = polygon.attributes.id;
//set custom objects of the graphic used by custom print task
graphic.graphic_atts = polygon.attributes;
graphic.graphic_it = polygon.infoTemplate;
//is the graphic a text symbol also for printing
graphic.graphic_text = false;
//add to the annotation polygon layer
app.map.getLayer('gl_anno_polygon').add(graphic)
});
So there's some basics.As for saving to a database. I use php and mysql. Super simple to set up and use. Php has great json functions that can be used for creating a json object for loading an entire applications for example. But whatever you have and are comfortable with will work fine. Go with a BLOB type and save yourself some hassle.You may also try using HTML5's local storage. I feel it's a little risky for saving graphics, but map saves, bookmarks, etc are usually ok. If it's a business environment or folks can't risk losing data go with a database.
