topic Re: GP service in Web AppBuilder Custom Widgets Questions

GP service

TerryGustafson — Wed, 19 Aug 2015 15:37:25 GMT

I'm trying to use a gp service to return a point and values from a gp service and can't seem to get the define point to return. Can anyone help?

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>Geometry Service: Relation</title>

    <link rel="stylesheet" href="http://js.arcgis.com/3.14/esri/css/esri.css">

    <style>
      html, body, #mapDiv {
        height: 100%;
        margin: 0;
        padding: 0;
        width: 100%;
      }
      #info {
        bottom: 20px;
        color: #444;
        height: auto;
        font-family: arial;
        left: 20px;
        margin: 5px;
        padding: 10px;
        position: absolute;
        text-align: left;
        width: 200px;
        z-index: 40;
      }
      .label {
        display: inline-block;
        width: 4em;
      }
    </style>

    <script src="http://js.arcgis.com/3.14compact/"></script>

    <script>


    var map, gp;

      require([ "dojo/dom",
                "dojo/_base/array",
                "dojo/promise/all",
                "dojo/json",
                "esri/map",
                "esri/domUtils",
                "esri/graphic",
                "esri/graphicsUtils",
                "esri/geometry/Point",
                "esri/SpatialReference",
                "esri/tasks/GeometryService",
                "esri/tasks/Geoprocessor",
                "esri/tasks/FeatureSet",
                "esri/tasks/RelationParameters",
                "esri/Color", "esri/symbols/SimpleLineSymbol",
                "esri/symbols/SimpleMarkerSymbol",
                "esri/symbols/SimpleFillSymbol",
                "esri/config",
                "esri/request", "dojo/domReady!"
                ],

        function(
        dom, array, all, JSON,
        Map, domUtils, Graphic, graphicsUtils,
        Point, SpatialReference, GeometryService, Geoprocessor,
        FeatureSet, RelationParameters,
        Color, SimpleLineSymbol,
        SimpleMarkerSymbol, SimpleFillSymbol,
        config, Request) {


        var geometryService, geometries, baseGraphics;

        map = new esri.Map("mapDiv", {
          basemap: "topo",
          center: [-111.185, 46.052],
          zoom: 15
        });

        map.on("click", executeGP);

        gp = new Geoprocessor("http://app.mdt.mt.gov/arcgis/rest/services/LRS/LocateFeaturesOnDCandRM/GPServer/Locate%20features%20along%20DC%20and%20RM");

        gp.setOutputSpatialReference({
            wkid: 102100

        })




        function executeGP(run){
            map.graphics.clear();
            var pointSymbol = new SimpleMarkerSymbol();
            pointSymbol.setSize(14);
            pointSymbol.setOutline(new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color([255, 0, 0]), 1));
            pointSymbol.setColor(new Color([0, 255, 0, 0.25]));

            var graphic = new Graphic(run.mapPoint, pointSymbol);
            map.graphics.add(graphic);

            var features = [];

            var featureSet = new FeatureSet();
            featureSet.features = features;

            var params = {

                "f": json,
                "outSR" : 102100,
                "City_Centers" : featureSet,
                "geometryType" : esriGeometryPoint,
                "features" : [{
                "geometry" : {
                "x": -12180856.426452411,
                "y": 5952832.259593694,
                "spatialReference": {
                "wkid": 102100
                                    }
                             }
                             }],

                "sr": {
                    "wkid": 102100
                }

                "Search_Radius": {
                    "distance": 50,
                    "units": esriFeet
                }

                "Keep_only_closest_route_location": false
                //'distance_field': true,
                //'zero_length_events': true,
                //'in_fields': true,
                //'m_direction_offsetting': true
            };

            gp.submitJob(params, processGP);

            function processGP(jobInfo){
            gp.getResultData(jobInfo.jobId, "LRM_DC_RM_MI1", renderResult);

            };

            function renderResult(result, message){
            alert(result);
            };

    </script>

</head>

<body class="claro">
    <div id="mapDiv"></div>
    <div id="LatLng" >
        Enter the lat/long:

    </div>
</body>
</html>

Re: GP service

RobertScheitlin__GISP — Sun, 12 Dec 2021 06:30:56 GMT

Terry,

Lots of little syntax issues that a full fledged IDE would have caught.

<!DOCTYPE html>
<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <!--The viewport meta tag is used to improve the presentation and behavior of the samples
      on iOS devices-->
  <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
  <title>Geometry Service: Relation</title>

  <link rel="stylesheet" href="http://js.arcgis.com/3.14/esri/css/esri.css">

  <style>
    html,
    body,
    #mapDiv {
      height: 100%;
      margin: 0;
      padding: 0;
      width: 100%;
    }

    #info {
      bottom: 20px;
      color: #444;
      height: auto;
      font-family: arial;
      left: 20px;
      margin: 5px;
      padding: 10px;
      position: absolute;
      text-align: left;
      width: 200px;
      z-index: 40;
    }

    .label {
      display: inline-block;
      width: 4em;
    }
  </style>

  <script src="http://js.arcgis.com/3.14compact/"></script>

  <script>
    var map, gp;

    require(["dojo/dom",
        "dojo/_base/array",
        "dojo/promise/all",
        "dojo/json",
        "esri/map",
        "esri/domUtils",
        "esri/graphic",
        "esri/graphicsUtils",
        "esri/geometry/Point",
        "esri/SpatialReference",
        "esri/tasks/GeometryService",
        "esri/tasks/Geoprocessor",
        "esri/tasks/FeatureSet",
        "esri/tasks/RelationParameters",
        "esri/Color", "esri/symbols/SimpleLineSymbol",
        "esri/symbols/SimpleMarkerSymbol",
        "esri/symbols/SimpleFillSymbol",
        "esri/config",
        "esri/request", "dojo/domReady!"
    ],

      function (
        dom, array, all, JSON,
        Map, domUtils, Graphic, graphicsUtils,
        Point, SpatialReference, GeometryService, Geoprocessor,
        FeatureSet, RelationParameters,
        Color, SimpleLineSymbol,
        SimpleMarkerSymbol, SimpleFillSymbol,
        config, Request) {

        var geometryService, geometries, baseGraphics;

        map = new esri.Map("mapDiv", {
          basemap: "topo",
          center: [-111.185, 46.052],
          zoom: 15
        });

        map.on("click", executeGP);

        gp = new Geoprocessor("http://app.mdt.mt.gov/arcgis/rest/services/LRS/LocateFeaturesOnDCandRM/GPServer/Locate%20features%20along%20DC%20and%20RM");

        gp.setOutputSpatialReference({
          wkid: 102100
        })

        function executeGP(run) {
          map.graphics.clear();
          var pointSymbol = new SimpleMarkerSymbol();
          pointSymbol.setSize(14);
          pointSymbol.setOutline(new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color([255, 0, 0]), 1));
          pointSymbol.setColor(new Color([0, 255, 0, 0.25]));

          var graphic = new Graphic(run.mapPoint, pointSymbol);
          map.graphics.add(graphic);
          //You need to add the graphic to the features array
          var features = [graphic];

          var featureSet = new FeatureSet();
          featureSet.features = features;

          //you had several param attributes that were suppose to be strings like json and esriFeet
          //You also had stuff in your params that your GP service was not expecting and your
          //Keep_only_closest_route_location was not the correct name.
          var params = {
            "f": "json",
            "outSR": 102100,
            "City_Centers": featureSet,
            "Search_Radius": {
              "distance": 50,
              "units": "esriFeet"
            },
            "Keep_only_the_closest_route_location": false
          };

          gp.submitJob(params, processGP);

          function processGP(jobInfo) {
            gp.getResultData(jobInfo.jobId, "LRM_DC_RM_MI1", renderResult);
          };

          function renderResult(result, message) {
            console.info(result);
          };
        }
      });
  </script>

</head>

<body class="claro">
  <div id="mapDiv"></div>
  <div id="LatLng">Enter the lat/long:</div>
</body>

</html>

Re: GP service

TerryGustafson — Wed, 19 Aug 2015 16:35:13 GMT

I have it open in brackets and note ++ but for some reason it does not see the syntax errors..

Re: GP service

RobertScheitlin__GISP — Wed, 19 Aug 2015 16:51:22 GMT

Strange. Anyway I had to add lines 132 and 133 because you did not have any matching (Paired) in your code. When you select a bracket or a curly brace in "Barckets" or Notepad++ it will highlight the matching one in the code if there is one.

Don't forget to mark this as answered.

Re: GP service

TerryGustafson — Wed, 19 Aug 2015 17:31:29 GMT

Sorry Robert, I’m a slow learner.. So I must have something wrong with the “Search_Radius” as when I comment out

/**"Search_Radius": {

"distance": 50,

"units": "esriFeet"

"Keep_only_the_closest_route_location": false**/

it works fine. But with that code in there it does not return the map. When I zoom it close and click on the map it returns the correct data for that point.

Re: GP service

RobertScheitlin__GISP — Wed, 19 Aug 2015 17:49:24 GMT

Terry,

I have no idea where I should be clicking to get any results. The code I provided (unchanged) does run the GP, but the returned features is always 0.

Re: GP service

TerryGustafson — Wed, 19 Aug 2015 17:54:53 GMT

Huh, I can’t get it to run unless I remove that portion. Then if I zoom in really close and select a route it does return the correct values.. What browser are you running it in?

http://app.mdt.mt.gov/arcgis/rest/services/LRS/LocateFeaturesOnDCandRM/GPServer/Locate%20features%20along%20DC%20and%20RM/jobs/jd16fdc7086cf4c30999292ec2330e538/results/LRM_DC_RM_MI1?f=json&returnType=data

If I use the jsonLint it shows the route.

Re: GP service

RobertScheitlin__GISP — Wed, 19 Aug 2015 18:17:36 GMT

Terry,

My preferred browser is FireFox.

Re: GP service

TerryGustafson — Wed, 19 Aug 2015 21:57:54 GMT

I tried to convert the code into my own widget. When I open the widget I get a “create widget error:” I have tried finding what else I need to change. Here is a copy of my widget.js file for my custom widget.

What am I missing?

Re: GP service

RobertScheitlin__GISP — Wed, 19 Aug 2015 22:31:29 GMT

Terry,

You need to get the Interactive Linter plugin for brackets by Miguel Casillo so that you can see all these problems (24 in total). I would also recommend the Beautify plugin by Drew Hamlett

Re: GP service

TerryGustafson — Wed, 19 Aug 2015 22:59:42 GMT

ok I will try and download them and see what I can find. Thank you..

Re: GP service

RobertScheitlin__GISP — Thu, 20 Aug 2015 03:27:52 GMT

Terry,

Here is a starting point for you. I have taken your code and re-coded using WAB widget coding conventions and added some code to add and remove the map click event based on if the widget is open or not. I personally would not use a map click event I would look at using the jimu drawbox dijit. I still don't know where to click in the map to get some actual results so I can help much there, but the GP is firing and running fine.

Re: GP service

TerryGustafson — Thu, 20 Aug 2015 12:29:51 GMT

Thank you so much!! I can start to see the logic now. :I was just starting with the map click event, my goal is to be able to have the user enter a set of coordinates and lick a button and be taken to that location and show them the return value for the route in the output tab. I would guess I would use dojogrid for that but need to learn that as well. Which leads me to apologize for not telling you the return data is offset information. So if you were to click on any route it returns our corridor route and offset. So my goal is to get this working for Lat/Long and then for the other two tabs. On a side not I did install the plugins for brackets like you said I should do. I have read the getting started with brackets, seems like it will be a powerful tool when I learn how to use it. So do the plugins automatically run when they are installed?

Re: GP service

RobertScheitlin__GISP — Thu, 20 Aug 2015 12:50:32 GMT

Terry,

The interactive linter runs all the time automatically. The beautifier has to be run manually from the edit menu or you can set it to beautify on save.

Re: GP service

TerryGustafson — Thu, 20 Aug 2015 16:42:03 GMT

Robert,

I added a couple of textbox's that the user will enter the coordinates in. If I want to align those textbox's do I perform that in the html or the css? I see the style="width: 10em;"

Re: GP service

RobertScheitlin__GISP — Thu, 20 Aug 2015 17:09:51 GMT

Terry,

My preference is to add styling like that to the css so you only have to hunt for it in one file latter when you want to make a change.

Re: GP service

TerryGustafson — Thu, 20 Aug 2015 19:42:21 GMT

I can’t figure out what class to call to make the position of the textbox to be centered and aligned..

Is it?

dijit dijitReset dijitInline dijitLeft dijitTextBox

Re: GP service

RobertScheitlin__GISP — Thu, 20 Aug 2015 20:04:48 GMT

Terry,

You should try not to mess with the dojo dijit css. Instead wrap the textbox in a div and then work with the div in css.

Re: GP service

TerryGustafson — Fri, 21 Aug 2015 13:36:25 GMT

Ok, so I made some changes to the wdget.js file. I was hoping you had a minute to look at it. I know I’m missing something. I was thinking the getPointValues function would get the coordinated from the textbox. Then when latlong was clicked it would plot the point and run the evt function. I was also hoping you could explain the JSLint Problems that are listed. I show 43 errors. But some of them don’t make sense to me. Like the first one says “ Expected 'dojo/_base/declare' at column 5, not column 3. 'dojo/_base/declare', “ there are actually several like that. Do I disregard these?

Re: GP service

RobertScheitlin__GISP — Fri, 21 Aug 2015 20:26:52 GMT

Terry,

Line 90 you have function in front of the function name and this is an issue. (look at your other functions convention).
Line 97 of the Widget.js has a semicolon at the end and it should be a comma.
Actually the whole getPointValues function is not needed or used.
You do not need any ids on your html elements in the html page and you get access to the elements in your html by using data-dojo-attach-point's
I re-worked your first tab using css and inline styles instead of all your br's and &nbsp's, so that you could see how that is done.