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; } } }

need help with set pop up window for Dynamic map service layer

JinZhang

Hello,

I am very new to ArcGIS in general, any help is appreciated!

I have a dynamic map service that has only one layer that shows the asset related work order. This layer is a spatial view created by joining a feature class table(a gis asset table) to a non spatial database table(work order) on a matching field ASSET_NAME. I want to set up the the pop up window so when user click on the map, the work order associated to the clicked asset will pop up.

I have searched this forum and found the following thread:

http://forums.arcgis.com/threads/36210-popup-widget-for-ArcGISDynamicMapServiceLayer?highlight=dynamic+map+service+swingley

This example works with our other dynamic map services that do not have layers from spatial views. But for the dynamic map service that has spatial view as the query layer, i can't seem to get it to work:

Here is my code:

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
    <title></title>
    <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.5/js/dojo/dijit/themes/tundra/tundra.css">
    <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.5/js/esri/dijit/css/Popup.css">
    <style>
      html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
      #map{ margin: 0; padding: 0; }
    </style>
    <script>
        var dojoConfig = { parseOnLoad: true };
            </script>
    <script src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.7"></script>
    <script type="GIS_WAM_TEST\jsapi_vsdoc10_v36.js"></script>
    <script>
        dojo.require("dijit.layout.BorderContainer");
        dojo.require("dijit.layout.ContentPane");
        dojo.require("esri.map");
        dojo.require("esri.tasks.query");
        dojo.require("esri.dijit.Popup");


        var map;
        function init() {
            var dynSvc = new esri.layers.ArcGISDynamicMapServiceLayer("http://10.1.22.31/arcgis/rest/services/test/stormwater_wo_rd/MapServer", { "opacity": 0.5 });
            dynSvc.hasAttributionData = true;
            var ext = new esri.geometry.Extent({ "xmin": 2125148.0132503808, "ymin": 596823.7652553022, "xmax": 2258287.4035612047, "ymax": 675346.1662348956, "spatialReference": { "wkid": 3734} });
            var popup = new esri.dijit.Popup(null, dojo.create("div"));

            map = new esri.Map("map", {
                "extent": ext,
                "infoWindow": popup
            });
            map.addLayer(dynSvc);

            dojo.connect(map, 'onClick', queryCounties);

            dojo.connect(map, 'onLoad', function () {
                dojo.connect(dijit.byId('map'), 'resize', map, map.resize);
            });
        }

        function queryCounties(e) {
            // build an extent around the click point
            var pad = map.extent.getWidth() / map.width * 3;
            var queryGeom = new esri.geometry.Extent(e.mapPoint.x - pad, e.mapPoint.y - pad, e.mapPoint.x + pad, e.mapPoint.y + pad, map.spatialReference);
            var q = new esri.tasks.Query();

            q.outSpatialReference = { "wkid": 3734 };

            q.returnGeometry = false;
            q.outFields = ["ASSET_NAME,ASSET_TYPE"];
            q.geometry = queryGeom;



            var popupTemplate = new esri.dijit.PopupTemplate({
                title: "{NAME}",
                fieldInfos: [
            { fieldName: "ASSET_NAME", visible: true, label: "ASSET_NAME: " },
            { fieldName: "ASSET_TYPE", visible: true, label: "ASSET_TYPE: " }
          ]
            });

            var qt = new esri.tasks.QueryTask("http://10.1.22.31/arcgis/rest/services/test/stormwater_wo_rd/MapServer/0");
            var def = qt.execute(q);
            def.addCallback(function (result) {
                return dojo.map(result.features, function (f) {
                    f.setInfoTemplate(popupTemplate);
                    return f;
                });
            });

            // use the deferred returned from the query task to set
            // the popup features
            map.infoWindow.setFeatures([def]);
            // show the popup
            map.infoWindow.show(e.screenPoint, map.getInfoWindowAnchor(e.screenPoint));
        }
        dojo.ready(init);
    </script>
</head>

<body class="tundra">
    <div data-dojo-type="dijit.layout.BorderContainer"
         data-dojo-props="design:'headline',gutters:false"
         style="width: 100%; height: 100%; margin: 0;">
      <div id="map"
           data-dojo-type="dijit.layout.ContentPane"
           data-dojo-props="region:'center'">
      </div>
    </div>
</body>
</html>

i am able to see query result from rest point of the map service,for example

NAME: Blodgett Creek
Polyline:
[2145918.8909744024, 610092.0131329745] , [2145906.221844673, 610108.106422767] , [2145891.728881374, 610117.7147980779] more...

However, when I run my code, it seems there is no feature returns and the pop up window just say"no information available". here is what I get from Chrome's network window:

dojo.io.script.jsonp_dojoIoScript2._jsonpCallback({"displayFieldName":"NAME","fieldAliases":{"ASSET_NAME":"ASSET_NAME","ASSET_TYPE":"ASSET_TYPE"},"fields":[{"name":"ASSET_NAME","type":"esriFieldTypeString","alias":"ASSET_NAME","length":15},{"name":"ASSET_TYPE","type":"esriFieldTypeString","alias":"ASSET_TYPE","length":25}],"features":[]});

Find more posts tagged with

Accepted answers

All comments

JinZhang

Thank you Jason for all your help. I will give it a try.

JasonZou

Assuming you save both the table and the asset feature class in a geodatabase. Create a relationship class to link the two together. Then load both the table and the feature class in ArcMap, and publish them. Once published, you should see a Relationships section of the layer or table page at the bottom.

Here is the code snippet of how to query the table based on the result from the feature layer. The code is to query the feature layer based on the asset name, and only return ObjectIDs for better performance. Then use the returned object ids to query the related work order table. If you like to highlight the features returned from the feature layer, you can use fl.selectFeatures method to replace fl.queryIds. In this case, you will make sure to return ObjectID field whose value will be used to query the related records.

function queryAsset() {
  var fl = new esri.layers.FeatureLayer("feature layer rest url");
  var q = new esri.tasks.Query();
  q.where = "ASSET_NAME = 'SomeValue'";
  fl.queryIds(q, function(objIds) {
    var relatedQuery = new esri.tasks.RelationshipQuery();
    relatedQuery.outFields = [list of output fields];
    relatedQuery.relationshipId = 1;    // relationship id showing on the service explorer.
    objectIds = objIds;
    fl.queryRelatedFeatures(relatedQuery, processRelatedRecords);
  });
}

function processRelatedRecords(relatedRecords) {
  // relatedRecords should be the work order records in your case
  // process them as you like.
}

JinZhang

Thanks Jason,

So i published the data table that contains work order data as a table and published the feature class that has asset name as a feature layer. How do i loop through the work order table to get the matched data based on the asset name? What function should I use? I am sorry that I ArcGIS API javascript is very new to me. This is the first project i am working on.

JasonZou

Now I may have to admit that the spatial view may cause some query issue. Can you make spatial query against the layer in ArcMap?

Another option would be to keep the feature class and the work order table on their own and build a relationship between them in MXD and publish again. In your code, you can first query the feature class by the click location, and then query the work order table based on the returned feature class ObjectIDs. Display the work order in the popup then.

JinZhang

I got identical response with no data returned from browser window:

Response for code:
http://10.1.22.31/arcgis/rest/services/test/vw_regional_drainage/MapServer/0/query?f=json&returnGeometry=true&spatialRel=esriSpatialRelIntersects&geometry={"xmin":2149211.2547150566,"ymin":647347.9033248299,"xmax":2149974.8437035126,"ymax":648111.4923132863,"spatialReference":{"wkid":3734}}&geometryType=esriGeometryEnvelope&inSR=3734&outFields=ASSET_NAME,ASSET_TYPE&outSR=3734&callback=dojo.io.script.jsonp_dojoIoScript2._jsonpCallback

Response for code:
http://10.1.22.31/arcgis/rest/services/test/vw_regional_drainage/MapServer/0/query?f=json&returnGeometry=true&spatialRel=esriSpatialRelIntersects&geometry={"x":2145918.8909744024,"y":610092.0131329745,"spatialReference":{"wkid":3734}}&geometryType=esriGeometryPoint&inSR=3734&outFields=ASSET_NAME,ASSET_TYPE&outSR=3734&callback=dojo.io.script.jsonp_dojoIoScript2._jsonpCallback

dojo.io.script.jsonp_dojoIoScript2._jsonpCallback({"displayFieldName":"NAME","fieldAliases":{"ASSET_NAME":"ASSET_NAME","ASSET_TYPE":"ASSET_TYPE"},"geometryType":"esriGeometryPolyline","spatialReference":{"wkid":102722,"latestWkid":3734},"fields":[{"name":"ASSET_NAME","type":"esriFieldTypeString","alias":"ASSET_NAME","length":15},{"name":"ASSET_TYPE","type":"esriFieldTypeString","alias":"ASSET_TYPE","length":25}],"features":[]});

JasonZou

Try the two tests in a browser window.

http://10.1.22.31/arcgis/rest/services/test/vw_regional_drainage/MapServer/0/query?f=json&returnGeometry=true&spatialRel=esriSpatialRelIntersects&geometry={"xmin":2149211.2547150566,"ymin":647347.9033248299,"xmax":2149974.8437035126,"ymax":648111.4923132863,"spatialReference":{"wkid":3734}}&geometryType=esriGeometryEnvelope&inSR=3734&outFields=ASSET_NAME,ASSET_TYPE&outSR=3734&callback=dojo.io.script.jsonp_dojoIoScript2._jsonpCallback

http://10.1.22.31/arcgis/rest/services/test/vw_regional_drainage/MapServer/0/query?f=json&returnGeometry=true&spatialRel=esriSpatialRelIntersects&geometry={"x":2145918.8909744024,"y":610092.0131329745,"spatialReference":{"wkid":3734}}&geometryType=esriGeometryPoint&inSR=3734&outFields=ASSET_NAME,ASSET_TYPE&outSR=3734&callback=dojo.io.script.jsonp_dojoIoScript2._jsonpCallback

JinZhang

Jason, here is the extent for layer0. I got this from the map service REST service directory.

Extent:
XMin: 2125148.0132503808
YMin: 596823.7652553022
XMax: 2258287.4035612047
YMax: 675346.1662348956
Spatial Reference: 102722 (3734)

I used the extent for layer 0 in the code, here is what I set the extent inside of function init()

var ext = new esri.geometry.Extent({ "xmin": 2125148.0132503808, "ymin": 596823.7652553022, "xmax": 2258287.4035612047, "ymax": 675346.1662348956, "spatialReference": { "wkid": 3734} });

JasonZou

ok...I am pretty sure that the issue lies on the extent used to make the query. Please provide me two things.

layer0 extent
the extent used to make the query

JinZhang

sorry that was a typo, should be layer 0. There is only one layer in that map service.

JasonZou

Which layer do you want to query? In your code, it's the layer 0 fed into the queryTask. But in your last post, you queried against the layer 3.

JinZhang

Jason,

I was able to run the query against REST point by going to the map service's ArcGIS REST Services Directory, go into the map layer, in "supported operation", I go to query, then I specify 1=1 in where clause and do query(GET) and it shows me all the data returned with the following url show up in the browser:

http://10.1.22.31/arcgis/rest/services/test/stormwater_wo_rd/MapServer/3/query?where=3%3D1&text=&objectIds=&time=&geometry=&geometryType=esriGeometryEnvelope&inSR=&spatialRel=esriSpatialRelIntersects&relationParam=&outFields=*&returnGeometry=true&maxAllowableOffset=&geometryPrecision=&outSR=&returnIdsOnly=false&returnCountOnly=false&orderByFields=&groupByFieldsForStatistics=&outStatistics=&returnZ=false&returnM=false&gdbVersion=&returnDistinctValues=false&f=pjson

Yes, If i just copy paste the following url in the browser, I got all the data returned as well.
http://10.1.22.31/arcgis/rest/services/test/stormwater_wo_rd/MapServer/3/query?where=1%3D1&spatialRel=esriSpatialRelIntersects&outFields=*&returnGeometry=true&f=pjson

So in my code if i can send query that look just like http://10.1.22.31/arcgis/rest/services/test/stormwater_wo_rd/MapServer/3/query?where=0%3D1&spatialRel=esriSpatialRelIntersects&outFields=*&returnGeometry=true&f=pjson . It will work. Could you please provide further help?

Thank you again!

JasonZou

You said in your first post that you can run the query from the rest endpoint. How did you do that? If you can get result back from the rest endpoint, the query should work then. JSAPI is built upon REST API. I don't think the issue is related to the popup. Popup is just a data viewer. The issue is whether you can query the feature layer and get something back.

Run a query against the REST endpoint directly with the following url, and see if it returns anything.

http://10.1.22.31/arcgis/rest/services/test/stormwater_wo_rd/MapServer/0/query?where=1=1&amp;spatialRel=esriSpatialRelIntersects&amp;outFields=*&amp;returnGeometry=true&amp;f=pjson

JinZhang

Jason, Thank you for look into this. I changed

q.outSpatialReference = { "wkid": 3734 };

to

q.outSpatialReference = new esri.SpatialReference({ "wkid": 3734 });

This time, when I run the code and click on the polyline, the pop up shows" searching..." for a couple seconds and then still display "no information available". This the same result I got by copy and paste the request URL in the browser:

{"displayFieldName":"NAME","fieldAliases":{"ASSET_NAME":"ASSET_NAME","ASSET_TYPE":"ASSET_TYPE"},"geometryType":"esriGeometryPolyline","spatialReference":{"wkid":102722,"latestWkid":3734},"fields":[{"name":"ASSET_NAME","type":"esriFieldTypeString","alias":"ASSET_NAME","length":15},{"name":"ASSET_TYPE","type":"esriFieldTypeString","alias":"ASSET_TYPE","length":25}],"features":[]}

I am wondering if pop up does not work for a dynamic map service layer that is created by a spatial view in general? The code works fine if the dynamic map service layer is a feature layer coming from a feature class. For test purpose, I created two dynamic map services A and B, A has a feature layer (created from a feature class regionalDrainage), B has a layer coming from a spatial view(created by just select * from feature class regionalDrainage). The code works on A, the pop up shows up with the proper contents, but the code does work display any pop up with B.

JasonZou

I think I find the cause.

Change:

q.outSpatialReference = { "wkid": 3734 };

To:

q.outSpatialReference = new esri.SpatialReference({ "wkid": 3734 });

JinZhang

The feature type is polyline. I reset pad = 1000000; and still nothing returns.

JasonZou

Are you sure the extent fed in the request will intersect with some features? What is the feature type of the query layer? Increase the pad value to some big value for test, like 10000, and see if something returns.

PeterKing4_1-1619043324488.png

Beacon.jpg

JinZhang

Thank you Jason,

I did change the outField to q.outFields = ["ASSET_NAME","ASSET_TYPE"]; However, still no result returned.

I copied pasted the query request url from Chrome' network window under query request. No value returned, here is what it shows on screen:

{"displayFieldName":"NAME","fieldAliases":{"ASSET_NAME":"ASSET_NAME","ASSET_TYPE":"ASSET_TYPE"},"geometryType":"esriGeometryPolyline","spatialReference":{"wkid":102722,"latestWkid":3734},"fields":[{"name":"ASSET_NAME","type":"esriFieldTypeString","alias":"ASSET_NAME","length":15},{"name":"ASSET_TYPE","type":"esriFieldTypeString","alias":"ASSET_TYPE","length":25}],"features":[]}

Here is the entire query request url:
http://10.1.22.31/arcgis/rest/services/test/vw_regional_drainage/MapServer/0/query?f=json&where=&returnGeometry=true&spatialRel=esriSpatialRelIntersects&geometry=%7B%22xmin%22%3A2149211.2547150566%2C%22ymin%22%3A647347.9033248299%2C%22xmax%22%3A2149974.8437035126%2C%22ymax%22%3A648111.4923132863%2C%22spatialReference%22%3A%7B%22wkid%22%3A3734%7D%7D&geometryType=esriGeometryEnvelope&inSR=3734&outFields=ASSET_NAME%2CASSET_TYPE&outSR=3734&callback=dojo.io.script.jsonp_dojoIoScript2._jsonpCallback

I know something is wrong with the query request, but have no idea how to fix it.

Thank you,

JasonZou

dojo.io.script.jsonp_dojoIoScript2._jsonpCallback({"displayFieldName":"NAME","fieldAliases":{"ASSET_NAME":"ASSET_NAME","ASSET_TYPE":"ASSET_TYPE"},"geometryType":"esriGeometryPolyline","spatialReference":{"wkid":102722,"latestWkid":3734},"fields":[{"name":"ASSET_NAME","type":"esriFieldTypeString","alias":"ASSET_NAME","length":15},{"name":"ASSET_TYPE","type":"esriFieldTypeString","alias":"ASSET_TYPE","length":25}],"features":[]});

The above is just the result of the feature layer REST endpoint, not the query result.

In addition to the change of returnGeometry, you also need to change outFields as shown in my previous post. What's the value of result returned from qt after making all these changes?

If qt returns nothing, then in Chrome Developer Tools, under Network tab, look for the query request starting with query?f=json.... Copy the whole request URL, and paste to the browser address. If you still get nothing, then something wrong with the request. Post the whole request URL if you like.

JinZhang

Thank you Jason,

I changed "returnGeometry = false" to "returnGeometry = true", however, the pop up window still shows "no information available" and the preview window in Chrome' network window shows the following without returning any feature:

dojo.io.script.jsonp_dojoIoScript2._jsonpCallback({"displayFieldName":"NAME","fieldAliases":{"ASSET_NAME":"ASSET_NAME","ASSET_TYPE":"ASSET_TYPE"},"geometryType":"esriGeometryPolyline","spatialReference":{"wkid":102722,"latestWkid":3734},"fields":[{"name":"ASSET_NAME","type":"esriFieldTypeString","alias":"ASSET_NAME","length":15},{"name":"ASSET_TYPE","type":"esriFieldTypeString","alias":"ASSET_TYPE","length":25}],"features":[]});

JasonZou

No feature returned is because you set returnGeometry = false.

Change:

q.returnGeometry = false;
q.outFields = ["ASSET_NAME,ASSET_TYPE"];

To:

q.returnGeometry = true;
q.outFields = ["ASSET_NAME","ASSET_TYPE"];

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

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