# 地图（Ships66）

# 静态属性说明

属性名 说明
layers 存放图层类
controls 存放控件
mapName 图源枚举对象
map map (opens new window)对象

# 静态方法

# 实例化

# new Ships66(key)

船顺地图的实例对象

参数 说明 类型 可选值 默认值
key 船顺密钥 String - -

方法

# init(id,viewOption, option){}

地图初始化

参数 说明 类型 可选值 默认值
id dom元素id String - -
viewPotion openlayers/view (opens new window)配置项 Object - { constrainResolution:true,multiWorld: true,enableRotation: false,extent: [Number.NEGATIVE_INFINITY, -20037508.342789244, Number.POSITIVE_INFINITY, 20037508.342789244]}
option 配置项,属性见下方 Object - -
option配置项
属性名 说明 类型 可选值 默认值
defaultName 地图默认显示的瓦片 String - layers[0]
layers 切换地图底图瓦片的集合 Array<String> - ['MT_OSM','MT_SATE']
sourceOption 自定义瓦片 Object -

sourceOption说明 目前自定义瓦片仅支持xyz图源，如需其他图源请自行百度查阅

覆盖地图基础图层：

{
  "MT_SATE": {
    "scale": 2,
    "url": "xyz图源地址"
  },
  "MT_OSM": {
    "scale": 1,
      "url": "xyz图源地址"
  }
}

自定义图层：

{
  "BAR": {
    "scale": 1, 
    "url": "xyz图源地址"
  }
}

loadTileToMap('BAR')

# changeBaseMap(sourceName)

切换底图瓦片源
sourceName : 上方option配置项 layers数组的某个值

# addControl(name,option)

添加地图控件
name可选值：mousePosition（鼠标移动显示经纬度），scaleLine(比例尺)，fullScreen(全屏)
option可配置项，不传采用默认项：openlayer control对应子类的配置项，例如mousePosition (opens new window)

TIP

如需覆盖css样式，请通过开发者模式查看元素className，覆盖处理

# loadTileToMap(sourceName,option,xyzOption)

添加图源到地图上

参数 说明 类型 可选值 默认值
sourceName 图源名字 String 见下方 -
option layer/tile (opens new window) 配置项 Object - { minZoom: 2, maxZoom: 18 }
xyzOption source/XYZ (opens new window) 配置项 Object - {}

sourceName 可选值

名字 说明
MT_CNMAP 海图
MT_TIANDI_CVA 地图标注
GREEN_DOT 船舶绿点图

TIP

添加到地图的图源会赋值在实例对象的layers属性对象中
示例：

ships.loadTileToMap('GREEN_DOT')  
const greenLayer = ships.layers['GREEN_DOT']

# getServerData(option) => {Promise}

网络请求方法
返回 Promise
option说明

属性名 说明 类型 可选值 默认值
url 请求地址 String - -
method 请求方式 String - GET
formData post请求，请求参数是否为formData Boolean - true
data 请求参数 Object - -

需要添加其他属性或者请求头参考axios (opens new window)

调用示例

getServerData({
  url:'',
  method:'post',
  data:{},
}).then(res=>{//返回的数据
  
}).catch(err=>{//失败
  
})

# getLocation() => {Promise}

定位函数
返回 Promise

TIP

电脑端浏览器定位获取的是城市定位