Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

Using ArcGIS API for JavaScript 2.5 I am trying to draw a path on an esri map. with circles like so, but when I call Polyline.insertPoint it doesn't show the new segment:
path image

I keep adding points as time progresses. My implementation is to have a Graphic object with a Polyline geometry and a SimpleLineSymbol. I call the Polyline's insertPoint method when I need to add a segment. The problem I'm coming across is that when I call insertPoint, the point point is added to the array, BUT doesn't color in the line. The interesting thing is that if I remove the graphic from the graphics layer and then add it back on, then the new line segment shows up. This would be sufficient, except I need to have circles drawn on top of the line, so when I remove+add the Polyline it is drawn on top of the circles.

So in my current implementation every time I add a line point, I have to:

  1. Call Polyline.insertPoint
  2. Remove then add the graphic from the graphics layer
  3. Remove + add all the circles on the path (because they just got hidden from the above action)

The problem with the above steps is that the line and circles flash on and off during this process which is very undesirable.

I feel like I am using the graphic objects provided by esri incorrectly because it's so hard to accomplish a seemingly easy task. Do you have any suggestions on an alternative implementation that has a good probability of not having these same graphical artifacts that I'm experiencing?

share|improve this question
Have you tried forcing the graphics layer to refresh? Does hiding/showing work the same as the three steps above? Maybe re-setting one of the layers properties (e.g. opacity) might do it as well. – Anthony -GISCOE- Dec 29 '11 at 14:52
A GraphicsLayer object doesn't have show/hide functions, it does have 'setOpacity', I will try and change that and see if it does – Jose Dec 29 '11 at 16:28
Looking at the API, GraphicsLayer extends Layer, which has show/hide. (I haven't tried it, but it should work.) There is also setVisibility which might solve the problem, too. – Anthony -GISCOE- Dec 29 '11 at 20:16
up vote 1 down vote accepted

The best way to make this work is to update your geometry and then set the geometry for your graphic. After a graphic's setGeometry method is called, the graphic will update.

If everything worked as it should, you would call insertPoint on your polyline and then pass your polyline to your graphic's setGeometry method. That being said, your use case uncovered a bug in insertPoint. The current implementation(version 2.6 of the API) won't let you insert a point on the end of a path. The best workaround is to use addPath. The code would look like this:

// add a polyline, line and lineGraphic are global
var p1 = esri.geometry.geographicToWebMercator(new esri.geometry.Point(-100, 40, map.spatialReference));
var p2 = esri.geometry.geographicToWebMercator(new esri.geometry.Point(-90, 40, map.spatialReference));
line = new esri.geometry.Polyline();
line.addPath([p1, p2]);
lineGraphic = esri.Graphic(
  new esri.symbol.SimpleLineSymbol()
dojo.connect(map, "onClick", addPt);

And the body of the addPt function:

  [e.mapPoint.x, e.mapPoint.y]

Here's a working example: Click the map to extend the line. We will (hopefully) fix this bug in the next release of the API, which is 2.7.

share|improve this answer
awesome, that is not too bad a work-around. Thank you! I thought I was going to have to resort to voodoo. – Jose Jan 13 '12 at 22:43
no voodoo required! – Derek Swingley Jan 14 '12 at 0:10

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.