Elevation Profile Widget Version 2.17 - 9/19/2020

03-02-2015 06:56 PM
Labels (1)

Elevation Profile Widget Version 2.17 - 9/19/2020

Live Preview Site   

Web AppBuilder for ArcGIS | Help - Elevation Profile Widget

List of the latest enhancements and changes:

  1. Updated to WAB 2.17
  2. Fixed issue with using this widget in Tab Theme. Profile hiding the close button on the sidebar controller.
  3. Now when used in the Jewlerybox and tab theme it will open those controllers automatically.

Older enhancements or changes

  1. Added ability to select existing line features to profile.
  2. Added ability to choose which segment of the selected polyline to profile.
  3. Added setting to control elevation decimal precision.
  4. Fixed Issue with resizing widget and profile getting cut off.
  5. Moved all widget links to a widget menu instead.
  6. Added the ability to export Profile data to CSV file.
  7. Added the ability to flip the profiles direction of travel.
  8. Added support for doing profiles when basemap is not Web Mercator
  9. Added the ability to export the profile chart as an image (if you are not using Internet Explorer and your browser supports HTML5 Canvas).
  10. Added fix for Launchpad Theme UI issues


  • This is a port over of the Elevation Profile Template.
  • Some modifications have been done to prevent chart indicator text clipping
  • The chart display features like color, font size, etc are all configurable in the widget settings UI
  • Some validation is done on the profile task service url.
  • Full help documentation is provided for configuring and using the widget.



Labels (1)


   No none at all. My suggestion would be to downgrade to the 2.8 version


Thanks, Robert! Really appreciate all the great WAB widgets.



Seems to be Theme dependent.  OK button does not work on any themes that have the in panel widget button but I can add with a theme that only has header widgets and then change back to a theme with in panel and it will be in the header widget row there.  However using it from there the results chop off the bottom of the chart and the horizontal axis labels.  Hope you can get this worked out it would be very handy.


i want to display two selected lines profile on a same graph with different color. Please suggest me.

Not currently possible in this widget

Hi Robert, thanks for all your contributions. 

I am also blocked with the undefined _i18nLabels_featureAction_profileLine element in widgetJson.manifest when hitting Ok button to accept settings. I assume still a mystery why it works for some and not for others.

I'm new to custom widget development and framework as well as how this element is populated from widget files.  I hoping to get deeper and perhaps add a few additional features to the Elevation Profile widget.  This would include calculating running totals for elevation gained and loss and possible slope graph.

Yes I downgraded to your 2.8 version.


Looking at function addI18NLabelToManifest in utils.js it would appear that a widget needs _widgetLabel defined in <widget>\nls\strings.js in order to populate _i18nLabels_featureAction_<actionName> in widgetJson.manifest.

I added:

_widgetLabel: "Elevation Profile",



and I am able to add the Elevation Profile widget to my web app.

Perhaps there is more to the fix than what I found but I thought I would share what seems to have worked for me.



   Sweet. Obviously this is a bug in WAB as the _widgetLabel property is not suppose to be required. I see that in my other widgets that have custom widget actions they already have the _widgetLabel property. Thanks for the info.


Firstly, great widget. I set this up in an app for our zoning department and they love the tool! Going back to what Raviteja was asking above, I would like to change the default measurement units to Feet, not miles. I can't find anywhere in the widget folder, where I can make this customization. With other widgets I have incorporated into my apps, you can find the HTML code and make a change looking something like this within the unit options: <option value="Feet" selected="selected">${nls.unitsFeet}</option>

I am wondering within your widget if there is a way I can do this? I can't seem to find any place to make this change. I noticed in your response to Raviteja that you used the JS API Measurement Dijit for that portion of the widget. Do you think you could give me a little more background on this?

I found this piece of code in the Widget.js file that I think has to do with the Measurement Dijit:

I am specifically looking at lines 280 & 281. Do I just have to manipulate this piece of code to change the default unit settings?

Am I missing something? Any guidance you have would be greatly appreciated.

Thanks in advance.

Siona Roberts


   That is the exact place just change Units.MILES to Units.FEET

Not sure if the icon is missing or just black on black, thoughts?

Missing Icon in pop up




  Looks like a dark icon issue. I will have to look into this.

Hi Robert! Thanks for this wonderful widget. I tried to do a modification in the MouseIndicator but I did not get the expected result. I tried add a new MouseIndicator with a same properties that "indicatorProperties2" but with other offset and I can´t see the new MouseIndicator in the graph. Do I need to do another thing?

Thanks and best regards!! 

Each data series in the chart can only have one indicator. So if you wish to add another indicator you need to add another data series. The best route is to duplicate the water series with a different name.

Thanks a lot Robert!! 

hello everyone,

hope you are all safe.

I just want to check if the link is still working please


I'm not able to access it, is there a new link?

Thank you.

Robert Scheitlin, GISP‌ maybe Robert can help

Link still works. Just tested it.

I know I asked this question years ago, because I have it working in my current live site, but for the life of me I can't find the answer or figure it out.

I use the Tab Theme on my site and when I open the Elevation Widget it over-sizes the panel and removes the close button. I can't remember what I need to change to force it to stay in the default side of the sidebar-controller. Thanks Rob.


   The tab theme sidebar is not a great fit for this widget, but here is the fix:

      onOpen: function () {
        if (this.lastMeasure && this.measureTool) {
        var panel = this.getPanel();
        var pos = panel.position;
        if(this.appConfig.theme.name === 'TabTheme') {
          pos.width = 350;
          pos.width = 720;

This Widget is very nice and useful thanks.
I'll try to "tune" it, but perhaps am I not the only interested:

For me, this widget will be more interesting if there was the possibility to add 2 terrain models in order to do comparison, eg. between DTM and DSM
Best regards and thanks for this work

Hello again.

I've a small question: I wanted to "auto-start" the profil definition.

I means, auto-activate the measurement at startup.

I tried to call the "onMeasureClick" function/event at "onOpen", but it did not work.
Did I a stupid mistake or did I miss something? Any Idea how it could be done?

Best regards and thanks!

In the onOpen add this line:


Thanks very much!

Is it possible to modify this widget to exaggerate the vertical scale of the graph?

@MaxM  There is no exaggerate option in the profile task that this widget uses.

Hi. Can I select a custom elevation data when using the Elevation Profile widget? The widget always uses the ESRI maps elevation data default (24m in Australia). I have a High resolution Elevation data (15cm) available and I would like to use it.  I tried to change the URL of the DEM I have but always showed as invalid. The figure below is showing the default URL of the widget.



Any help?

Thanks in advance

Yes you can use your own elevation profile GP Service if it matches the esri services paramaters for input and output. Here is a 2014 Blog on my to produce your own service:



Thank Robert. Do you have a tutorial how to produce my own service using ArcGIS Pro? I' just allowed to use Pro... Cheers


I do not.

I'd like to use this Elevation widget in Web app builder 2.12, where I could download the widget?



@ZhujingXia ,

   Try using this version of the widget. If it does not work in 2.12 I can provide an appropriate link for you to download.

This great widget was working fine till yeasterday.

We updated Server/Portal to 10.8.1 (and experienced many problems for that).
Print wasn't working any more until we installed the patch.

But know the profile widget does not work any more :(


The Measurement Tool is not displaying (respectively is displayed for 1 second and then the widget goes blank).

I don't understeand the reason.

Does someone use it with 10.8.1 ?

We use WAB 2.13 (but did no change to it when installing 10.8.1)

Best regards and thanks.

JS console:

TypeError: Cannot set property '_newExtent' of null
at Object.<anonymous> (Measurement.js:83)
at init.js:64
at Object._successHandler (init.js:2312)
at Object._projectHandler (init.js:2697)
at init.js:64
at Object.load (init.js:2697)
at init.js:1064
at c (init.js:104)
at e (init.js:104)
at b.Deferred.resolve.callback (init.js:105) "TypeError: Cannot set property '_newExtent' of null\n at Object.<anonymous> (https://js.arcgis.com/3.29/esri/dijit/Measurement.js:83:416)\n at https://js.arcgis.com/3.29/init.js:64:337\n at Object._successHandler (https://js.arcgis.com/3.29/init.js:2312:478)\n at Object._projectHandler (https://js.arcgis.com/3.29/init.js:2697:213)\n at https://js.arcgis.com/3.29/init.js:64:337\n at Object.load (https://js.arcgis.com/3.29/init.js:2697:70)\n at https://js.arcgis.com/3.29/init.js:1064:139\n at c (https://js.arcgis.com/3.29/init.js:104:350)\n at e (https://js.arcgis.com/3.29/init.js:104:139)\n at b.Deferred.resolve.callback (https://js.arcgis.com/3.29/init.js:105:479)"
m @ init.js:115
PanelManager.js?wab_dv=2.13:83 panel [widgets_Measure_Widget_48_panel] created.
WidgetManager.js?wab_dv=2.13:115 widget [widgets/Measure/Widget] created.
WidgetManager.js?wab_dv=2.13:551 fail to open widget ElevationProfile. TypeError: Cannot read property 'navigationManager' of null
at Object._resetToolState (https://js.arcgis.com/3.29/esri/dijit/Measurement.js:76:441)
at Object.setTool (https://js.arcgis.com/3.29/esri/dijit/Measurement.js:56:458)
at Object.advice (https://js.arcgis.com/3.29/init.js:120:313)
at Object.c [as setTool] (https://js.arcgis.com/3.29/init.js:120:103)
at Object.onOpen (https://arcgis.geoguichet.ch/profile/widgets/ElevationProfile/Widget.js?wab_dv=2.13:305:20)
at Object.openWidget (https://arcgis.geoguichet.ch/profile/jimu.js/WidgetManager.js?wab_dv=2.13:549:18)
at Object.<anonymous> (https://arcgis.geoguichet.ch/profile/jimu.js/BaseWidgetPanel.js?wab_dv=2.13:169:30)
at Object.forEach (https://js.arcgis.com/3.29/init.js:71:486)
at Object.onOpen (https://arcgis.geoguichet.ch/profile/jimu.js/BaseWidgetPanel.js?wab_dv=2.13:167:13)
at Object.d (https://js.arcgis.com/3.29/init.js:198:400)
openWidget @ WidgetManager.js?wab_dv=2.13:551

Hello again.


I was auto-activating the nmeasurement tool with 


in onOpen().

Without that, I've no more JS error, but the widget shows empty/blank, so I guess there is a problem with dojo.measurement somewhere, but don't know what could have changed here with 10.8.1, if WAB is same


@GeoguichetGeoguichet , Each version of Portal uses a different version of WAB.


for example Portal 10.8.1 uses WAB 2.16. You should try to download the latest version of this widget.

Thanks very much Robert, I'll check the new version and see what did change (we did our own version in order to be able to use 2 differents models - DSM + DTM)

Hi @RobertScheitlin__GISP 


I have used the widget however, it prompts an error while creating the line on the widget which mentions on unable to execute the tool, and the elevation profile was not drawn.




Can you reproduce this issue in the Live Preview Site? Just stating that the widget gives and error and not posting the details of the error is not going to help.

Version history
Revision #:
1 of 1
Last update:
‎03-02-2015 06:56 PM
Updated by: