esriRequest and outSR

812
3
Jump to solution
07-23-2019 05:09 PM
MinShin
New Contributor III

Hi,

I have feature service that has custom projection.

When I query features using this Query feature: https://gisportal.kisti.re.kr/server/rest/services/GBSK/인천시_행정동/MapServer/1/query

I can specify outSR to be {wkid:4326} and get the correct coordinates.

But when I try this using esriRequest, I don't see the same result. Sample is here. https://gbsk-kisti.s3.ap-northeast-2.amazonaws.com/EsriRequest.html

I have two questions. 

1. how to get coordinates using esriRequest.

2. how to zoom/fit to a feature that has ring geometry.(source code line 104)

Thanks for your help in advance.

Regards,

Min

0 Kudos
1 Solution

Accepted Solutions
RobertScheitlin__GISP
MVP Emeritus

Make this change:

        esriRequest("https://gisportal.kisti.re.kr/server/rest/services/GBSK/%EC%9D%B8%EC%B2%9C%EC%8B%9C_%ED%96%89%EC%A0%95%EB%8F%99/MapServer/1/query", {
          query: {
            where: "sig_kor_nm='연수구'", // honored
            outFields: "sig_kor_nm", // honored
            outSR: "{wkid:4326}", //honored
            f: "json"
          },
          responseType: "json"
        }).then(function(response){‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Don't forget to mark this question as answered by clicking on the "Mark Correct" link on the reply that answered your question.

View solution in original post

3 Replies
RobertScheitlin__GISP
MVP Emeritus

Min Shin,

   Here is your code working. I had to add all the proxy stuff so that I could hit your server from my webserver, you will most likely not need any of that.

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
  <title>Request data from a remote server - 4.12</title>

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

    .container {
      padding: 1em;
    }

    #btnQuery {
      overflow: auto;
      text-align: center;
      cursor: pointer;
      font-size: 1em;
    }

    input {
      width: 75%;
    }

    #viewDiv {
      width: 500px;
      height: 500px;
    }

  </style>

  <link rel="stylesheet" href="https://js.arcgis.com/4.12/esri/themes/light/main.css" />
  <script src="https://js.arcgis.com/4.12/"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>

<body>
  <div class="container esri-widget">
    <div>
      <h2>Using esri/request</h2>
      <button id="btnQuery">Make Request</button>
      <input id="inputUrl" type="text" value="//gisportal.kisti.re.kr/server/rest/services/GBSK/인천시_행정동/MapServer/1/query" />
    </div>
    <pre id="resultsDiv"></pre>
    <div id="viewDiv"></div>
    <div id="bookmarks"></div>
  </div>

  <script>
    require([
      "esri/request",
      "esri/Map",
      "esri/views/MapView",
      "esri/geometry/Polygon",
      "esri/config",
      "esri/core/urlUtils"
    ], function(
      esriRequest,
      Map,
      MapView,
      Polygon,
      esriConfig,
      urlUtils) {
      
      esriConfig.request.proxyUrl = "./proxy/proxy.ashx";
      esriConfig.request.trustedServers.push("https://gisportal.kisti.re.kr");
      urlUtils.addProxyRule({proxyUrl: "./proxy/proxy.ashx", urlPrefix: "https://gisportal.kisti.re.kr"});

      var map = new Map({
        basemap: "streets"
      });

      var view = new MapView({
        container: "viewDiv",
        map: map,
        zoom: 12,
        center: [127.6, 37.5] // longitude, latitude
      });

      var resultsDiv = document.getElementById("resultsDiv");
      var input = document.getElementById("inputUrl");

      $("#btnQuery").click(function() {
        esriRequest("https://gisportal.kisti.re.kr/server/rest/services/GBSK/%EC%9D%B8%EC%B2%9C%EC%8B%9C_%ED%96%89%EC%A0%95%EB%8F%99/MapServer/1/query?where=1%3D1&outFields=*&returnGeometry=true&outSR=%7Bwkid%3A4326%7D&f=json", {
          responseType: "json"
        }).then(function(response){
          // 결과내 전체 피쳐
          response.data.features.forEach(feature => {
            // 행정구역명 확인. 읍면동은 emd_kor_nm
            console.log(feature['attributes']['sig_kor_nm'])

            // 버튼 생성
            var btn = document.createElement("button");
            btn.innerHTML = feature['attributes']['sig_kor_nm'];

            // 클릭하면 해당 구역으로 이동
            btn.addEventListener("click", function(e) {
              // 행정구역 폴리곤 생성
              const polygon = Polygon.fromJSON(feature.geometry);

              // 지도 이동
              view.goTo({
                geometry: polygon
              });
            });
            document.getElementById("bookmarks").appendChild(btn);
          });
        });
      })
    });

  </script>
</body>

</html>
0 Kudos
MinShin
New Contributor III

Hi Robert,

Thanks for your reply. My original intention was specifying the query options as object like below. Here, where and outFields are honored but not outSR. Original x,y values are returned and they are no good for moving maps.

If possible, I would like to use this format because of better readability.

esriRequest("https://gisportal.kisti.re.kr/server/rest/services/GBSK/%EC%9D%B8%EC%B2%9C%EC%8B%9C_%ED%96%89%EC%A0%95%EB%8F%99/MapServer/1/query", {
query: {
where: "sig_kor_nm='연수구'", // honored
outFields: "sig_kor_nm", // honored
outSR: {
wkid: 4326 // not honored
},
f: "json"
},
responseType: "json"
}).then(function(response){
....
}
Regards,
Min
0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Make this change:

        esriRequest("https://gisportal.kisti.re.kr/server/rest/services/GBSK/%EC%9D%B8%EC%B2%9C%EC%8B%9C_%ED%96%89%EC%A0%95%EB%8F%99/MapServer/1/query", {
          query: {
            where: "sig_kor_nm='연수구'", // honored
            outFields: "sig_kor_nm", // honored
            outSR: "{wkid:4326}", //honored
            f: "json"
          },
          responseType: "json"
        }).then(function(response){‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Don't forget to mark this question as answered by clicking on the "Mark Correct" link on the reply that answered your question.