map.graphics is null

[mdonnelly]

Hi,

I'm trying to draw a point symbol over my base map layer. I'm using the following code but firebug tells me that map.graphics is null. I successfully use the map object for many other operations, it just doesn't seem to have a graphics object associated with it:

      dojo.require("dojo.parser");
      dojo.require("esri.map");
      dojo.require("esri.dijit.editing.Editor-all");
      dojo.require("dijit.layout.ContentPane");
      dojo.require("dijit.layout.BorderContainer");
      dojo.require("dijit.layout.TabContainer");  
      dojo.require("esri.dijit.Scalebar");   
      dojo.require("esri.tasks.geometry");
      dojo.require("esri.toolbars.draw"); 
      dojo.require("esri.graphic");
      dojo.require("esri.layers.graphics");
.
.
.
var initialExtent = new esri.geometry.Extent({"xmin":xmin,"ymin":ymin,
            "xmax":xmax,"ymax":ymax,"spatialReference":{"wkid":102100}}).expand(3.0);
var map = new esri.Map("map", { extent: initialExtent, slider: true, nav: false, logo: false });
.
.
.
var pt = new esri.geometry.Point(upEast,upNorth,map.spatialReference)
var sms = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE, 10, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new  dojo.Color([255,0,0]), 1), new dojo.Color([0,255,0,0.25]))
var attr = {"XCoord":upEast,"YCoord":upNorth};
var infoTemplate = new esri.InfoTemplate("Upstream","Latitude: ${YCoord} <br/>Longitude: ${XCoord}");
var graphic = new esri.Graphic(pt,sms,attr,infoTemplate);
map.graphics.add(graphic);

[mdonnelly]

OK, I have added the following bit of code (in red) to get rid of the null map.graphic object:

var pt = new esri.geometry.Point(upEast,upNorth,map.spatialReference)
var sms = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE, 10, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new  dojo.Color([255,0,0]), 1), new dojo.Color([0,255,0,0.25]))
var attr = {"XCoord":upEast,"YCoord":upNorth};
var infoTemplate = new esri.InfoTemplate("Upstream","Latitude: ${YCoord} <br/>Longitude: ${XCoord}");
var graphic = new esri.Graphic(pt,sms,attr,infoTemplate);
map.graphics = new esri.layers.GraphicsLayer();
map.graphics.add(graphic);

However, the symbol still doesn't render. Any ideas?

Mark

[mdonnelly]

Still no joy. I'm at the point where I have this code but it still does not render. The alerts below show the correct information I expect. Certainly, the coordinates are correct and the graphic object is visible:

var symbol = new esri.symbol.SimpleFillSymbol();
symbol.setColor(new dojo.Color([150,150,150,0.5]));
var pt = new esri.geometry.Point(upEast,upNorth,map.spatialReference);    
var attr = {};
var infoTemplate = new esri.InfoTemplate("","");
var graphic = new esri.Graphic(pt,symbol,attr,infoTemplate);
alert (graphic.geometry.type);
alert (graphic.visible);
alert (graphic.geometry.x);
alert (graphic.geometry.y);
alert (graphic.geometry.spatialReference.wkid);

//Create graphics layer for upstream/downstream points
var upDownLayer = new esri.layers.GraphicsLayer();
map.addLayer(upDownLayer);
upDownLayer.add(graphic);

[JonathanLathigee]

Hi Mark. I was having the same problem

I started by working from the JQuery sample at:

http://help.arcgis.com/EN/webapi/javascript/arcgis/help/jssamples/framework_jquery.html

I found map.graphics was null until a little later in the page lifecycle, so updating the jQueryReady() method (that gets fired later than init()) was the trick.

Changed it to:

      /***************
       * jQuery stuff
       ***************/
      
      function jQueryReady() {
        console.log("jQuery ready event");
  
  var sym = new esri.symbol.PictureMarkerSymbol('http://domain.com/yourGraphic.gif', 10, 10);
  
  var myPoint = {"geometry":{"x":474876.65,"y":5363958.64,
    "spatialReference":{"wkid":26910}},"attributes":{"XCoord":-123.3389,
    "YCoord":48.4283,"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 esri.Graphic(myPoint);
  gra.setSymbol(sym);

  map.graphics.add(gra);

Cheers

Jonathan

[KellyHutchins]

The Map.graphics object is only available after the map's onLoad event has fired.  For example:

 dojo.connect(map, "onLoad", function() { ShowLocation(-81.3765, 28.54175); });   
 function ShowLocation(x, y) 
{
    var point = new esri.geometry.Point(x, y, new esri.SpatialReference({wkid:4326}));

    var simpleMarkerSymbol = new esri.symbol.SimpleMarkerSymbol();
    var graphic = new esri.Graphic(point, simpleMarkerSymbol);
    
    map.graphics.add(graphic);
}