zfmap

  本项目主要为中飞塞维提供GIS平台功能支持，本框架是一个使用ES6语法，基于VUE框架开发的一款GIS框架，本工程采用二维与三维同步的方式进行功能搭建，即整合了Openlayers和Cesium两大框架，Openlayers主要用于二维平面地图展示，Cesium主要用于三维地图展示；功能主要涉及到基础点、线、面的构建及加载，并在点、线、面元素中加入可存入属性功能，基础功能还包括长度测量、面积测量等功能；后续会新增更多功能模块，如航迹模拟动画、人员行进动画、雷达扫描、可视域分析等等系列功能。

当前版本？

v1.0.9

如何安装？

首先要在本机或服务器配置NodeJS环境，然后通过下方命令行对zfmapgis进行下载安装。

# 安装插件命令
npm i zfmap

VUE.js 项目中的配置方式

• 1、vue项目搭建

  在配置完vue所需环境后，使用 vue init webpack projectname命令进行新建项目。

• 2、安装zfmapgis插件

  在项目目录下打开命令行，使用 npm install zfmapgis --save进行安装。

• 3、Cesium的配置

  将下载的Cesium程序包解压放置在项目目录下static目录中，如 projectname/static/Cesium/Cesium.js。

• 4、Vue中的引用

  在项目根目录下打开index.html文件，引用Cesium.js及样式。

  <script type="text/javascript" src="/static/Cesium/Cesium.js"></script>
  <style>
      @import url(/static/Cesium/Widgets/widgets.css);
  </style>

VUE.js 中引用zfmapgis插件

• $\color{red}{新建一个组件用于展示地图}$

<template>
    <div>
        <div id="map">
        </div>
    </div>
</template>

• $\color{red}{引用插件并注册到VUE中}$

import Vue from "vue";
import ZFGIS from "../../dist/ZFGIS.js"
Vue.use(ZFGIS);

• $\color{red}{初始化地图组件，此时运行就可以看到地图了}$

this.zfmap = new this.$ZFMain.ZFMap({
    mapContainer: "map",
    initView: {
        center: [102.659875, 31.265487],
        zoom: 6,
        project: 'EPSG:3857'
    },
    baseMapUrls:{
        mapSync:true
    },
    terrainProviderUrl:'http://192.168.1.198/mapdata/terrain/'
});
this.zfmap.init();

更新日志

1.0.7 ： 本次主要更新WMTS中加载功能的丰富化

1.0.8 ： 在组件中添加指北针的接口功能

1.0.9 ： 在组件中添加设置限制级别缩放的功能接口