create line graphic in WAB

TerryGustafson · ‎08-26-2015

I'm wondering if anyone has generated a simpleLine Symbol in WAB. I'm wanting to pass a start and end location offset and return a line symbol from the entered values. does anyone know of an example out there to look at?

TIA

TerryGustafson · ‎08-31-2015

{

"displayFieldName": "",

"fields": [

{

"name": "OBJECTID",

"type": "esriFieldTypeOID",

"alias": "OBJECTID"

},

{

"name": "Corridor",

"type": "esriFieldTypeString",

"alias": "Corridor",

"length": 8

},

{

"name": "from_offset",

"type": "esriFieldTypeSingle",

"alias": "from_offset"

},

{

"name": "to_offset",

"type": "esriFieldTypeSingle",

"alias": "to_offset"

}

],

"features": [{ "attributes":{

"OBJECTID": 1,

"Corridor": "C000001E",

"from_offset": "100.59",

"to_offset": "256.236"

}}],

"exceededTransferLimit": false

}

I had to change this a little and it does appear to be working.

TerryGustafson · ‎08-31-2015

I'm still struggling on how I get the values from the textboxes on my html page passed to the GP service.

RobertScheitlin__GISP · ‎08-31-2015

Terry,

That is as simple as using some code like this in your Widget.js

var fromOffset = this.fromOffsetTextBox.get('value');

TerryGustafson · ‎08-31-2015

So I have the _onreturnsegclicked button with the following code. So would I create a function to create the graphic line after the GP service has run? Here is my intial try

executeGP: function (rs) {
                this.shelter.show();
                this.map.graphics.clear();
                var lineSymbol = new SimpleLineSymbol();
                lineSymbol.setColor(new Color([255,255,0,0.5]));
                lineSymbol.setWidth(2);
                var graphic = new Graphic(rs.mapSegment, lineSymbol);
                var features = [graphic];
                var featureSet = new FeatureSet();
                featureSet.features = features;
                this.gp.submitJob(params, lang.hitch(this, this.processGP));
            },
            _onreturnsegClicked: function () {
                var Corridor = this.CorridorTextBox.get('value'),
                    var FromOffset = this.fromOffsetTextBox.get('value'),
                        var ToOffset = this.toOffsetTextBox.get('value'),
                            RouteSeg = new RouteSeg(Corridor, FromOffset, ToOffset),
                            rs = {
                                mapSegment: RouteSeg
                            };
                this.executeGP(rs);
            },

TerryGustafson · ‎08-31-2015

I’m still struggling understanding the errors in brackets. Here is a picture of the errors. It says missing a space but even if I put the space in there the error remains.

TerryGustafson · ‎09-01-2015

I was able to clean some of this up, but still don't understand the beginning errors. 'define' was used before it was defined. also the expected 'dojo/_base/declare' at column 5, not column 9. What does that mean? The last thing I was wondering was errors used to show up where "defines" were not needed. Like I'm not using the "'jimu/dijit/TabContainer'"

return declare([BaseWidget], {
            // Custom widget code goes here
            baseClass: 'jimu-widget-CreateRouteSegment',
            //this property is set by the framework when widget is loaded.
            //name: 'CreateRouteSegment',
            //methods to communication with app container:
            postCreate: function () {
                this.inherited(arguments);
                this.gp = new Geoprocessor("https://app.mdt.mt.gov/arcgis/rest/services/LRS/ReturnRouteSegment/GPServer/ReturnRouteSegment");
            },
            _bindEvents: function () {
                this.own(on(this.returnseg, "click", lang.hitch(this, this._onreturnsegClicked)));
                this.own(on(this.returnsegclear, "click", lang.hitch(this, this._onclearClicked)));
            },
            startup: function () {
                this.inherited(arguments);
            },
            onClose: function () {
                this.mapClickEvt.remove();
            },
            executeGP: function (rs) {
                this.shelter.show();
                this.map.graphics.clear();
                var lineSymbol = new SimpleLineSymbol(),
                    SimplelineSymbol.setColor(new Color([255, 255, 0, 0.5])),
                    SimplelineSymbol.setWidth(2),
                    graphic = new Graphic(rs.mapSegment, lineSymbol),
                    features = [graphic],
                    featureSet = new FeatureSet(),
                    featureSet.features = features,
                    var params = {
                        "Route_Points": featureSet,
                        "Route_Points_Events1 ": {
                            "esriGeometryPolyline": true,
                            "HasZ": "false",
                            "HasM": "true"
                        },
                        "Keep_only_the_closest_route_location": false
                    };
                this.gp.submitJob(params, lang.hitch(this, this.processGP));
            },
            _onreturnsegClicked: function () {
                var Corridor = this.CorridorTextBox.get('value'),
                    FromOffset = this.fromOffsetTextBox.get('value'),
                    ToOffset = this.toOffsetTextBox.get('value'),
                    RouteSeg = new RouteSeg(Corridor, FromOffset, ToOffset),
                    rs = {
                        mapSegment: RouteSeg
                    };
                this.executeGP(rs);
            },
            _onclearClicked: function () {
                this.map.graphics.clear();
                this.CorridorTextBox.set("value", "");
                this.fromOffsetTextBox.set("value", "");
                this.fromOffsetTextBox.set("value", "");
            }
        });
    });

RobertScheitlin__GISP · ‎09-01-2015

Terry,

In many of my widget you will find this:

/*global define, console, setTimeout, clearTimeout*/
define(['dojo/_base/declare',

Line 1 tells JSHint that define, console, setTimeout, and clearTimeout are all globals that can be ignored and to not present an warning about them. Now if you don't use any of those in your code except define then remove the others and only include the ones you use.

The "expected 'dojo/_base/declare' at column 5, not column 9" means the you indenting is off you should be able to use beautify to fix this.

If you have a require for "'jimu/dijit/TabContainer'" and then define a var for it by having

"'jimu/dijit/TabContainer'"],
function (TabContainer

Then technically the require is used and you will not be warned that it is not used.

TerryGustafson · ‎09-01-2015

Ok, that makes sense.. I only have a few errors now, but wondering why it says stopping scanning(61% scanned)? I opened the console to attempt to debug it and it crashes with a couple errors. My problem is I don’t know where to set the break points to try and find out where the issue is.

RobertScheitlin__GISP · ‎09-01-2015

Terry,

Zip-up your whole widget folder and post and I will see if I an help diagnose.

TerryGustafson · ‎09-01-2015

I posted it above. The widget is called create route segment. Thank you.. In the past when I have debugged I had to open the widget to see the widget.js file in the console. When I try it with this widget it throws an error and I cant even see the widget.js file to set a break point.