Hide Table of Contents
esri
esri/arcgis
esri/dijit
esri/dijit/analysis
esri/dijit/geoenrichment
esri/dijit/geoenrichment/ReportPlayer
esri/geometry
esri/layers
esri/opsdashboard
esri/renderers
esri/symbols
esri/tasks
esri/tasks/datareviewer
esri/tasks/geoenrichment
esri/tasks/locationproviders
require(["esri/graphic"], function(Graphic) { /* code goes here */ });
| Name | Summary |
|---|---|
| new Graphic(geometry?, symbol?, attributes?, infoTemplate?) | Creates a new Graphic object. |
| new Graphic(json) | Creates a new Graphic object using a JSON object. |
| Name | Type | Description |
|---|---|---|
| data-class-break | "<Number>" | Class break index as returned by ClassBreaksRenderer.getBreakIndex. |
| data-geometry-type | "<String>" | Geometry type: "point", "polyline", "polygon" or "multipoint". |
| data-hidden | "" (empty string) | Added to the graphic's node when it is hidden. |
| data-selected | "" (empty string) | Added to the graphic's node when it is selected. |
| data-unique-value | "<String>" | Graphic's unique value as returned by UniqueValueRenderer.getUniqueValueInfo. |
| Name | Type | Summary |
|---|---|---|
| attributes | Object | Name value pairs of fields and field values associated with the graphic. |
| geometry | Geometry | The geometry that defines the graphic. |
| infoTemplate | InfoTemplate | The content for display in an InfoWindow. |
| symbol | Symbol | The symbol for the graphic. |
| visible | Boolean | Indicate the visibility of the graphic. |
| Name | Return type | Summary |
|---|---|---|
| attr(name, value) | Graphic | Adds a new attribute or changes the value of an existing attribute on the graphic's DOM node. |
| clone() | Graphic | Creates a deep clone of the graphic object. |
| draw() | Graphic | Draws the graphic. |
| getChildGraphics() | Graphic[] | Returns the graphics summarized by an aggregate graphic in a clustering or feature reduction visualization. |
| getContent() | String | Returns the content string based on attributes and infoTemplate values. |
| getDojoShape() | Shape | Returns the dojo/gfx/shape.Shape of the Esri graphic. |
| getInfoTemplate() | InfoTemplate | Returns the info template associated with the graphic. |
| getLayer() | Layer | Returns a reference to the associated layer. |
| getNode() | SVG group | SVG element | VML Shape | Group Element | Returns the DOM node used to draw the graphic. |
| getNodes() | SVG group | SVG element | VML Shapes or Group Elements | Returns one or more DOM nodes used to draw the graphic. |
| getShape() | Shape | Returns the dojox/gfx/shape.Shape of the Esri graphic. |
| getShapes() | Shape[] | Returns one or more dojox/gfx/shape.Shape used to draw the graphic. |
| getSourceLayer() | Layer | In contrast to the getLayer method, getSouceLayer does not change when a graphic is added to another layer. |
| getTitle() | String | Returns the title string based on attributes and infoTemplate values. |
| hide() | None | Hides the graphic. |
| isAggregate() | Boolean | Indicates if the graphic represents a cluster of features. |
| setAttributes(attributes) | Graphic | Defines the attributes of the graphic. |
| setGeometry(geometry) | Graphic | Defines the geometry of the graphic. |
| setInfoTemplate(infoTemplate) | Graphic | Defines the InfoTemplate for the InfoWindow of the graphic. |
| setSymbol(symbol) | Graphic | Sets the symbol of the graphic. |
| show() | None | Shows the graphic. |
| toJson() | Object | Converts object to its ArcGIS Server JSON representation. |
<> geometry |
Optional | The geometry that defines the graphic. |
<> symbol |
Optional | Symbol used for drawing the graphic. |
<> attributes |
Optional | Name value pairs of fields and field values associated with the graphic. |
<> infoTemplate |
Optional | The content for display in an InfoWindow. |
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);
...
});
<> json |
Required | JSON object representing the graphic. |
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);
...
});
Object> attributesnumeric values. This means that when updating existing features, date fields must have numeric values and not date objects.Boolean> visibletrue | falsetrueGraphicGraphicvar clonedGraphic = graphic.clone();
Graphic[]Stringdojo/gfx/shape.Shape of the Esri graphic. One common use for the getDojoShape method is to change the drawing order of a graphic using the moveToFront and moveToBack methods. Deprecated at v3.8. Use getShape and getShapes instead.Shapegraphic.getDojoShape().moveToFront(); graphic.getDojoShape().moveToBack();
InfoTemplateLayerSVG group | SVG element | VML Shape | Group Elementmap.graphics.on("click", function(e){
//get the associated node info when the graphic is clicked
var node = e.graphic.getNode();
console.log(node);
});
SVG group | SVG element | VML Shapes or Group Elementsdojox/gfx/shape.Shape of the Esri graphic. One common use is to change the drawing order of a graphic using the moveToFront and moveToBack methods. (Added at v3.8)Shapegraphic.getShape().moveToFront(); graphic.getShape().moveToBack();
dojox/gfx/shape.Shape used to draw the graphic. Multiple shapes are used when a graphics layer has a renderer with backgroundFillSymbol. (Added at v3.8)Shape[]getSouceLayer does not change when a graphic is added to another layer. (Added at v3.21)LayerStringBooleangraphic.isAggregate();
Graphic<> attributes |
Required | The name value pairs of fields and field values associated with the graphic. |
gra.setAttributes( {"XCoord":evt.mapPoint.x,"YCoord":evt.mapPoint.y,"Plant":"Mesa Mint"});Graphic<> geometry |
Required | The geometry that defines the graphic. |
gsvc.simplify([ polygonGraphic.geometry ], function(geometries){
polygonGraphic.setGeometry(geometries[0]);
});
Graphic<> infoTemplate |
Required | The content for display in an InfoWindow. |
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);
...
});
Graphic<> symbol |
Required | The symbol for the graphic. |
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);
...
});