ArcGIS API for JavaScript

require([
  "esri/geometry/Point", "esri/symbols/SimpleMarkerSymbol",
  "esri/Color", "esri/InfoTemplate", "esri/graphic", ... 
], function(Point, SimpleMarkerSymbol, Color, InfoTemplate, Graphic, ... ) {
  var pt = new Point(xloc,yloc,map.spatialReference)
  var sms = new SimpleMarkerSymbol().setStyle(
    SimpleMarkerSymbol.STYLE_SQUARE).setColor(
    new Color([255,0,0,0.5]));
  var attr = {"Xcoord":evt.mapPoint.x,"Ycoord":evt.mapPoint.y,"Plant":"Mesa Mint"};
  var infoTemplate = new InfoTemplate("Vernal Pool Locations","Latitude: ${Ycoord} <br/>
    Longitude: ${Xcoord} <br/>
    Plant Name:${Plant}");
  var graphic = new Graphic(pt,sms,attr,infoTemplate);
  ...
});

Create a line

require([
  "esri/graphic", ... 
], function(Graphic, ... ) {
  var myLine ={geometry:{"paths":[[[-91.40625,6.328125],[6.328125,19.3359375]]],
    "spatialReference":{"wkid":4326}},
    "symbol":{"color":[0,0,0,255],"width":1,"type":"esriSLS","style":"esriSLSSolid"}};
  var gra= new Graphic(myLine);
  ...
});

Create a polygon

require([
  "esri/graphic", ... 
], function(Graphic, ... ) {
  var myPolygon = {"geometry":{"rings":[[[-115.3125,37.96875],[-111.4453125,37.96875],
    [-99.84375,36.2109375],[-99.84375,23.90625],[-116.015625,24.609375],
    [-115.3125,37.96875]]],"spatialReference":{"wkid":4326}},
    "symbol":{"color":[0,0,0,64],"outline":{"color":[0,0,0,255],
    "width":1,"type":"esriSLS","style":"esriSLSSolid"},
    "type":"esriSFS","style":"esriSFSSolid"}};
  var gra = new Graphic(myPolygon);
  ...
});

Create a multipoint

require([
  "esri/graphic", ... 
], function(Graphic, ... ) {
  var myMultiPoint = {"geometry":{"points":[[-92.109375,44.296875],[-86.1328125,31.9921875],
    [-73.4765625,45.703125]],"spatialReference":4326},"symbol":{"color":[255,255,255,64],
    "size":12,"angle":0,"xoffset":0,"yoffset":0,"type":"esriSMS","style":"esriSMSCircle",
    "outline":{"color":[0,0,0,255],"width":1,"type":"esriSLS","style":"esriSLSSolid"}}};
  var gra = new Graphic(myMultiPoint);
  ...
});

Create a point and specify an infoTemplate

require([
  "esri/graphic", ... 
], function(Graphic, ... ) {
  var myPoint = {"geometry":{"x":-104.4140625,"y":69.2578125,
    "spatialReference":{"wkid":4326}},"attributes":{"XCoord":-104.4140625,
    "YCoord":69.2578125,"Plant":"Mesa Mint"},"symbol":{"color":[255,0,0,128],
    "size":12,"angle":0,"xoffset":0,"yoffset":0,"type":"esriSMS",
    "style":"esriSMSSquare","outline":{"color":[0,0,0,255],"width":1,
    "type":"esriSLS","style":"esriSLSSolid"}},
    "infoTemplate":{"title":"Vernal Pool Locations","content":"Latitude: ${YCoord} <br/>
     Longitude: ${XCoord} <br/> Plant Name:${Plant}"}};
  var gra = new Graphic(myPoint);
  ...
});

graphic.getDojoShape().moveToFront();
graphic.getDojoShape().moveToBack();

 
         map.graphics.on("click", function(e){
            //get the associated node info when the graphic is clicked
            var node = e.graphic.getNode();
            console.log(node);
          });

graphic.getShape().moveToFront();
graphic.getDojoShape().moveToBack();

gra.setAttributes( {"XCoord":evt.mapPoint.x,"YCoord":evt.mapPoint.y,"Plant":"Mesa Mint"});

gsvc.simplify([ polygonGraphic.geometry ], function(geometries){

  polygonGraphic.setGeometry(geometries[0]);

});

require([
  "esri/InfoTemplate", ... 
], function(InfoTemplate, ... ) {
  var infoTemplate = new InfoTemplate();

  infoTemplate.setTitle("${NAME}");

  infoTemplate.setContent("<b>2000 Population: </b>${POP2000}<br/>"

         + "<b>2000 Population per Sq. Mi.: </b>${POP00_SQMI}<br/>"

         + "<b>2007 Population: </b>${POP2007}<br/>"

         + "<b>2007 Population per Sq. Mi.: </b>${POP07_SQMI}");

  graphic.setInfoTemplate(infoTemplate);
  ...
});

require([
  "esri/symbols/SimpleFillSymbol", "esri/symbols/SimpleLineSymbol", "esri/Color", ... 
], function(SimpleFillSymbol, SimpleLineSymbol, Color, ... ) {    
  var symbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID, 
    new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
    new Color([98,194,204]), 2), new Color([98,194,204,0.5])
  );
  var graphic = results[i].feature;
  graphic.setSymbol(symbol);
  ...
});