I've been working through some of the API documentation and examples for the last couple of days, but I'm still a bit lost.
Here is what I need to do, and perhaps someone will be able to point me in the right direction.
I have an internal web application that shows information for each zip code in the U.S. I have polygon data for all of these areas already.
Before I start working on dynamically creating polygons, I want to display a few polygons onto a map to see how it works.
That's it for now. All of the examples I've seen are overly complicated with features and other functionality that I don't need at the moment. Are there any resources for complete beginners? How would I go about just adding a few polygons to a map using hard coded latitude / longitude coordinates?
Also, is there any way to remove city names from the default maps?
Thanks!
Solved! Go to Solution.
It is a great library. I have got a lot of use out of it. Combine it with the ESRI REST API and you can make an AJAX call to add, delete, update ...! I started a class for it.
function CRUD(url){ //url should look like: http://YourDomain/ArcGIS/rest/services/FeatName/FeatureServer/0
this.url=url;
}//end function CRUD
CRUD.prototype={
add: function(addFeature){
////needs to look like [{"geometry":{"x":-106,"y":35}, "attributes":{"name":"paul","number":123}}]
var addparams = "features="+addFeature+"&f=json";
var addurl=this.url+"/addFeatures";
alert(addFeature);
var http;
if (window.XMLHttpRequest){
http=new XMLHttpRequest();
}
else {
http=new ActiveXObject("Msxml2.XMLHTTP");
}
http.open("POST", addurl, true);
http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http.onreadystatechange = function() {//Call a function when the state changes.
if(http.readyState == 4 && http.status == 200) {
alert(http.responseText);
}
}
http.send(addparams);
}, //end ADD
update: function(updateFeature){
var updateparams = "features="+updateFeature+"&f=json";
var updateurl=this.url+"/updateFeatures";
var http;
if (window.XMLHttpRequest){
http=new XMLHttpRequest();
}
else {
http=new ActiveXObject("Msxml2.XMLHTTP");
}
http.open("POST", updateurl, true);
http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http.onreadystatechange = function() {//Call a function when the state changes.
if(http.readyState == 4 && http.status == 200) {
console.log(http.responseText);
}
}
http.send(updateparams);
}, //end UPDATE
delete: function(deleteFeature){ //takes objectid
var deleteparams = "objectIds="+deleteFeature+"&f=json";
var deleteurl=this.url+"/deleteFeatures";
var http;
if (window.XMLHttpRequest){
http=new XMLHttpRequest();
}
else {
http=new ActiveXObject("Msxml2.XMLHTTP");
}
http.open("POST", deleteurl, true);
http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http.onreadystatechange = function() {//Call a function when the state changes.
if(http.readyState == 4 && http.status == 200) {
console.log(http.responseText);
}
}
http.send(deleteparams);
}, //end DELETE
query: function(){
} // end QUERY
};//end CRUD.prototype
Throw it in a JS file and include a reference in your HTML. then use it like this:
//USE CASE for DELETE and ADD
var crud = new CRUD("http://Yourdomain/ArcGIS/rest/services/FeatName/FeatureServer/0");
//DELETE WORKS
crud.delete(43);
//ObjectID - you can get it using the vector layer onclick() and feature.properties.OBJECTID.
//ADD WORKS - adding lines is easy just use leaflet toGeoJSON();
var pointToAdd='[{"geometry":{"x":-106.79192,"y":35.06148}, "attributes":{}}]';
crud.add(pointToAdd);
//UPDATE WORKS
var crud2 = new CRUD("http://YourDomain/ArcGIS/rest/services/featName/FeatureServer/0");
var feature='[{"geometry":{"x":-106.73975,"y":35.12765}, "attributes":{"OBJECTID":57,"name":"Paul","number":123}}]';
crud2.update(feature);