Measure Widget 2.15 for Web App Builder

57646
310
02-17-2015 11:42 AM
Labels (1)

Measure Widget 2.15 for Web App Builder

Latest update:

02/11/2020 - fixed a change in the API that altered the way points were counted in path polylines and ring polygons.  Thanks Robert Scheitlin!
           - also updated css to fix issue with trash can icon.  Thank you Robert!
           - updated the editing as the event handlers had also changed in the API.  TODO: found esri bug on edit toolbar that creates a  ghost vertex as the last vertex.  This creates issues when editing a polyline or polygon.05/04/2017 - added functionality to display an interactive polyline total when drawing two or more segments.

03/30/2017 - tested with WAB 2.4. Fixed bug with editing measures.

08/19/2016 - added logic to calculate bearing for each segment for polyline and polygon geometries.  Minor bug fixes and tested with WAB 2.1.

02/16/2016 - updated logic to use the abbreviation on measurement labels.

02/12/2016 - added checkbox to display summary measurement labels.  Fixed problem that was leaving a 0.0 measurement when finishing a line.

12/16/2015 - verified widget to work with WAB 1.3 and added nautical miles to the dropdown list for distances

10/13/2015 - added help page and editing for some geometry types (line, polyline and polygon)

09/30/2015 - updated to remove unnecessary logic for IE - NIM094815: The mouse-drag event now works correctly using IE10 and IE11.

09/29/2015 - updated the widget to use better calculations for area and length, especially for basemaps using a projected coordinate system

09/09/2015 - upgrade to new release of WAB 1.2

             fixed problem with CSS that was corrupting apps at 1.2

04/06/2015 - upgrade to new release of WAB 1.1

             use new JSAPI scaleUtils to get map units

             added logic for Internet Explorer to measure all geometry types

             updated offset for mobile on certain geometry types

03/04/2015 - stacked area measurements

               added logic for calculating map units

               added ability to change measure text size and color

02/24/2015 - added logic for using on iPad, iPhone and Android devices

               added logic for stopping popups

02/18/2015 - removed the last measure from the freehand polygon tool

02/17/2015 - fix problem with perimeter measurement

02/17/2015 - Initial release created from the draw widget.

Demo of Measure Widget

The example above will demonstrate the measure widget.  A feature layer has been added to the map so you can also see how snapping works.  You can hold the CTRL key when measuring a feature and it will snap to the closest nodes.

Logic has been added to allow the widget to be used on mobile devices.  It has been tested on an iPad and iPhone.  An Android device was not available for testing.  Polygon and polyline measures just use tap locations to provide segment measurements.  All other measures are more interactive on mobile devices.

The measure widget for WAB is my first attempt at converting the widget I had creating for the FlexViewer into the WAB context.  It gives interactive measures for segments and drawn elements as they are being drawn. This widget is derived from the draw widget. This was very useful for the folks in our planning department, which is what made me create the widget originally.

There are new measures for some of the other draw types.  I am not sure that all of them will be as useful as the measures for the polygon and polyline measures.

The widget now allows editing for some geometry times.  Lines, polylines and polygons are now editable.  You can click on a drawn measure graphic and put it in edit mode.  Drag the vertex points to new locations and the widget will interactively update the measurements.  You can also change the color, fill color, line type, text color and text size of a graphic in edit mode.  Note: Does not work on IE or iOS.  The edit function turns off mouse events on IE and iOS, so there is no way to track the measurement.

Regards,

Tom

Labels (1)
Attachments
Comments

Tom,

Thank you for the BEST measure widget available!  I have this widget included in all of my web apps.  Yesterday a user contacted me that they were having issues with Acres and Total length printing on top of each other.  I jumped out here to see if others have had this issue and I see that last fall there were a couple posts with the same issue.  This is the link to one of my public facing GISVIEWER sites with this widget installed.  It is built on WABDV 2.17 and the measure widget version from the manifest is "version": "2.4", I believe this to be the latest, I downloaded a new version just now and the manifest files match.  I'm using the standard print widget from esri with a few mods. 

I should also  point out this is only happening when the shape drawn is a closed feature like a polygon.  I tested in Chrome and Firefox and both yielded the same result.  Do you have any advice on how to fix this issue or maybe remove the total distance value so that only acres is shown and prints?  Acres/area are the important thing for my users to see.

Thanks in Advance!

-norm

Hi Tom,

I am experiencing the problem of Area and Total distance overwriting each other on printouts when creating polygons and printing with the ESRI print widget.  I am seeing this on all my apps and am experiencing it with Chrome and Firefox.

Is there a quick way to disable drawing the total distance label as a workaround for my users?  They are concerned with Area only and I don't want to add a second measure/draw widget to do this for them.

Right now my workaround is to have them take screen snips with the windows snipping tool.

Thanks for all your hard work on this!  It's the best measure tool going!!

Here is link to one of my sites.

-norm

This is an awesome widget.  Thanks so much.  For some reason the trash icon (shows a red box with a small white outlined box inside it) and the HELP shows a box outline only) icon aren't showing.  Can you advise?  I am not a coder.  With advise i may be able to open the code and change something. Thanks so much! 

This is a very helpful widget. Thank you Tom! Could you advise how to remove the Help icon from the widget? Also, as the user mentioned above, the delete option only shows a red box with a small white outlined box. 

Dear Tom,

Thanks for the tool, today one of our end users, looking for the "text" icon, if he wants to place his desired text apart from the measure distance. Could you please add it here or advise me if there is already separate tool or widget for that.

Aneel_Kumar_M_0-1655300463520.png

thank you,

I love this!! Thanks so much. It doesn't add the drawing as an operational layer but everything else is exactly what several of my users asked for. Again, thanks!!

Tom,

Where in the code can I change the displayed length and area values (specifically in miles) to show multiple decimal points? Right now by default it only goes out to 1 decimal point:

Thanks!

smevans88_0-1659106982735.png

 

 

******EDIT**********FOUND SOLUTION******

I found the fix for this. For anyone who is trying to accomplish this, you need to go into the main 'Widget.js' file for the tool. Find the instances in the code that say "toFixed(1)"

Change the (1) to (2), or any number. This will change the decimal places that are seen in the measure display shape.

 

smevans88_0-1659107676408.png

 

Hi,

Is there a way of adjusting the number of decimal places that the measure tool uses?

We would ideally like to get to an accuracy of 0.001 miles.

Thanks

Andy

Andy,

See my post just above yours. I had the same question, and then figured out the solution.

Scott

Hello!

This is a great widget! Just what my group wanted. I've installed it on WABDV 2.25. It's calculating the correct measurement but the unit label always says "undefined." I've done some digging around but nothing jumped out to me. Does anyone have an idea of what's happening? Thanks!!

measurewidget.png

Version history
Last update:
‎02-17-2015 11:42 AM
Updated by:
Contributors