topic Re: Why my graphics are not added to the map? in ArcGIS JavaScript Maps SDK Questions

Why my graphics are not added to the map?

YvanBérard — Sun, 12 Dec 2021 01:44:36 GMT

Hi all,

I'm following this example (but programmatically) http://help.arcgis.com/EN/webapi/javascript/arcgis/help/jssamples_start.htm#jssamples/find_map_datagrid.html

and I don't know why my graphic are not showing up...

Thank's for your help.

//display the location results on the map 
function showResultsLocator(results) 
{
    map = getMap();
    //find results return an array of findResult.
    console.dir(map); // my map object is fully working here
    map.graphics.clear();
    var dataForGrid = [];
    //Build an array of attribute information and add each found graphic to the map
    var cpt = 0;
    //console.log(results);
    
    
    dojo.forEach(results, function(result) 
    {
     cpt++;
     var graphic = result.feature;
              
     //console.log(graphic.attributes.NAD83+","+ graphic.attributes.CIVIQUE+","+ graphic.attributes.VOIE);
  dataForGrid.push([result.layerName,graphic.attributes.NAD83, graphic.attributes.CIVIQUE, graphic.attributes.VOIE]);
  
        var symbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255,0,0]), 2), new dojo.Color([255,255,0,0.5]));
        graphic.setSymbol(symbol);
  map.graphics.add(graphic);  // the graphics are not added to the map. Why?
 });
 //console.log(dataForGrid);
 generateTableSearch(dataForGrid);
 //console.log("cpt search = "+cpt);
 $('#nb_res_search').empty();
 $('#nb_res_search').text('Nb. résultat(s): '+cpt);
}

Re: Why my graphics are not added to the map?

BenFousek — Sun, 12 Dec 2021 01:44:39 GMT

I think its how you are creating the graphic using var graphic = result.feature;. That doesn't create a esri.Graphic object.

Here's the execute of an identify task.

t.execute(p, function (results) {
    if (results[0] != undefined) {
        var r = results[0].feature;
        var atts = r.attributes;
        var sym = app.sym.SimpleFillSymbol('solid', new esri.symbol.SimpleLineSymbol('solid', new dojo.Color([255, 0, 0]), 2), new dojo.Color([255, 255, 0, 0.2]));
        var it = new esri.InfoTemplate('My Info Title', 'My Info Content')
        var graphic = new esri.Graphic(r.geometry, sym, atts, it);
        map._layers.MY_GRAPHICS_LAYER.add(graphic);
    }
})

Re: Why my graphics are not added to the map?

YvanBérard — Wed, 05 Dec 2012 16:15:03 GMT

No, my feature object is all right.

When i use FireBug to inspect the object, I have all what a graphic object should have...but nothing happen.

Re: Why my graphics are not added to the map?

JeffPace — Wed, 05 Dec 2012 16:31:43 GMT

I agree, I don't think result.feature is a graphic either.

Can you show what result is?

Re: Why my graphics are not added to the map?

YvanBérard — Wed, 05 Dec 2012 16:57:42 GMT

Here some proof taht they are both graphic object...

When I use my identification tool (queryTask) the feature object return (using console.dir(result.feature)) :
[ATTACH=CONFIG]19722[/ATTACH]

And when I use my search tool (where my graphics are not added to the map) the feature object return (using console.dir(result.feature));
[ATTACH=CONFIG]19723[/ATTACH]

Re: Why my graphics are not added to the map?

BenFousek — Wed, 05 Dec 2012 17:44:40 GMT

I ran a test and was surprised to find you can create a graphic object that way. The problem I encountered with your method was setting the symbol. Sometimes it didn't take. The graphic was in the map but had no style. It I would create a esri.Graphic as best practice.

Also, create your own graphics layer. I had trouble in the past with map.graphics and quit using it some time ago.

What does the graphic object look like in the DOM @ map.graphics; is it even present?

Re: Why my graphics are not added to the map?

YvanBérard — Wed, 05 Dec 2012 17:52:16 GMT

What does the graphic object look like in the DOM @ map.graphics; is it even present?

Yes, at the beginning I though it was the map object the problem, so then I a create setter/getter functions, but in the DOM @ map.graphics the object was present even without the setter/getter functions.

Also, create your own graphics layer. I had trouble in the past with map.graphics and quit using it some time ago.

How do you do that? And what trouble did you have?

Re: Why my graphics are not added to the map?

BenFousek — Sun, 12 Dec 2021 01:44:42 GMT

Graphics layer:

var plotGraphics = new esri.layers.GraphicsLayer({ id: 'plot_gl' });
app.map.addLayer(plotGraphics);

Notice that I set the id of the layer. You should always set the id of all layers: dynamic, tiled, feature, graphic, etc. It's a lot easier to find a layer when you named it yourself. All layers are located in the map._layers object.

The problem with map.graphics is that it isn't a true graphics layer per se. It's built into the map and is always the top most layer. So reordering is a problem. Like I said, I haven't used map.graphics in a while, but I recall having some issues with my apps being unstable, slow or crashing when I used map.graphics. That was pre v2, so it's probably fixed by now. Most of my apps have 6-10 graphics layers and up to 20 or so feature layers. Being able to reorder and have better control over graphics layers is a must in that situation.

Re: Why my graphics are not added to the map?

YvanBérard — Wed, 05 Dec 2012 18:25:39 GMT

Maybe I don't understand.... but what I want to do, is to create a graphic from the result of my findTask.

So why should I create a new graphic layer? And if I really need to use a new graphic layer (new esri.layers.GraphicsLayer) , how could I pass the result of my findTask to the new graphic layer?

Re: Why my graphics are not added to the map?

BenFousek — Sun, 12 Dec 2021 01:44:44 GMT

After you initialize the map add your graphics layer:

var myGraphicsLayer = new esri.layers.GraphicsLayer({ id: 'my_graphics_layer' });
map.addLayer(myGraphicsLayer);

Add features:

function addResultsToMap(results) {
    dojo.forEach(results, function(result) {
        
        var sym = esri.symbol.SimpleFillSymbol('solid', new esri.symbol.SimpleLineSymbol('solid', new dojo.Color([255, 0, 0]), 2), new dojo.Color([255, 255, 0, 0.2]));
        
        var graphic = new esri.Graphic(result.feature.geometry, sym); //create graphic with geometry (result.feature.geometry) and symbol (sym)
        
        map._layers.my_graphics_layer.add(graphic); //add graphic to graphics layer created above
        //OR
        //map.graphics.add(graphic); //add to map.graphics
    });
}

I didn't add attributes or an info template to the graphic object; both are optional.

Re: Why my graphics are not added to the map?

YvanBérard — Wed, 05 Dec 2012 19:51:41 GMT

Even this doesn't work....

I can see in my DOM object that my created layer( var mySearchLayer = new esri.layers.GraphicsLayer({ id: 'search_result' }); ) have all of my search result and their geometry, but they are still not showing.

What's wrong with that????

Re: Why my graphics are not added to the map?

BenFousek — Wed, 05 Dec 2012 19:55:56 GMT

I'm not sure. Zip up you app and post it or send it via a private message and I'll take a look.

Re: Why my graphics are not added to the map?

YvanBérard — Sun, 12 Dec 2021 01:44:47 GMT

I'm not sure. Zip up you app and post it or send it via a private message and I'll take a look.

After digging up my problem with Mr. Fousek (btfou), he found that my graphic are added to the map but with a totally wrong extent.

This is my original extent:

var initialExtent = new esri.geometry.Extent({ 'xmin': -8034661, 'ymin': 5652797, 'xmax': -8004182, 'ymax': 5670187, 'spatialReference': new esri.SpatialReference({ wkid: 102100 }) });

But, when the event add(graphic) is fired, the graphic are added in the middle of the mediterannean sea (?!?!?!???). How could this happen? I've never seen that bug.

var graphic = new esri.Graphic(result.feature.geometry, sym); //create graphic with geometry (result.feature.geometry) and symbol (sym)
        console.dir(map);
        map._layers.search_result.add(graphic); //add graphic to graphics layer created above