mapcontext.smoothmovemarker(object object)
基础库 或更高版本； 且 支付宝客户端 10.1.90 或更高版本； 若版本较低，建议采取 兼容处理 。
支小宝客户端 支持
安诊儿客户端 支持
小程序开发者工具： 不支持。
主体： 企业支付宝小程序 、 个人支付宝小程序
沿指定路径平滑移动点标记。
也可使用此 api 结束进行中的 marker 动画（入参 action 字段传 'stop'）。
marker 移动过程中会触发 onmarkermove 和 onmarkermovend 事件。可以通过 map 组件注册其回调函数，如：
onmarkermove
marker 移动经过 targetdistances 中的每个距离时，触发此事件。回调函数将收到一个 object 类型的参数，包含如下属性：
| 属性 | 类型 | 描述 |
|---|---|---|
| longitude | number | 经度。 |
| latitude | number | 纬度。 |
| targetdistance | number | 距起点的距离。 |
| index | number | 当前 targetdistance 在 targetdistances 中的索引。 |
onmarkerend
marker 移动结束时，触发此事件
object object
查看示例
| 属性 | 类型 | 默认值 | 必填 | 描述 | |||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| markerid | number | string | - | 是 | 执行滑动的 marker 的 id。客户端 10.3.70 开始支持 string 类型 |
|||||||||||||||||
| markerdata | object | - | 否 | 执行滑动的 marker 数据。传入时，将使用此数据新建一个 marker 进行滑动。marker 对象中的 id 必须等于 markerid |
|||||||||||||||||
|
|||||||||||||||||||||
| points | array | - | 是 | 经纬度数组，确定移动路径。 |
|||||||||||||||||
|
|||||||||||||||||||||
| duration | number | 5000 | 否 | 移动时间，单位毫秒 |
|||||||||||||||||
| targetdistances | array |
- | 否 | 指定需要 onmarkermove 回调的目标距离数组 |
|||||||||||||||||
| action | string | start | 否 | 操作类型 |
|||||||||||||||||
|
|||||||||||||||||||||
| success | function | - | 否 | 调用成功的回调函数 |
|||||||||||||||||
| fail | function | - | 否 | 调用失败的回调函数 |
|||||||||||||||||
| complete | function | - | 否 | 调用结束的回调函数（调用成功、失败都会执行） |
fail 回调的参数为 object，error 属性为错误码，errormessage 属性为错误消息。
| 错误码 | 错误消息 | 凯发app官方网站的解决方案 |
|---|---|---|
| 2 | 参数错误 |
points 数组长度须大于 1。 |
| 10001 | 未指定 marker |
传入有效的 markerid。 |
<view>
<map
id="map"
longitude="120.131441"
latitude="30.279383"
onmarkermove="markermove"
onmarkermoveend="markermoveend"
style="width: 100%; height: 200px;"
>map>
<view ontap="smoothmovemarker">滑动 markerview>
view>
page({
data: {
mapctx: null
},
onready() {
this.data.mapctx = my.createmapcontext('map');
},
smoothmovemarker() {
const anipoints = [
{
latitude: 30.261775,
longitude: 120.102507,
},
{
latitude: 30.262794,
longitude: 120.103816,
},
{
latitude: 30.264036,
longitude: 120.10491,
},
{
latitude: 30.265194,
longitude: 120.10609,
},
{
latitude: 30.265824,
longitude: 120.107217,
},
{
latitude: 30.267446,
longitude: 120.109749,
},
{
latitude: 30.268715,
longitude: 120.112721,
},
];
this.data.mapctx.smoothmovemarker({
// 需执行动画的 marker id
markerid: 10,
// 需要执行动画的 marker 对象
markerdata: {
id: 10,
latitude: 30.261775,
longitude: 120.102507,
width: 19,
height: 31,
iconpath: 'https://gw.alipayobjects.com/mdn/rms_dfc0fe/afts/img/a*x9yerpemtrsaaaaaaaaaaaaaarqnaq',
},
// 经纬度数组，指定移动路径
points: anipoints,
// 经过距起点 100m、200m、300m、600m 的位置时，触发 onmarkermove 事件
targetdistances: [100, 200, 300, 600],
success: res => {
console.log('success' json.stringify(res))
},
fail: err => {
console.log('err' json.stringify(err))
}
});
settimeout(() => {
this.data.mapctx.smoothmovemarker({
markerid: 10,
action: 'stop', // 停止动画（marker 会被直接移到终点）
});
}, 2000);
},
markermove(e) {
my.alert({ content: 'markermove: ' json.stringify(e.detail) });
},
markermoveend(e) {
my.alert({ content: 'markermoveend: ' json.stringify(e.detail) });
},
});