现在的位置: 首页 > 综合 > 正文

ArcGis 中通过 javascript api 来访问 Geoprocessor 服务

2013年09月20日 ⁄ 综合 ⁄ 共 3186字 ⁄ 字号 评论关闭

主要的思路 

访问一个 GP 服务.

通过异步调用,等待 服务器生成结果

成功以后 把结果的rest 调用的图层和当前图层叠加

<!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" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/dojo/dijit/themes/tundra/tundra.css" />
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/esri/css/esri.css" />

    <style>
      html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
      h3 { margin: 0 0 5px 0; border-bottom: 1px solid #444; }
      .shadow {
        -moz-box-shadow: 0 0 5px #888;
        -webkit-box-shadow: 0 0 5px #888;
        box-shadow: 0 0 5px #888;
      }
      #map{ margin: 0; padding: 0; }
      #leftPanel {
        margin:5px;
        background: #fff;
        color: #444;
        font-family: arial;
        width: 250px;
        border-right: solid 1px #888;
      }
      #footer{
        border-top: solid 1px #888;
        height:55px;
      }

      #status{
        background-color:#E0E0E0; 
        color: #707070; 
        font-weight:bold;
        padding: 3px; 
        border: solid 1px #707070;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;    
        border-radius:5px;
        position:absolute;
        top:50%;
        right:50%;
        z-index:100;
        display:none;
        height:20px;
      }
      

    </style>
    <script>var dojoConfig = { parseOnLoad: true };</script>
    <script src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.2/"></script>
    <script>
      dojo.require("dijit.layout.BorderContainer");
      dojo.require("dijit.layout.ContentPane");
      dojo.require("esri.map");
      dojo.require("esri.layers.FeatureLayer");
      dojo.require("esri.tasks.gp");
      dojo.require("esri.dijit.Legend");
      dojo.require("esri.dijit.Popup");
      dojo.require("dijit.form.DateTextBox");

      
      var gpServiceUrl = "http://180.168.139.82:6080/arcgis/rest/services/DATIAN/IDW4/GPServer/Model";
      var mapserviceurl="http://180.168.139.82:6080/arcgis/rest/services/DATIAN/IDW4/MapServer/jobs";
      var map;

      
      function init() {
         map = new esri.Map("map");
         dojo.connect(map, "onLoad", function() {
          //Run the gp task when the app loads to display default incidents 
          findHotspot();
         });
         
         var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://180.168.139.82:6080/arcgis/rest/services/DATIAN/AnhuiBaseBeta/MapServer");
         map.addLayer(basemap);
      }
      
      function findHotspot(){
        var gp = new esri.tasks.Geoprocessor(gpServiceUrl);
        var params = {
           Query: buildDefinitionQuery()
        };
        //cleanup any results from previous runs 
        // cleanup();
        console.debug(params);
        gp.submitJob(params,gpJobComplete,gpJobStatus,gpJobFailed);
      
      }

      function gpJobComplete(jobinfo){
         
        //construct the result map service url using the id from jobinfo we'll add a new layer to the map
        var mapurl = mapserviceurl + "/" + jobinfo.jobId;
        var hotspotLayer = new esri.layers.ArcGISDynamicMapServiceLayer(mapurl,{
          "id":"HotspotLayer",
          "opacity": 0.5
        });

       //add the hotspot layer to the map
        map.addLayers([hotspotLayer]);
      }      
      
      function gpJobStatus(jobinfo){
        esri.show(dojo.byId('status'));
        var jobstatus = '';
        switch (jobinfo.jobStatus){
          case 'esriJobSubmitted':
            jobstatus = 'Submitted...';
            break;
          case 'esriJobExecuting':
            jobstatus = 'Executing...';
            break;
          case 'esriJobSucceeded':
            esri.hide(dojo.byId('status'));
            break;
        }
        console.debug(jobstatus);
      }
      function gpJobFailed(error){
        alert("error\n"+error);
      }

      function buildDefinitionQuery(){
        var defQuery = "1=1";
        return defQuery;
      }
      
      function cleanup(){
       
      }
      
      
      dojo.ready(init);
    </script>
  </head>

<body class="tundra">
  
  <div id="map" data-dojo-type="dijit.layout.ContentPane"data-dojo-props="region:'center'"/>
</body>
</html>

抱歉!评论已关闭.