地图

openalyers

更新日志

使用方法

const map = ref()

<c-ol ref="map" :layers="['/tile?x={x}&y={y}&z={z}']"></c-ol>

属性

| 属性名 | 类型 | 描述 | 默认值 | | ------------- | --------------- | --------------------------------- | --------- | | layers | array | 瓦片图层地址 | [ ] | | worker | boolean | 开启多线程 (瓦片图层需要使用代理) | false | | center | [number,number] | 中心点坐标 | [105, 38] | | zoom | number | 缩放比例 | 4 | | mousePosition | [number,number] | 鼠标坐标（双向绑定） | |

方法

| 方法名称 | 参数 | 返回值 | 说明 | | ------------ | ------------------------------------------------------------------ | ---------------- | -------------------- | | getMap | | Map | 获取地图实例 | | getZoom | | number | 获取地图缩放级别 | | getCenter | | [number, number] | 获取地图中心点坐标 | | change | { longitude, latitude, duration, zoom } | | 设置地图中心点和缩放 | | addLayer | urls:string | string[] | | 添加矢量图层 | | removeLayer | urls:string | string[] | | 根据url删除矢量图层 | | addOverlay | element : Element position : [number,number] id? : any | | 添加标注 | | getOverlay | id : any | Overlay | 获取标注实例 | | setOverlay | position : [number,number] id : any | | 设置标注位置 | | clearOverlay | | | 清除所有标注 |

事件

| 事件名 | 参数 | 说明 | | --------- | --------------------------------------- | -------------- | | click | point: [number,number], features: any[] | 点击地图时触发 | | mousemove | point: [number,number] | 移动鼠标时触发 |