Customizing the Draw widget

Question

I plan to customize the Draw widget that default from web AppBuilder, I plan to do is copy code from Clip and ship | ArcGIS API for JavaScript to the existing Draw widget, however, I didn't make it working.

How can I add the function in the "require" (from the HTML) into the "function" (stemapp\widgets\Draw\Widget.html), I tried to add them in the front, however, I kept getting the message "can not create widget" when re-starting the app. Has anyone have experiences?

I looked at the page from the tutorial: Create a custom in-panel widget—Web AppBuilder for ArcGIS (Developer Edition) | ArcGIS for Developers ,

Is there a better way to show my change for the application? currently I am doing is first remove the draw widget from the edit and then add a new one, however, it is kind of slow.

Look forward to hearing from you.

Peter

Widget.html.zip

ExtractData.html.zip

Clip_212.jpg

LinesInFloodDepthRaster.png

aec-community-email-image-primary_Esri AEC Community.jpg

Promo Slide2.jpg

PingYang · Answer

Never mind,

I think now it is working, instead use button, I copied from the eDraw example

and add the extratData function in the Widget.js but I didn't included 'dijit/form/Button' because there is no require keywork anymore.

I am kind of still struggling in simplifying the eDraw example widget this time. What I plan to do is not that complex but:

1) Draw polygon on the map

2)Turn the draw result (graphics) into feature set(I have seen some code like this:

var featureSet = new FeatureSet();
var features = [];
features.push(map.graphics.graphics[0]);
featureSet.features = features;

However I couldn't figure out how can I accommodate this code into the existing example.

Has anyone done this before?

Thank you all for so many help.

PingYang · Answer

Qun Sun​

I checked the resources that from the eDraw widget

and follow your suggestions, however, I still have the problem.

How can I the follow the spec that you mentioned(where can I find them, for e.g., if I want to add a button to the widget, how many step I should go through)?

Thanks,

QunSun · Answer

Ping, I download your Widget.html.zip file. Widget.html is the template file of Widget. You should follow the spec about how to develop template-based dijit. 1. You edit Widget.html, but it is not intact. The whole Widget.html should in only one root element, such as

tag. In your Widget.html, it begins with

tag, but it doesn't end with

. So It is an invalid Widget.html and dojo can't parse it. 2. You should not write any JavaScript in Widget.html. So