基于Vue + TypeScript + @supermap/iclient-ol 方式对iServer进行数据查询

╰+哭是因爲堅強的太久メ 2022-09-09 06:12 32阅读 0赞

# 基于Vue + TypeScript + @supermap/iclient-ol 方式对iServer进行数据查询 #

## 引入 ##

npm install --save @supermap/iclient-ol@^10.1.3

## Ts声明 ##

> d.ts文件全称TypeScript Declaration File，它的作用是存放一些声明，为了避免报错，我在components目录下，新建一个后缀d.ts文件，内容如下

declare module '@supermap/iclient-ol';

## 代码示例 ##

// 按需引入
    import {  SuperMap, FeatureService } from '@supermap/iclient-ol';
    
    @Component({  components: { } })
    export default class AnalysisTs extends Vue { 
    	// sql查询
    	bySqlQuery({  url = '', name = '', attributeFilter = '', datasetNames = [""] }, cb: any) { 
    	        //指定SQL查询处理
    	        var url = url;
    	        //指定SQL查询服务参数
    	        var sqlParam = new SuperMap.GetFeaturesBySQLParameters({ 
    	            queryParameter: { 
    	                name: name,
    	                attributeFilter: attributeFilter
    	            },
    	            datasetNames: datasetNames
    	        });
    	        //向服务器发送请求，并对返回的结果进行处理
    	        new FeatureService(url).getFeaturesBySQL(sqlParam, function (serviceResult: any) { 
    	            //获取返回的features数据
    	            var features = serviceResult.result.features;
    	            if (features && cb) { 
    	                cb(features)
    	            }
    	        });
    	    }
        }