wemap-base-layer
概述
wemap-base-layer 是 wemap base 和 wemap builder 中共用的图层渲染逻辑库,该库实现base、 builder 的图层渲染逻辑的共用和打通,二者共用一套代码,一次更新,双端共用。
WeMapBaseLayer
WeMapBaseLayer
Map
WeMapBaseLayer
用于创建base地图实例。
构造函数
-
语法
new WeMapBaseLayer.Map(map, options);
地图基础
WeMapBaseLayer
Map
WeMapBaseLayer
用于创建base地图实例。
构造函数
-
语法
new WeMapBaseLayer.Map(map, options);
-
参数说明
参数名 | 类型 | 说明 |
---|---|---|
Map | TMap.Map | map实例 |
options | Object | 地图参数,对象规范详见MapOptions
|
MapOptions
参数名 | 类型 | 说明 |
---|---|---|
mapProjectId | string | wemap Base 地图Id |
dataId | String | 数据ID |
serviceIds | string[] | 服务ID 数组 |
d3TilesIds | string[] | 3D TilesId 数据 |
tifIds | tiff 影像ID数组 | |
domId | string | 地图容器ID |
httpReq | HttpReq | axios 示例,可不传 |
debug | boolean | 是否开启调试模式,开启时连接至测试环境。默认false |
HttpReq
参数名 | 类型 | 说明 |
---|---|---|
request | axiosInstance | axios 请求实例 |
reqConfig | object | Axios 的配置参数 |
extralParams | object | 请求时额外添加 的参数 |
方法 Method
方法名 | 返回值 | 说明 |
---|---|---|
getLayers() | object [] | 使用sdk绘制的图层列表 |
updateMapId(mapProjectId: string) | 无 | 切换地图id |
addServiceLayers(serviceIds: string[]) | 无 | 增加服务图层 |
removeServiceLayer(serviceIds: string[]) | ||
destroy() | 无 | 销毁sdk |
事件 Event
事件名 | 返回值 | 说明 |
---|---|---|
layerClick | layerInfo | 点击图层返回信息(仅返回点线面图层信息,服务图层信息不返回) |
layerCreated | layerInfo[] | 图层、数据、服务创建后,返回图层、数据、服务信息数组 |
error | {type: object, info:object} | 图层生成过程中遇到的错误,type可选为renderError:渲染错误,clusterError: 聚合错误,networkError:网络请求错误,info字段返回具体的错误信息 |
参数属性
示例代码
import WeMapBaseLayer from '@tlbs/wemap-base-layer';
const baseLayer = new WeMapBaseLayer(myMap, {
// mapProjectId: '',
// mapProjectId: '',
// dataId: '', // poi
// dataId: '', // 面
serviceIds: [''],
httpReq: {
reqConfig: {
baseURL: 'https://testservice.wemap.qq.com/base',
},
},
debug: true
});
baseLayer.addServiceLayer(['d96d91bc-9f89-4f0e-b7cc-a7d8d492f2ab'])
baseLayer.on('error', (e: any) => {
console.log('error', e)
})
baseLayer.on('layerClick', (e: any) => {
console.log('layerClick', e)
})
调试
- 安装依赖
npm install
- 运行打包
npm run build
cd example/base-layer-example
npm run dev
- 打包
npm build:prod