引入功能模块
从 2.5 版本开始,Fengmap SDK 提供了新的模块化加载 Javascript 库文件的方式,您可根据项目的不同应用场景,有选择性的加载不同的模块,从而降低资源占用,提升加载效率。拆分后模块分别为核心模块(fengmap.core)、控件模块(fengmap.control)、计算模块(fengmap.analyze)和导航模块(fengmap.navi)。
模块化功能说明
核心模块 fengmap.core,使用 Fengmap SDK 所必须的核心功能模块,需要在其他模块前引用。包含常规渲染和数据解析,以及通用功能,如:地图显示、事件、覆盖物、搜索查询等功能,如果您的地图仅用于大屏展示,只引入核心模块即可满足需求;
计算模块 fengmap.analyze,及导航模块 fengmap.navi, 如果除基础展示外,还要使用路径分析计算、真实定位导航或模拟导航功能,必须再加载该模块;
控件模块 fengmap.control, 如果要使用 SDK 内置的地图控件,须在核心功能模块基础上加载该模块,主要包含楼层控件、指北针、相机切换、信息窗等控件;
常规页面引入方式
全模块引入方式
<!-- 引入fengmap -->
<script src="lib/fengmap.core.min.js"></script>
<script src="lib/fengmap.control.min.js"></script>
<script src="lib/fengmap.analyzer.min.js"></script>
<script src="lib/fengmap.navi.min.js"></script>
地图核心组件引入方式
<!-- 引入fengmap -->
<script src="lib/fengmap.core.min.js"></script>
地图控件模块引入方式
<!-- 引入fengmap -->
<!--fengmap.control控件模块需依赖于fengmap.core模块使用-->
<script src="lib/fengmap.core.min.js"></script>
<script src="lib/fengmap.control.min.js"></script>
地图计算、导航模块引入方式
<!-- 引入fengmap -->
<!--fengmap.analyzer计算模块、fengmap.navi导航模块一般组合使用,依赖于fengmap.core核心模块-->
<script src="lib/fengmap.core.min.js"></script>
<script src="lib/fengmap.analyzer.min.js"></script>
<script src="lib/fengmap.navi.min.js"></script>
npm框架引入方式
Vue/React框架下的引入方式
import fengmap from "fengmap"; //全量包
// or 按需引入
import fengmap from "fengmap/build/plugins/fengmap.core.min"; //核心包
import "fengmap/build/plugins/fengmap.control.min"; //控件
// 导航需要引入以下两个包:
import "fengmap/build/plugins/fengmap.analyzer.min"; //路径分析类
import "fengmap/build/plugins/fengmap.navi.min"; //导航类