topic Re: Add the textSymbol to the center of polyLine in ArcGIS JavaScript Maps SDK Questions

Add the textSymbol to the center of polyLine

SunilKalagata — Fri, 19 Dec 2014 09:43:24 GMT

Hi,

I would like to print a textSymbol on center of the ployLine using the Longitude and Latitude.

I Have written the below code, but Unable to print the textSymbol.

var labelGraphic = null;

var startX = lLong[0];// These are string values

var endX = lLong[lLong.length-1];

var startY= lLat[0];

var endY = lLat[lLat.length-1];

var midPointX = ((endX - startX) / 2);

var midPointY = ((endY - startY) / 2);

var font = new Font("12px", Font.STYLE_NORMAL, Font.STYLE_NULL, Font.VARIANT_NORMAL, Font.WEIGHT_NULL, "Arial");

var pipePoint = new Point(((parseFloat(lLong[0]))+midPointX ) , ((parseFloat(lLat[0]))+ midPointY), map.spatialReference);

// create a text symbol

var textSymbol = new TextSymbol("LABEL TEXT!!!", font, new Color([0, 0, 0]));

labelGraphic = new Graphic(pipePoint, textSymbol);

if (labelGraphic != null)

map.graphics.add(labelGraphic);

Please help me how to add the textSymbol to the polyline.

Re: Add the textSymbol to the center of polyLine

HeikoHeijenga — Fri, 19 Dec 2014 16:25:21 GMT

Try to use the midpoint formula:

(this of course only works if you're dealing with straight lines)

Re: Add the textSymbol to the center of polyLine

SunilKalagata — Mon, 22 Dec 2014 13:26:09 GMT

Thankyou for help. But here my polyLine is dynamically changes the direction. I want to display the text along with the line. How do I do that?

Even I tried with

textSymbol.setVerticalAlignment()/ setHorizontalMethods also.

Re: Add the textSymbol to the center of polyLine

HeikoHeijenga — Mon, 22 Dec 2014 16:15:11 GMT

Calculate the angle of the line and set the rotation of the text symbol accordingly.

Re: Add the textSymbol to the center of polyLine

SunilKalagata — Tue, 23 Dec 2014 10:59:06 GMT

Is there any example to calculate the PolyLine angle?

Re: Add the textSymbol to the center of polyLine

HeikoHeijenga — Tue, 23 Dec 2014 15:41:37 GMT

Are your lines straight lines or real polylines?

Re: Add the textSymbol to the center of polyLine

SunilKalagata — Wed, 24 Dec 2014 04:45:01 GMT

Real polylines, we are drawing those using latitude and longitude.

Re: Add the textSymbol to the center of polyLine

TyroneLigon — Wed, 24 Dec 2014 13:32:44 GMT

I got this from an earlier post and used it to place an "arrow" (actually the letter "V") at the center of a polyline. Using your variables:

var rise = endX - startX;

var run = endY - startY;

var angle = (180/Math.PI) * Math.atan2(run,rise);

...

textSymbol.angle = angle;

Re: Add the textSymbol to the center of polyLine

SunilKalagata — Fri, 26 Dec 2014 08:30:47 GMT

Hi Tyrone,

Thank you for your update. But here I am using Latitude and Longitude to draw my polyLine.

Please help us to find the angle for PloyLine.

Thankyou!!

Re: Add the textSymbol to the center of polyLine

JoshHevenor — Mon, 29 Dec 2014 13:24:47 GMT

You can convert lat/long to XY

esri/geometry/webMercatorUtils | API Reference | ArcGIS API for JavaScript

You might consider using a label layer instead?

Re: Add the textSymbol to the center of polyLine

HeikoHeijenga — Tue, 30 Dec 2014 00:31:42 GMT

A polyline doesn't have an angle, only a straight line does. But a polyline is made up of smaller straight line segments. Find the segment where you want to place the symbol and calculate it's angle.