基于Vue的GIS组件GISView的API文档

最新推荐文章于 2024-03-03 23:32:20 发布

置顶 Devin·Finn

最新推荐文章于 2024-03-03 23:32:20 发布

阅读量1.5k

点赞数 3

本文链接：https://blog.csdn.net/danbo_c/article/details/116236388

版权

WebGIS - ArcGIS API For Js 同时被 3 个专栏收录

53 篇文章 18 订阅

订阅专栏

Vue

22 篇文章 5 订阅

订阅专栏

GIS & RS

17 篇文章 7 订阅

订阅专栏

GISView API

基于Vue的GIS组件

版本：1.2.x

2021.04.28

npm传送门
 GISView API文档

起步

初始化vue项目
```
vue tese demo
```
安装组件库
```
npm install gisview
```

引用组件

import 'gisview/dist/gisview.css'
import GW from 'gisview'

Vue.use(GW)

依赖组件

import 'leaflet/dist/leaflet.js'
import '@supermap/iclient-leaflet'

三维依赖。推荐第一种方式

// index.html引用，下载WebGL包到public
<link href="Cesium/Widgets/widgets.css" rel="stylesheet">
<script type="text/javascript" src="Cesium/Cesium.js"></script>

// ES6模块化引用，可能出现地球初始化闪烁
import {S3MTilesLayer} from '../Build/Cesium/Cesium.js'
import from '../Build/Cesium/Widgets/widgets.css'

main.js

import 'gisview/dist/gisview.css'
import 'leaflet/dist/leaflet.css'
import 'leaflet/dist/leaflet.js'
import '@supermap/iclient-leaflet'
import GW from 'gisview/dist/gisview.umd.js'

Vue.use(GW)

示例场景和开发框架稍后放至github及gitee上

Map系列

需要new一个map对象当作参数传入

1. Arcgis矢量服务

// 默认加载一幅arcgisonline的矢量服务
<gw-load-vector-arc></gw-load-vector-arc>

值	含义	类型	默认值	校验
`id`	`Dom`名称	`String`	`map`	是
`mapObj`	`map`对象	`Arcgis`规范下的`map`对象	包含属性extent和logo值的`Map`对象	有
`image-url`	服务地址	`String`	`''`	是
`extent`	范围	`Object`	北京城区偏北	对象内部不校验
`basemap`	底图	`String`	`''`	是
`logo`	esri logo	`Boolean`	`false`	是
`overview`	鹰眼图	`Boolean`	`false`	是
`expandFactor`	鹰眼比例	`Number`	`2`	是
`attachTo`	鹰眼位置	`String`	`top-right`	是
`divCss`	Css样式	`String`	`''`	是

data() {
    return {
      mapObj: {},
      extent: {
        able: true,
        xmin: 114,
        ymin: 40,
        xmax: 118,
        ymax: 41,
        wkid: 4326
      }
    }
  }

// 默认值
<gw-load-vector-arc
  :map-obj.sync="mapObj"
  imageUrl: "http://server.arcgisonline.com/arcgis/rest/services/World_Topo_Map/MapServer"
  :extent: "extent"
  :logo: "false"
  div-css: 'width: 90%; height: 90%;background-color: azure;'
  :overview="true"
  :expandFactor: 2
  attachTo: 'bottom-left'
></gw-load-vector-arc>

2. Arcgis影像服务

// 默认加载一副arcgisonline的影像服务
<gw-load-image-arc></gw-load-image-arc>

值	含义	类型	默认值	校验
`id`	`Dom`名称	`String`	`map`	是
`mapObj`	`map`对象	`Arcgis`规范下的`map`对象	包含logo值的`Map`对象	有
`image-url`	服务地址	`String`	`''`	是
`extent`	范围	`Object`	北京城区偏北	对象内部不校验
`logo`	esri logo	`Boolean`	`false`	是
`overview`	鹰眼图	`Boolean`	`false`	是
`expandFactor`	鹰眼比例	`Number`	`2`	是
`attachTo`	鹰眼位置	`String`	`top-right`	是
`divCss`	Css样式	`String`	`''`	是

3. 空间查询

<gw-query-task-arc
  :query-task-url="queryTaskUrl"
  :map-obj="map"
  :filts="filts"
  :query-result.sync="queryResult"
></gw-query-task-arc>

值	含义	类型	默认值	校验
`queryTaskUrl`	查询服务	`String`	无	有
`map-obj`	`map`对象	`Arcgis`规范下的`map`对象	无	有
`filts`	查询字段	`Array<String>`	无	有
`queryResult`	接收查询结果	`Object`	`{}`	不接收

4. 唯一值渲染

<gw-unique-render-arc
   v-if="asyncData"
   :map-obj.sync="map"
   :render-url="renderUrl"
   :filt-field="filtValue"
   :tip="tip"
></gw-unique-render-arc>

  data() {
    return {
      asyncData: false,
      map: {},
      renderUrl:
        'http://localhost:6080/arcgis/rest/services/Basic/China_POI/MapServer/0',
      filtField: 'jishu',
      tip: 'AQI级数唯一值渲染'
    }
  }

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Arcgis`规范下的`map`对象	无	有
`render-url`	渲染服务	`String`	无	有
`filt-field`	渲染值参数	`String`	无	有
`tip`	提示词	`String`	`唯一值渲染`	有

5. 简单渲染

<gw-simple-render-arc
   v-if="asyncData"
   :map-obj.sync="map"
   :render-url="renderUrl"
   :size-info="sizeInfo"
   :tip="tip"
></gw-simple-render-arc>

  data() {
    return {
      asyncData: false,
      map: {},
      renderUrl:
        'http://localhost:6080/arcgis/rest/services/Basic/China_POI/MapServer/0',
      sizeInfo: {
        // 分级字段
        field: 'pm2_5',
        valueUnit: 'unknown',
        // 符号大小
        minSize: 1,
        maxSize: 50,
        // 分级数值范围
        minDataValue: 0,
        maxDataValue: 500
      },
      tip: 'pm2.5简单渲染'
    }
  }

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Arcgis`规范下的`map`对象	无	有
`render-url`	渲染服务	`String`	无	有
`size-info`	符号分级参数	`Object`	无	有
`tip`	提示词	`String`	`简单渲染`	有

6. 分级渲染

<gw-classbreaks-render-arc
  v-if="asyncData"
  :map-obj.sync="map"
  :filt-field="filtField"
  :render-url="renderUrl"
  :tip="tip"
></gw-classbreaks-render-arc>

  data() {
    return {
      asyncData: false,
      map: {},
      renderUrl:
        'http://localhost:6080/arcgis/rest/services/Basic/China_POI/MapServer/0',
      filtField: 'AQI',
      tip: 'AQI分级渲染'
    }
  }

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Arcgis`规范下的`map`对象	无	有
`render-url`	渲染服务	`String`	无	有
`filt-field`	渲染值参数	`String`	无	有
`tip`	提示词	`String`	`分级渲染`	有

7. 热力图渲染

<gw-heatmap-render-arc
  v-if="asyncData"
  :map-obj.sync="map"
  :filt-field="filtField"
  :render-url="renderUrl"
  :tip="tip"
></gw-heatmap-render-arc>

  data() {
    return {
      asyncData: false,
      map: {},
      renderUrl:
        'http://localhost:6080/arcgis/rest/services/Basic/China_POI/MapServer/0',
      filtField: 'pm2_5',
      tip: '热力图渲染'
    }
  }

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Arcgis`规范下的`map`对象	无	有
`render-url`	渲染服务	`String`	无	有
`filt-field`	渲染值参数	`String`	无	有
`tip`	提示词	`String`	`热力图渲染`	有

8. Tile图层加载

<gw-load-tile-lt
   v-if="asyncData"
   :map-obj.sync="map"
   :layer-url="layerUrl"
   @click="fn"
></gw-load-tile-lt>

  data() {
    return {
      asyncData: false,
      map: {},
      layerUrl:
        'http://webrd01.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x={x}&y={y}&z={z}'
    }
  },
  methods: {
    fn(e) {
      // 地图动作函数
    }
  }

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Map`对象	无	有
`layer-url`	tile服务	`String`	无	有
`click`	点击函数	`function`	无	无

9. 闪烁点

<gw-twinkle-point-sm-lt
  v-if="asyncData"
  :map-obj.sync="map"
  :data-url="dataUrl"
></gw-twinkle-point-sm-lt>

  data() {
    return {
      asyncData: false,
      map: {},
      layerUrl: 'http://webrd01.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x={x}&y={y}&z={z}',
      dataUrl: 'https://iserver.supermap.io/iserver/services/data-DynamicData/rest/data'
    }
  }

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Map`对象	无	有
`data-url`	数据服务	`String`	无	有

闪烁样式未上图

10. 加载图层

<gw-load-layer-sm-lt
  v-if="asyncData"
  :map-obj.sync="map"
  :layer-obj.sync="layerObj"
  :layer-type="layerType"
  :layer-url="layerUrl"
  :layer-options="layerOptions"
  @click="fn"
></gw-load-layer-sm-lt>

  data() {
    return {
      asyncData: false,
      map: {},
      layerObj: {},
      layerType: 'TiledMap',
      layerUrl: 'https://iserver.supermap.io/iserver/services/map-world/rest/maps/World',
      layerOptions: {}
    }
  }

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Map`对象	无	有
`layer-type`	服务类型	矢量 / 影像 / 百度 / 天地图 / 瓦片	`’TiledMap‘`	有
`layer-url`	数据服务	`String`	无	有
`layer-options`	扩展项	`Object` 参考`iClient`规范	无	有

`layerType`	类型
`TiledMap`	矢量
`ImageMap`	影像
`BaiduTile`	百度地图
`TiandituTile`	天地图
`WMTS`	瓦片地图

11. 鹰眼图

<gw-mini-map-sm-lt v-if="asyncData" :map-obj.sync="map" ></gw-mini-map-sm-lt>

  data() {
    return {
      asyncData: false,
      map: {},
      miniUrl: 'https://iserver.supermap.io/iserver/services/map-world/rest/maps/World',
      miniOptions: {}
    }
  }

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Map`对象	无	有
`mini-url`	鹰眼图地址	`String`	无	有
`mini-options`	配置项	`Object`	`{ position: undefined }`	有

有Bug，待回复，4.9
解决，有引用，显示无官方样式及右下角缩小标，待回复。4.12

12. 缩放

<gw-zoom-map-lt v-if="asyncData" :map-obj.sync="map"></gw-zoom-map-lt>

  data() {
    return {
      asyncData: false,
      map: {}
    }
  }

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Map`对象	无	有
`options`	扩展项	`Object`	`{}`	是

13. 比例尺

<gw-scale-map-lt v-if="asyncData" :map-obj.sync="map"></gw-scale-map-lt>

  data() {
    return {
      asyncData: false,
      map: {}
    }
  }

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Map`对象	无	有
`options`	扩展项	`Object`	`{}`	是

14. 切换底图

<gw-switch-layer-lt
  v-if="asyncData"
  :map-obj.sync="map"
  :base-maps="baseMaps"
></gw-switch-layer-lt>

  data() {
    return {
      asyncData: false,
      map: {},
      baseMaps: []
    }
  }

    init(that) {
      var baseMaps = []
      // baseMaps[底图名称，地图服务链接，服务类型，扩展项]
      baseMaps.push([
        'China',
        'https://iserver.supermap.io/iserver/services/map-china400/rest/maps/China',
        'TiledMap',
        {}
      ])
      baseMaps.push([
        'ChinaDark',
        'https://iserver.supermap.io/iserver/services/map-china400/rest/maps/ChinaDark',
        'TiledMap',
        {}
      ])
      that.baseMaps = baseMaps
    }

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Map`对象	无	有
`base-maps`	底图对象集合	`Array`	`[]`	是

15. 绘制工具组

<gw-draw-group-lt
  v-if="asyncData"
  :map-obj.sync="map"
  :options="options"
></gw-draw-group-lt>

  data() {
    return {
      asyncData: false,
      map: {},
      options: {}
    }
  }

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Map`对象	无	有
`options`	扩展项	`Object`	`{}`	是

16. 捕捉绘制

<gw-capture-draw-lt
  v-if="asyncData"
  :map-obj.sync="map"
  :options="options"
></gw-capture-draw-lt>

  data() {
    return {
      asyncData: false,
      map: {},
      options: {}
    }
  }

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Map`对象	无	有
`options`	扩展项	`Object`	`{}`	是

17. 服务区分析

<gw-service-area-find-sm-lt
  v-if="asyncData"
  :map-obj.sync="map"
  :service-url="serviceUrl"
  :center-point="centerPoint"
></gw-service-area-find-sm-lt>

data() {
  return {
    asyncData: false,
    map: {},
    serviceUrl:
      'https://iserver.supermap.io/iserver/services/transportationanalyst-sample/rest/networkanalyst/RoadNet@Changchun',
    centerPoint: [-3375, 5605]
  }
}

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Map`对象	无	有
`service-url`	分析服务	`String`	无	有
`center-point`	服务区经纬度	`Array`	无	有

18. 缓冲区分析

<gw-buffer-analyst-sm-lt
  v-if="asyncData"
  :map-obj.sync="map"
  :service-url="serviceUrl"
  :parameters="parameters"
  :analyst-result.sync="analystResult"
></gw-buffer-analyst-sm-lt>

data() {
  return {
    asyncData: false,
    map: {},
    serviceUrl:
      'https://iserver.supermap.io/iserver/services/spatialanalyst-changchun/restjsr/spatialanalyst',
	parameters: {
      dataset: 'RoadLine2@Changchun',
      filter: "NAME='团结路'"
    },
    analystResult: {}
  }
}

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Map`对象	无	有
`service-url`	分析服务	`String`	无	有
`parameters`	分析参数	`Object`	无	有
`analyst-result`	接收分析结果	`Object`	`{}`	不接收
`dataset`	数据源中的数据集	`String`	无	无
`filter`	过滤条件	`String`	无	无

19. 泰森多边形分析

<gw-voronoi-analyst-sm-lt
  v-if="asyncData"
  :map-obj.sync="map"
  :service-url="serviceUrl"
  :parameters="parameters"
  :analyst-result.sync="analystResult"
></gw-voronoi-analyst-sm-lt>

data() {
  return {
    asyncData: false,
    map: {},
    serviceUrl:
      'https://iserver.supermap.io/iserver/services/spatialanalyst-changchun/restjsr/spatialanalyst',
	parameters: {
      dataset: 'Factory@Changchun'
    },
    analystResult: {}
  }
}

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Map`对象	无	有
`service-url`	分析服务	`String`	无	有
`parameters`	分析参数	`Object`	无	有
`analyst-result`	接收分析结果	`Object`	`{}`	不接收
`dataset`	数据源中的数据集	`String`	无	无

20. 表面分析

<gw-surface-analyst-sm-lt
  v-if="asyncData"
  :map-obj.sync="map"
  :service-url="serviceUrl"
  :parameters="parameters"
  :analyst-result.sync="analystResult"
></gw-surface-analyst-sm-lt>

data() {
  return {
    asyncData: false,
    map: {},
    serviceUrl:
      'https://iserver.supermap.io/iserver/services/spatialanalyst-sample/restjsr/spatialanalyst',
	parameters: {
      polygonset: [
        [4510338, -2010338],
        [4510338, 1063524],
        [3150322, 1063524],
        [3150322, -2010338]
      ],
        dataset: 'SamplesP@Interpolation',
        resolution: 9000,
        zValueFieldName: 'AVG_TMP'
    },
    analystResult: {}
  }
}

值	含义	类型	默认值	校验
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Map`对象	无	有
`service-url`	分析服务	`String`	无	有
`parameters`	分析参数	`Object`	无	有
`analyst-result`	接收分析结果	`Object`	`{}`	不接收
`polygonset`	分析区域	`Array`	无	无
`dataset`	数据源中的数据集	`String`	无	无
`resolution`	分辨率	`Number`	无	无
`zValueFieldName`	用于提取操作的字段	`String`	无	无

21. 叠加分析

<gw-overlayer-analyst-sm-lt
  v-if="asyncData2"
  :map-obj.sync="map"
  :service-url="serviceUrl"
  :parameters="parameters"
  :analyst-result.sync="analystResult"
></gw-overlayer-analyst-sm-lt>

data() {
  return {
    asyncData2: false,
    map: {},
    serviceUrl:
      'https://iserver.supermap.io/iserver/services/spatialanalyst-sample/restjsr/spatialanalyst',
	parameters: {
      sourceDataset: 'BaseMap_R@Jingjin',
      operateDataset: 'Neighbor_R@Jingjin',
      tolerance: 0
    },
    analystResult: {}
  }
}

值	含义	类型	默认值	校验
`asyncData2`	渲染开关，和图层不同，控制叠加顺序	`Boolean`	`false`	不接收
`map-obj`	`map`对象	`Map`对象	无	有
`service-url`	分析服务	`String`	无	有
`parameters`	分析参数	`Object`	无	有
`analyst-result`	接收分析结果	`Object`	`{}`	不接收
`sourceDataset`	源数据集	`String`	无	无
`operateDataset`	操作数据集	`String`	无	无
`tolerance`	容限	`Number`	`0`	无

Scene系列

需要new一个viewer对象挂载在window上

1.设置相机参数

<gw-fly-to-view
 v-if="asyncData"
 :camera-params="cameraParams"
></gw-fly-to-view>

data() {
  return {
    asyncData: false,
    cameraParams: {
      destination: {
        longitude: 114.2158,
        latitude: 22.4169,
        height: 419
      },
      orientation: {
        direction: {
          x: 0.5945902470233576,
          y: -0.4793925407032518,
          z: 0.6454806194323606
        },
        up: {
          x: -0.1629169048778112,
          y: 0.7143202157541026,
          z: 0.6805914424014209
        },
        heading: 5.899584294129949
      }
    }
  }
}

值	含义	类型	默认值	校验
`viewer`	全局`viewer`对象，挂载到`window`	`Object`	无	无
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`cameraParams`	相机参数	`Object`	无	有
`destination`	WGS84世界坐标系中的最终位置	`Object`	无	无
`longitude`	以度为单位的经度值	`Number`	无	无
`latitude`	以度为单位的纬度值	`Number`	无	无
`height`	以米为单位的椭球高	`Number`	`0.0`	无
`orientation`	属性集合	`Object`	无	无
`direction`	方位	`Number`	无	无
`up`	上方向	`Number`	无	无
`heading`	方位角	`Number`	无	无
`pitch`	俯仰角	`Number`	无	无
`roll`	滚动角	`Number`	无	无

2. 叠加BingMap地图

<gw-add-bingmap-image-provider
  v-if="asyncData"
  :image-data="imageData"
></gw-add-bingmap-image-provider>

data() {
  return {
    asyncData: false,
    imageData: {
      url: 'https://dev.virtualearth.net',
      key: UrlC.URL_CONFIG.BING_MAP_KEY
    }
  }
}

值	含义	类型	默认值	校验
`viewer`	全局`viewer`对象，挂载到`window`	`Object`	无	无
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`imageData`	地图服务参数	`Object`	无	有

3. 叠加地形图

<gw-add-terrain-provider
  v-if="asyncData"
  :terrain-url="terrainUrl"
></gw-add-terrain-provider>

data() {
  return {
    asyncData: false,
    scmUrl: UrlC.URL_CONFIG.SCENE_XGPARK
  }
}

值	含义	类型	默认值	校验
`viewer`	全局`viewer`对象，挂载到`window`	`Object`	无	无
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`terrain-url`	`STK`地形服务	`String`	无	有

4. 叠加OpenStreetMap地图

<gw-add-openstreetmap-image-provider
  v-if="asyncData"
  :image-data="imageData"
></gw-add-openstreetmap-image-provider>

data() {
  return {
    asyncData: false,
    imageData: {
      url: 'https://a.tile.openstreetmap.org/'
    }
  }
}

值	含义	类型	默认值	校验
`viewer`	全局`viewer`对象，挂载到`window`	`Object`	无	无
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`imageData`	地图服务参数	`Object`	无	有

5. 叠加图层组

<gw-add-image-provider-group
  v-if="asyncData"
  :image-data-set="imageDataSet"
></gw-add-image-provider-group>

data() {
  return {
    asyncData: false,
    imageDataSet: [
      {
        name: '墨卡托投影坐标系',
        url: UrlC.URL_CONFIG.SUPERMAP_IMG_MEC,
        value: 'MEC'
      },
      {
        name: '经纬度坐标系',
        url: UrlC.URL_CONFIG.SUPERMAP_IMG_WGS,
        value: 'WGS'
      }
    ]
  }
}

值	含义	类型	默认值	校验
`viewer`	全局`viewer`对象，挂载到`window`	`Object`	无	无
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`imageDataSet`	图层组`默认选中第一个`	`Array`	无	`lengt != 0`
`name`	图层名称	`String`	无	无
`url`	图层服务	`String`	无	无
`value`	标拾	`String`	无	无

6. 时态动画

<gw-image-providers-animation
  v-if="asyncData"
  :image-urls="imageUrls"
></gw-image-providers-animation>

data() {
  return {
    asyncData: false,
    imageUrls: [
      UrlC.URL_CONFIG.TENSE_IMG0,
      UrlC.URL_CONFIG.TENSE_IMG1,
      UrlC.URL_CONFIG.TENSE_IMG2,
      UrlC.URL_CONFIG.TENSE_IMG3,
      UrlC.URL_CONFIG.TENSE_IMG4,
      UrlC.URL_CONFIG.TENSE_IMG5
    ]
  }
}

值	含义	类型	默认值	校验
`viewer`	全局`viewer`对象，挂载到`window`	`Object`	无	无
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`imageUrls`	影像服务数组	`Array`	无	`lengt > 3`

7. 地形开挖

<gw-terrain-excavation
  v-if="asyncData"
  :stk-url="stkUrl"
></gw-terrain-excavation>

data() {
  return {
    asyncData: false,
    stkUrl:
        'https://www.supermapol.com/realspace/services/3D-stk_terrain/rest/realspace/datas/info/data/path'
  }
}

值	含义	类型	默认值	校验
`viewer`	全局`viewer`对象，挂载到`window`	`Object`	无	无
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`stkUrl`	开挖图层	`String`	无	有

8. 通视分析

<gw-general-analyst
  v-if="asyncData"
  :cbd-url="cbdUrl"
></gw-general-analyst>

data() {
  return {
    asyncData: false,
    cbdUrl: UrlC.URL_CONFIG.SCENE_CBD
  }
}

值	含义	类型	默认值	校验
`viewer`	全局`viewer`对象，挂载到`window`	`Object`	无	无
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`cbd-url`	CBD模型服务	`String`	无	有

9. 淹没模型分析

<gw-flood-model-analyst
  v-if="asyncData"
  :scm-url="scmUrl"
></gw-flood-model-analyst>

data() {
  return {
    asyncData: false,
    scmUrl: UrlC.URL_CONFIG.SCENE_XGPARK
  }
}

值	含义	类型	默认值	校验
`viewer`	全局`viewer`对象，挂载到`window`	`Object`	无	无
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`scm-url`	s3m模型服务	`String`	无	有

10. 淹没地形分析

<gw-add-terrain-provider
  v-if="asyncData"
  :terrain-url="terrainUrl"
></gw-add-terrain-provider>

data() {
  return {
    asyncData: false,
    terrainUrl: UrlC.URL_CONFIG.STK
  }
}

值	含义	类型	默认值	校验
`viewer`	全局`viewer`对象，挂载到`window`	`Object`	无	无
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`terrain-url`	`STK`地形服务	`String`	无	有

11. 填挖方分析

<gw-cut-fill-analyst
  v-if="asyncData"
  :scene-url="sceneUrl"
  :spatial-data-url="spatialDataUrl"
></gw-cut-fill-analyst>

data() {
  return {
    asyncData: false,
    sceneUrl:
      'http://www.supermapol.com/realspace/services/3D-dxyx_ios2/rest/realspace',
    spatialDataUrl:
      'http://www.supermapol.com/realspace/services/spatialAnalysis-dxyx_ios/restjsr/spatialanalyst/datasets/DEM@%E5%9B%9B%E5%A7%91%E5%A8%98%E5%B1%B1/terraincalculation/cutfill.json?returnContent=true'
  }
}

值	含义	类型	默认值	校验
`viewer`	全局`viewer`对象，挂载到`window`	`Object`	无	无
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`scene-url`	场景服务	`String`	无	有
`spatial-data-url`	空间数据服务	`String`	无	有

12. 三维标绘

<gw-plotting-util-primitive v-if="asyncData"></gw-plotting-util-primitive>

data() {
  return {
    asyncData: false
  }
}

值	含义	类型	默认值	校验
`viewer`	全局`viewer`对象，挂载到`window`	`Object`	无	无
`asyncData`	渲染开关	`Boolean`	`false`	不接收

13. GLTF模型

<gw-add-gltf-entities
  v-if="asyncData"
  :gltf-url="gltfUrl"
  :position="position"
  :is-zoom-to="isZoomTo"
></gw-add-gltf-entities>

data() {
  return {
    asyncData: false,
    gltfUrl:
      'http://support.supermap.com.cn:8090/webgl/examples/webgl/SampleData/gltf/man/walk.gltf',
    position: {
      destination: {
        longitude: 116.731444,
        latitude: 39.528856,
        height: 0
      }
    },
    isZoomTo: true
  }
}

值	含义	类型	默认值	校验
`viewer`	全局`viewer`对象，挂载到`window`	`Object`	无	无
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`gltf-url`	`GLTF`模型地址	`String`	无	有
`position`	模型位置`Cesium.Cartesian3.fromDegrees`的经纬度及高程值	`Object`	无	有
`isZoomTo`	是否缩放至	`Boolean`	`true`	有

14. KML文件

<!-- 添加到当前位置 -->
<gw-add-kml-data v-if="asyncData" :kml-url="kmlUrl"></gw-add-kml-data>

data() {
  return {
    asyncData: false,
    kmlUrl: 'http://support.supermap.com.cn:8090/webgl/examples/webgl/SampleData/kml/crane.kml'
  }
}

值	含义	类型	默认值	校验
`viewer`	全局`viewer`对象，挂载到`window`	`Object`	无	无
`asyncData`	渲染开关	`Boolean`	`false`	不接收
`kml-url`	`KML`文件地址	`String`	无	有

15. 下载场景

<gw-download-picture v-if="asyncData"></gw-download-picture>

data() {
  return {
    asyncData: false
  }
}

值	含义	类型	默认值	校验
`viewer`	全局`viewer`对象，挂载到`window`	`Object`	无	无
`asyncData`	渲染开关	`Boolean`	`false`	不接收

Devin·Finn

关注

3
点赞
踩
12

收藏

觉得还不错? 一键收藏
8
评论
基于Vue的GIS组件GISView的API文档

GISView API基于Vue的GIS组件版本：1.2.12021.04.28npm传送门CSDN起步初始化vue项目vue tese demo安装组件库npm install gisviewpackpage.json"dependencies": { "@geoman-io/leaflet-geoman-free": "^2.10.0", "@supermap/iclient-leaflet": "^10.1.2", "core-js"
复制链接

扫一扫