geoserver图层属性查询及查询结果转换为arcgis js api能使用的格式

简介: 一个项目使用了ArcGIS JS API开发GIS展示层,但GIS服务使用了Geoserver,这时加载Geoserver数据和查询数据就和之前完全不一样了,以下介绍下我使用ArcGIS JS API+Geoserver开发过程中解决Geoserver图层属性查询的一个方案。

一个项目使用了ArcGIS JS API开发GIS展示层,但GIS服务使用了Geoserver,这时加载Geoserver数据和查询数据就和之前完全不一样了,以下介绍下我使用ArcGIS JS API+Geoserver开发过程中解决Geoserver图层属性查询的一个方案。

 

以Geoserver中发布的图层 city 为例。我现在要查询city图层中ID=53090000000000的对象,并使用ArcGIS JS API将查询到的结果显示出来。

 

首先找到查询的实际地址:

http://localhost:9999/geoserver/换成自自己工作空间名称/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=换成自自己工作空间名称:city&maxFeatures=50&outputFormat=application/json&CQL_FILTER=ID=53090000000000

先不要管这个地址哪儿来的,对应上面需要改的地方改下试试先。如果不对,可以参考以下做法修正部分参数:

第一步:

 

第二步:

照这样自己抓取看下,最后把抓取地址中的输出类型改为json就可以了。参考上面给出的示例地址。

 

做好上面的准备过后,就是请求了。构建好url地址,使用ajax的post请求即可,如果出现跨域问题可以通过jsonp或者后台写个httppost程序来转换下。

我们关注的是请求结果,如下图:

得到的结果包含了字段属性和图形坐标,这里可以使用json2.js完成对象到json的转换。这里重要的介绍下图形的重新绘制,我们关注的是features下的coordinates。

参考ArcGIS JS API中创建面的方法,如下图:

于是我这样写:

var json = {
    "rings": points,
    "spatialReference": { "wkid": 4326 }
};
var polygon = new esri.geometry.Polygon(json);

结果居然是错误的,中间经历了很多的尝试,后来找到准确的写法是这样的:

var feature = features[i];
var points = [];
for (var n = 0; n < feature.geometry.coordinates.length; n++) {
    points.push(feature.geometry.coordinates[n][0]);
}
var json = {
    "rings": points,
    "spatialReference": { "wkid": 4326 }
};
var polygon = new esri.geometry.Polygon(json);

只能说geoserver存储图形的坐标方式和arcserver是不一样的吧,这里是一个坑,希望对同样掉入这个坑的人有点帮助。

相关文章
|
13天前
|
JSON 前端开发 搜索推荐
关于商品详情 API 接口 JSON 格式返回数据解析的示例
本文介绍商品详情API接口返回的JSON数据解析。最外层为`product`对象,包含商品基本信息(如id、name、price)、分类信息(category)、图片(images)、属性(attributes)、用户评价(reviews)、库存(stock)和卖家信息(seller)。每个字段详细描述了商品的不同方面,帮助开发者准确提取和展示数据。具体结构和字段含义需结合实际业务需求和API文档理解。
|
3天前
|
JavaScript 前端开发 安全
盘点原生JS中目前最没用的几个功能API
在JavaScript的发展历程中,许多功能与API曾风光无限,但随着技术进步和语言演化,部分功能逐渐被淘汰或被更高效的替代方案取代。例如,`with`语句使代码作用域复杂、可读性差;`void`操作符功能冗余且影响可读性;`eval`函数存在严重安全风险和性能问题;`unescape`和`escape`函数已被`decodeURIComponent`和`encodeURIComponent`取代;`arguments`对象则被ES6的剩余参数语法替代。这些变化体现了JavaScript不断优化的趋势,开发者应紧跟技术步伐,学习新技能,适应新技术环境。
30 10
|
2月前
|
JSON 缓存 JavaScript
深入浅出:使用Node.js构建RESTful API
在这个数字时代,API已成为软件开发的基石之一。本文旨在引导初学者通过Node.js和Express框架快速搭建一个功能完备的RESTful API。我们将从零开始,逐步深入,不仅涉及代码编写,还包括设计原则、最佳实践及调试技巧。无论你是初探后端开发,还是希望扩展你的技术栈,这篇文章都将是你的理想指南。
|
1月前
|
JSON JavaScript 前端开发
深入浅出Node.js:从零开始构建RESTful API
在数字化时代的浪潮中,后端开发作为连接用户与数据的桥梁,扮演着至关重要的角色。本文将引导您步入Node.js的奇妙世界,通过实践操作,掌握如何使用这一强大的JavaScript运行时环境构建高效、可扩展的RESTful API。我们将一同探索Express框架的使用,学习如何设计API端点,处理数据请求,并实现身份验证机制,最终部署我们的成果到云服务器上。无论您是初学者还是有一定基础的开发者,这篇文章都将为您打开一扇通往后端开发深层知识的大门。
60 12
|
1月前
|
JSON API 数据格式
获取商品详情API的请求格式是什么
获取商品详情API的请求格式通常依赖于特定的电商平台或服务提供商,但一般遵循类似的结构。以下是一个概括性的说明,以及针对几个主流电商平台的示例:
|
1月前
|
缓存 算法 API
查询域名WHOIS信息免费API接口教程
该API用于查询顶级域名的WHOIS信息,不支持国别域名和中文域名。通过POST或GET请求,需提供用户ID、KEY及待查询域名。返回信息包括域名状态、注册商、时间等详细数据。示例与文档见官网。
|
2月前
|
JavaScript 前端开发 API
Vue.js 3:深入探索组合式API的实践与应用
Vue.js 3:深入探索组合式API的实践与应用
|
1月前
|
API
icp备案查询免费API接口教程
该接口用于查询指定域名的ICP备案信息,支持POST或GET请求方式。请求时需提供用户ID、用户KEY及待查询的域名,可选参数为查询通道。响应中包含状态码、消息内容、备案号、备案主体、域名及审核时间等信息。示例中提供了GET和POST请求方式及返回数据样例。
|
2月前
|
JavaScript NoSQL API
深入浅出Node.js:从零开始构建RESTful API
在数字化时代的浪潮中,后端开发如同一座灯塔,指引着数据的海洋。本文将带你航行在Node.js的海域,探索如何从一张白纸到完成一个功能完备的RESTful API。我们将一起学习如何搭建开发环境、设计API结构、处理数据请求与响应,以及实现数据库交互。准备好了吗?启航吧!
|
2月前
|
JavaScript 前端开发 API
Vue.js 3:探索组合式API带来的新变革
Vue.js 3:探索组合式API带来的新变革

热门文章

最新文章