你的位置:首页 > 软件开发 > Java > 要素图层范围查询属性arcgis api for js(featuretable根据上篇的优化)原创

要素图层范围查询属性arcgis api for js(featuretable根据上篇的优化)原创

发布时间:2017-08-17 10:00:20
上篇介绍了如何使用要素图层范围查询属性,实际运用时有些无法满足我的需求。于是我做了如下的一些优化:1、根据属性名字可以进行模糊查询:即写一个博即可搜寻到与含博的所有字段var sql_name="name Like '%"+name+"%&# ...

上篇介绍了如何使用要素图层范围查询属性,实际运用时有些无法满足我的需求。于是我做了如下的一些优化

1、根据属性名字可以进行模糊查询:即写一个博即可搜寻到与含博的所有字段

var sql_name="name Like '%"+name+"%'";//将需要模糊查询的字段,按格式书写

2、查询不再是并查询。而是既可以单独查询又可以并查询。

if (submin==""||submax=="") {   sql_r=sql_name;  }  else if(name==""){   sql_r=sql_gdp;  }  else{   sql_r=sql_gdp+"and "+sql_name;  }   myFeatureLayer.setDefinitionExpression(sql_r);

  3、进入后便可以点击属性表,使之高亮显示。

function loadTable(){   myFeatureLayer = new FeatureLayer("http://localhost:6080/arcgis/rest/services/%E6%9C%80%E5%90%8E%E7%9A%84%E5%9B%BE%E5%B1%82/%E4%B8%9D%E7%BB%B8%E4%B9%8B%E8%B7%AF/FeatureServer/0",{   mode: FeatureLayer.MODE_ONDEMAND,   outFields: ["*"],   visible: true,   id: "fLayer"   }); myFeatureLayer.setSelectionSymbol(symbol);map.addLayer(myFeatureLayer);myFeatureTable = new FeatureTable({   featureLayer : myFeatureLayer,   map : map,   showAttachments: true,   // only allows selection from the table to the map    syncSelection: true,    zoomToSelection: true,    gridOptions: {    allowSelectAll: true,    allowTextSelection: true,   },   editable: true,   outFields: ["name","description","grp2015"],   fieldInfos: [    {    name: 'name',     alias: '城市名字',     editable: false    },    {    name: 'description',     alias: '描述',    },    {    name: 'grp2015',     alias: '经济'    },   ],   }, 'myTableNode');   myFeatureTable.startup();

  全部代码如下:

<!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>FeatureTable Formatting</title> <link rel="stylesheet" href="https://js.arcgis.com/3.21/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="https://js.arcgis.com/3.21/esri/css/esri.css"> <script src='/images/loading.gif' data-original="https://js.arcgis.com/3.21/"></script> <script src='/images/loading.gif' data-original="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> <style> html, body, #map {  width: 100%;  height: 100%;  margin: 0;  padding: 0; } .claro .dijitSplitContainer-child, .claro .dijitBorderContainer-child {  border: 0 #b5bcc7 solid; }} </style> <script> require([  "esri/layers/FeatureLayer",  "esri/dijit/FeatureTable",  "esri/geometry/Extent",  "esri/symbols/SimpleMarkerSymbol",  "esri/symbols/SimpleLineSymbol",  "esri/Color",  "esri/map",  "dojo/dom-construct",  "dojo/dom",  "dojo/number",  "dojo/parser",  "dojo/ready",  "dojo/on",  "dojo/_base/lang",  "dijit/registry",  "dijit/form/Button",  "dijit/layout/ContentPane",   "dijit/layout/BorderContainer",  "dijit/form/TextBox" ], function (  FeatureLayer, FeatureTable, Extent, SimpleMarkerSymbol, SimpleLineSymbol, Color, Map,  domConstruct, dom, dojoNum, parser, ready, on,lang,  registry, Button, ContentPane, BorderContainer, TextBox ) { var selectionSymbol;  parser.parse();  var symbol= new esri.symbol.SimpleMarkerSymbol();     symbol.setSize(35);     symbol.setColor(new dojo.Color([250,128,114,0.3]));  ready(function(){   var sr = new esri.SpatialReference({   wkid: 4326  });  var startExtent = new esri.geometry.Extent(-88.27, 17.47, -88.16, 17.54, sr);  map = new esri.Map("map", {   logo: false,   center: [83.75, 33.75],   zoom: 3   //    sliderPosition:"top-right"  });  map.addLayer(new esri.layers.ArcGISTiledMapServiceLayer("http://map.geoq.cn/arcgis/rest/services/ChinaOnlineCommunity/MapServer"));  map.on("load", loadTable);var myFeatureLayer;var myFeatureTable;  function loadTable(){   myFeatureLayer = new FeatureLayer("http://localhost:6080/arcgis/rest/services/%E6%9C%80%E5%90%8E%E7%9A%84%E5%9B%BE%E5%B1%82/%E4%B8%9D%E7%BB%B8%E4%B9%8B%E8%B7%AF/FeatureServer/0",{   mode: FeatureLayer.MODE_ONDEMAND,   outFields: ["*"],   visible: true,   id: "fLayer"   });   myFeatureLayer.setSelectionSymbol(symbol);   map.addLayer(myFeatureLayer);    myFeatureTable = new FeatureTable({   featureLayer : myFeatureLayer,   map : map,   showAttachments: true,      zoomToSelection: true,    gridOptions: {    allowSelectAll: true,    allowTextSelection: true,   },   editable: true,   outFields: ["name","description","grp2015"],   fieldInfos: [    {    name: 'name',     alias: '城市名字',     editable: false    },    {    name: 'description',     alias: '描述',    },    {    name: 'grp2015',     alias: '经济'    },   ],   }, 'myTableNode');   myFeatureTable.startup();   // listen to show-attachments event   myFeatureTable.on("show-attachments", function(evt){   console.log("show-attachments event - ", evt);   });  }   on(dom.byId("sqlque"), "click", function (e) {   if ($('#bot').is(":hidden")) {$('#bot').show();}   else{$('#bot').hide();}   map.removeLayer(myFeatureLayer);   var sql_r;  var submin = dom.byId("submin").value;//序号最小值  var submax = dom.byId("submax").value;//最大值  //判断输入是否在范围内  if (submin<0||submin>40000){alert("请输入最小值");} //最小值  if (submax<0||submax>40000){alert("请输入最大值");} //最大值  var sql_gdp="grp2015 >="+submin+"and grp2015<="+submax; //序号SQL查询字符串  var name = dom.byId("name_test").value;//name的值  var sql_name="name Like '%"+name+"%'";  if (submin==""||submax=="") {   sql_r=sql_name;  }  else if(name==""){   sql_r=sql_gdp;  }  else{   sql_r=sql_gdp+"and "+sql_name;  }   myFeatureLayer.setDefinitionExpression(sql_r);   myFeatureLayer.setSelectionSymbol(symbol);    myFeatureLayer.on("click", function(evt) {   var idProperty = myFeatureLayer.objectIdField;   var feature, featureId, query1;   if (evt.graphic && evt.graphic.attributes && evt.graphic.attributes[idProperty]) {    feature = evt.graphic; //获取要素形状    featureId = feature.attributes[objectid]; //获取要素ID    //实例化查询参数    query1 = new Query();     query1.returnGeometry = true;     query1.objectIds = [featureId];    query1.where = "1=1"; //取查询中的全部数据    myFeatureLayer.selectFeatures(query1, FeatureLayer.SELECTION_NEW);   }   });   map.addLayer(myFeatureLayer); //添加要素查询结果图层   myFeatureTable.refresh(); //更新要素表格});  }); }); </script></head><body > <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline'"  >  <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'" >   GDP:<input id="submin" />to   <input id="submax" /><br>   name:   <input id="name_test" />   <button id="sqlque">    查询</button>  </div>  <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center', splitter:true"   >   <div id="map">   </div>  </div>  <div id="bot" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'bottom', splitter:true"   >   <div id="myTableNode">   </div>  </div> </div></body></html>

 

 本文链接

原标题:要素图层范围查询属性arcgis api for js(featuretable根据上篇的优化)原创

关键词:JS

JS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。