如何使用GAF进行地图应用的定制开发

项目开源地址:GAF: 基于SuperMap GIS 平台,采用Spring Cloud和Vue等技术,提供权限、GIS数据、服务和二三维地图场景等功能,用于快速搭建企业级GIS SaaS的多租户微服务框架。

地图应用定制开发使用说明

 工程路径: gaf-web/

地图应用定制开发能够实现图层的加载、展示、分析以及丰富的功能,比如分屏、放大、缩小、飞行、测量、压平等;为开发者提供地图应用定制的基础,开发者可以通过前端js文件直接修改代码从而配置资源目录和工具条,也可以通过菜单配置获取ID修改接口地址,从后端获取资源目录和工具条,两种方式都可以实现地图应用的定制开发。

独立部署gaf-mapapp的开发

1.基础地图应用开发指南:

基础地图应用公共文件位置:common-mapapp\src\mapapp\pages\WebgisBasicApp 基础地图应用公开文件位置:common-mapapp\src\index.js 基础地图应用引用文件位置:gaf-mapapp\pages\map\WebgisBasicApp

开发者在拉取以上代码的前提下,进入正式的二次开发

启动工程后,如果页面不显示,解决办法:将域名更改为localhost

此板块有两种实现方式:

1)通过前端工具条(gaf-mapapp\static\config\tools.js)和资源目录(gaf-mapapp\static\config\dirs.js ) 的js文件,修改js代码直接配置资源目录和工具条

2)通过工具条管理菜单和资源目录管理菜单分别配置需要的工具条及资源目录,获取工具条、资源目录的ID, 在common-mapapp\src\mapapp\pages\WebgisBasicApp\index.vue文件中接口地址进行ID替换,从后端获取 工具条和资源目录的数据,完成配置

前后端的数据获取通过gaf-mapapp\static\config\dirs.js文件

root.SMWEBGIS.supportBackEnd = false来判断数据是否从后端获取

PS: false 前端,true 后端。

1)数据从前端获取

root.SMWEBGIS.supportBackEnd = false

工具条

  直接编辑代码即可   
  
  代码位置:gaf-mapapp\static\config\tools.js
 '' root.SMWEBGIS.tools = {
  // 右侧工具条:
  right: [
    {
      title: '放大',
      name: 'zoomIn',
      icon: 'icon-jiahao',
    },
    {
      title: '缩小',
      name: 'zoomOut',
      icon: 'icon-jianhaocu',
    },
    ]
  // 下方工具条:
  home: [
    {
          title: '垂直分屏',
          name: 'GafMapSplitScreen',
          icon: '',
          actions: [],
          selectedName: 'GafMapSplitScreen',
          params: {
            type: 'splitScreenVertical',
            ...window.SMWEBGIS.panel.splitScreen,
          },
        },
       ]}''

资源目录树

  代码位置:gaf-mapapp\sta
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值