MapContext.translateMarker

2020-08-26 16:37 更新

解释:平移 marker ,带动画 。

方法参数

Object object

object 参数说明

属性名类型默认值必填说明

markerId

Number

是

指定 marker

destination

Object

是

指定 marker 移动到的目标点

autoRotate

Boolean

是

移动过程中是否自动旋转 marker

rotate

Number

是

marker 的旋转角度

duration

Number

1000ms

否

动画持续时长,平移与旋转分别计算。

animationEnd

Function

否

动画结束时回调函数

success

Function

否

接口调用成功的回调函数

fail

Function

否

接口调用失败的回调函数

complete

Function

否

接口调用结束的回调函数(调用成功、失败都会执行)

示例 

在开发者工具中打开


图片示例

代码示例 

在开发者工具中打开

<view class="wrap">
    <map id="myMap" 
        longitude="{{longitude}}"
        latitude="{{latitude}}"
        style="width: 100%"  
        markers="{{markers}}">
    </map>
    <button type="primary" bindtap="translateMarker">平移 marker</button>
</view>
Page({
    data: {
        latitude: 40.048828,
        longitude: 116.280412,
        markers: [{
            markerId: 1,
            latitude: 40.052751,
            longitude: 116.278796
        }, {
            markerId: 2,
            latitude: 40.048828,
            longitude: 116.280412,
            callout: {
                display: 'ALWAYS',
                content: '百度科技园'
            }
        }]
    },
    onLoad() {
        this.mapContext = swan.createMapContext('myMap');
    },
    translateMarker() {
        this.mapContext.translateMarker({
            markerId: '2',
            destination: {
                latitude: 40.049655,
                longitude: 116.27505
            },
            autoRotate: true,
            rotate: 30,
            duration: 1000,
            animationEnd() {
                swan.showToast({
                    title: '动画结束啦!',
                    icon: 'none'
                });
            },
            success: res => {
                console.log('translateMarker success');
            },
            fail: err => {
                console.log('translateMarker fail', err);
            }
        });
    }
});


以上内容是否对您有帮助:
在线笔记
App下载
App下载

扫描二维码

下载编程狮App

公众号
微信公众号

编程狮公众号