0.0.26 • Published 12 months ago

ymapbox v0.0.26

Weekly downloads
-
License
ISC
Repository
-
Last release
12 months ago

注意事项

  1. 请在页面中添加dom结构:<div id="g-map"></div>
  2. 请使用组件导出的 mapboxgl,不要使用自行安装的 mapboxgl
  3. 请先初始化地图图层:new YMapbox(),然后使用其它图层;

导出的图层

图层列表

export default YMapbox

export { mapboxgl, BaseLayer, GridLayer, EchartsLayer, ContourLayer, DrawLayer, MarkerLayer };

类名图层名称说明
BaseLayer基础图层抽象类,所有图层的基类,提供地图相关的共用方法
YMapbox地图用于初始化地图,已经绑定地图事件
ContourLayer等值线图层栅格数据为二维数组,离散点数据为json数组
GridLayer色斑图层数据是一维数组
MarkerLayer打点图层
DrawLayer绘制图层可以绘制点、线、面、圆、多边形、态势图等
EchartsLayerechars图层集成Echarts的图层

BaseLayer

说明

  • 抽象类,所有图层的基类,提供地图相关的共用方法

属性

属性名类型说明
mapmapboxgl.Map实例化的map
eventList事件基类实例化的事件对象

方法

方法名参数说明
init受保护的抽象方法,每一步操作的方法调用,尽量写在init里,逻辑清晰点

YMapbox

说明

  • 用于初始化地图,new YMapbox(options)

参数

参数名类型默认值说明

方法

参数名参数说明

GridLayer

说明

  • 用于绘制色斑图地图,new GridLayer(data, initOptions, cb)

属性

属性名类型说明
imageIndexnumberSetter/Getter,通过设置索引切换色斑图

参数

参数名类型默认值说明
datadataType[][]必填二维数组的每一项,就是一个面的格点数据;如果传入了多个面的数据,可以通过imageIndex切换要显示色斑图
initOptionsExclude<IGridOptions, "levelList">;必填见参数详情
cb()=>void可选渲染后的回调
参数详情:
type dataType = number | string

type renderType = "bitmap" | "pixel"
type refreshType = "all" | "vertex" | "color" | "index"

interface IOptions {
  renderType: renderType[];
  gridOptions: Exclude<IGridOptions, "levelList">;
  legend: ILegend[];
  invalidVal?: dataType[];
}

interface ILegend {
  value: number | string
  color: [number, number, number, number?]
  filter?: boolean
  label?: string
}

interface IGridOptions {
  startLon: number;
  endLon: number;
  lonCount: number;
  lonStep: number;
  startLat: number;
  endLat: number;
  latCount: number;
  latStep: number;
  levelList?: number[]; //gridLayer不需要这个参数
  altitude?: number; //高度位置
  altScale?: number; //高度位置的缩放比例
}

方法

参数名参数默认值说明
refreshLayerdata: dataType[]必填格点数据,一维数组;每更新一次,会缓存数据到色斑图数组的末尾,下一次通过imageIndex可以切换色斑图
options: IOptions必填见构造方法的参数详情
refreshType: Exclude<refreshType, "index">[]all等于vertexall时,根据起始经纬度等参数调整色斑图的范围/高度;等于colorall时,会根据新图例调整色斑图的颜色
animationinterval200interval毫秒刷新一帧
step0.1按step的系数,进行插值
endAnimation"pause" | "quit""pause"等于pause时,停止动画;等于quit时,退出动画,还原到第一张色斑图
type refreshType = "all" | "vertex" | "color" | "index"