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

公众号
微信公众号

编程狮公众号