nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Elevations Profile Template

MathewSuran

Can anyone help me pull the Elevations Profile Charting function from the template so I can utilize its function in our own custom js web app? I can't seem to get it to work. Also, I need to be able to edit where the chart pulls the x,y data. Right now it accesses the Profile geoprocessing service (http://www.arcgis.com/home/item.html?id=3300cfc33ca74a9fac69d2e0f4ea46e5) (per the read me file in the zip). I need it to access our own elevation data in a gdb we are hosting on our server. If there is an easier way to incorporate that chart functionality, I am open to suggestions. Thanks in advance!

Mat

タグ付けされた投稿をもっと見る

Accepted answers

All comments

Nicole_Ueberschär

Hi Riyas Deen,

I was looking for the possibility to replace the elevation widget by rscheitlin‌ by the functionality of the elevation template and I think you are giving here the solution. Unfortunately I am not sure where to put what. Can you tell me which part (or the whole js folder?) of the js folder should go into my app's js folder? And where do I call it's functionality?

I am using WAB2.4 and know how to add widgets like the elevation widget or enhanced search widget but this looks a bit different. Thanks in advance!

RiyasDeen

After thought

May be is this what you want?

Format Popup Content | Guide | ArcGIS API for JavaScript (look for Template that references a related field and uses it in a chart: at the end)

RiyasDeen

Hi Mathew,

The elevation profile chart in the template is a dijit widget.

You can get this widget by extracting this folder elevation-profile-template/js/ElevationsProfile at master · Esri/elevation-profile-template · GitHub from git hub and placing it in your js folder.

Call the widget in you application similar to how it's done in elevation-profile-template/main.js at master · Esri/elevation-profile-template · GitHub , below region which does the work.

Note: namespace application is resolved to js folder in elevation-profile-template/index.html at master · Esri/elevation-profile-template · GitHub

// ===========================================================================================//
// ELEVATIONS PROFILE PARAMETERS //
var profileParams = {
  map: this.map,
  profileTaskUrl: this.config.helperServices.elevationSync.url, // Place your GP task url here.
  scalebarUnits: this.config.scalebarUnits
};


// ELEVATIONS PROFILE //
var elevationsProfile = new ElevationsProfile(profileParams, dom.byId('profileChartNode'));
// SEND ERRORS TO THE CONSOLE //
elevationsProfile.on("error", console.warn);
// ENABLE/DISABLE MAP EVENTS WHEN USER IS DRAWING WITH MEASUREMENT DISTANCE TOOL //
elevationsProfile.on("measure-distance-checked", lang.hitch(this, function (evt) {
  if (evt.checked) {
  connect.disconnect(this.clickEventHandle);
  this.clickEventHandle = null;
  } else {
  this.clickEventHandle = connect.connect(this.map, "onClick", this.clickEventListener);
  }
}));
// STARTUP THE DIJIT //
elevationsProfile.startup();
// ===========================================================================================//

As long as your GP task response is similar to response mentioned here Profile—ArcGIS REST API: Elevation Analysis services | ArcGIS for Developers you should be good.

Hope this helps.

MathewSuran

Thanks for the quick suggestion. As you can see from my other post, I have a gdb relationship class that I want to be able to query and have the results be displayed in a popup and the elevation chart. I assume I can just use the elevation and distance fields in the table that the chart uses. I don't need to use any of the other functions of the dijit and don't need elevation data anywhere other than querying the features. The chart is perfect for how I want to display the data.

JohnGrayson

Matt,

there are two issues you want to address: 1) using your own elevation data, and 2) using the charting component of the dijit in other js web apps. For the first item you should check out this blog, it explains how to set up a service with your own data that the template can use:

Setting up your own Profile Service | ArcGIS Blog

The second issue can be complicated depending on what you need. Do you just want to reuse the entire dijit (Measure, Popup selection, calling GP service, unit conversions, charting, map interactions, etc...) or just the charting? If you want to reuse the entire dijit, then it should be simple and I can help you with this. If you want just the charting alone then it will be much more complicated and eventually it might not help you much since there are many other considerations to take into account before the data can be charted.

会話に参加する

サインインしたメンバーは投稿、更新のフォローなどができます。初めてですか？無料アカウントを登録してください。

クイックリンク

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.