# new Ships66.layers.TrackLayer

new Ships66.layers.TrackLayer()

继承RenderLayer继承RenderLayer

实例属性说明

属性名 说明
layers 存放轨迹 Collection (opens new window)

事件说明

事件通过实例对象.layers.on('事件名','回调函数')触发,详情查阅openlayers (opens new window)

事件名 说明 回调参数
enter 鼠标悬停在轨迹点(feature (opens new window))上一秒后触发 function(e){}
leave 鼠标离开轨迹点触发(在成片的要素中该函数可能不会触发) function(e){}
//示例
const tarckLayer = new Ships66.layers.TrackLayer()
tarckLayer.layers.on('enter',e=>{
    console.log(e)
})

# 实例方法


# pushLayer(res,mmsi,option,renderOption) => {Vector}

添加单条轨迹到地图
返回值继承layer/Vector (opens new window)

参数 说明 类型
res 渲染的数据 Object
mmsi 轨迹的mmsi String
option layer/Vector (opens new window)配置项参数 Object
renderOption 配置项,见下方说明 Object

res格式如下:

WARNING

mmsi数组需要按照降序排列;如果是用船顺提供的轨迹接口(时间生序),需要自行reverse()一下

{
  "mmsi":  [
    {
      "lon":"经度",
      "lat":"纬度",
      "speed": "航速",
      "cog": "航向",
      "createdAt": "时间戳",
      "sailStatus": "航行状态"
    },
    {
      "lon":"经度",
      "lat":"纬度",
      "speed": "航速",
      "cog": "航向",
      "createdAt": "时间戳",
      "sailStatus": "航行状态",
      "state": "停/慢"
    }
  ]
}

TIP

停/慢标识通过res数组对象中state字段来判断,state字段为0时为停止状态,为1时为缓慢状态 不传则没有状态标识

renderOption配置项
属性 说明 类型 默认值
startEndIcon 始末点图标 String(Unicode) -
startColor 起始点图标颜色 String #fcdc3f
endColor 结束点图标颜色 String #ff0000
dropletsIcon 航行状态背景图标 String (Unicode)
stopIcon 停止状态图标 String (Unicode)
slowIcon 缓慢状态图标 String (Unicode)
stopColor 停止状态图标颜色 String #E31818
slowColor 缓慢状态图标颜色 String #1890FF
arrowIcon 箭头图标 String (Unicode) -
trackColor 轨迹颜色 String #00ff00
realColor 轨迹播放过的颜色 String #999
labelLineStyle 标签线颜色 String #000
labelLineStyle 标签线颜色 String #000
labelTextColor 标签字体颜色 String #000

# setAtLayer(i, result, mmsi, option, renderOption)

更新单条轨迹
i : 要更新的轨迹数组中的索引,其他参数同pushLayer


# getTrackLayer(i) => {layer}

根据索引获取轨迹
返回:轨迹实例 | null


# removerLayer(i)

根据索引删除轨迹


# removeAllLayer()

删除所有轨迹


# setAllTrackVisible(visible)

设置所有轨迹显示状态
visible : true|false

# setLayerInactive(i)

设置索引轨迹处于激活状态

# 轨迹的播放

❗️ 以下的方法都需要先获取单个轨迹的实例 getTrackLayer(i)

# handlePlay

播放轨迹


# handlePause(isEnd)

暂停或结束轨迹
isEnd : 是否结束播放 true|false

# setSpeed(num)

设置轨迹播放速度