page({
    data: {
        mapctx: null
    },
    onready() {
        this.mapctx = my.createmapcontext('map');
    },
    // 设置比例尺控件是否可见。
    updatecomponents() {
        this.mapctx.updatecomponents({
            scale: 15, // 缩放级别
            longitude: 120.125872, // 中心经度
            latitude: 30.272960, // 中心纬度
            command: {
                // marker 动画
                markeranim: [
                    { type: 1, markerid: 1 },
                    { type: 1, markerid: 2 },
                ],
            },
            setting: {
                gestureenable: 1, // 开启手势功能
                showscale: 1, // 显示比例尺
                showcompass: 1, // 显示指南针
                tiltgesturesenabled: 1, // 开启双指下滑手势
                trafficenabled: 1, // 显示交通路况
                showmaptext: 1, // 显示地图 poi 信息
                logoposition: { centerx: 150, centery: 90 }, // 指定地图 logo 位置
            },
            // 点标记覆盖物
            markers: [
                {
                    id: 1,
                    latitude: 30.272960,
                    longitude: 120.125872,
                    width: 19,
                    height: 31,
                    iconpath: 'https://gw.alipayobjects.com/mdn/rms_dfc0fe/afts/img/a*x9yerpemtrsaaaaaaaaaaaaaarqnaq',
                    callout: {
                        content: '1',
                    },
                },
                {
                    id: 2,
                    latitude: 30.275960,
                    longitude: 120.125872,
                    width: 19,
                    height: 31,
                    iconpath: 'https://gw.alipayobjects.com/mdn/rms_dfc0fe/afts/img/a*x9yerpemtrsaaaaaaaaaaaaaarqnaq',
                    callout: {
                        content: '2',
                    },
                }
            ],
            // 线段覆盖物
            polyline: [
                {
                    points: [
                        {
                            latitude: 30.272960,
                            longitude: 120.125872,
                        },
                        {
                            latitude: 30.272960,
                            longitude: 120.124572,
                        },
                        {
                            latitude: 30.274260,
                            longitude: 120.124572,
                        }
                    ],
                    color: '#ff0000dd',
                    width: 10,
                    dottedline: false,
                    iconwidth: 10,
                }
            ],
            // 包含点
            'include-points': [
                {
                    latitude: 30.272960,
                    longitude: 120.125872,
                },
                {
                    latitude: 30.275960,
                    longitude: 120.125872,
                },
            ],
            // 内边距
            'include-padding': {
                left: 10,
                right: 0,
                top: 0,
                bottom: 0
            },
            // 贴图覆盖物
            'ground-overlays': [{
                // 刷新的时候需要变更id值
                id: '10',
                // 确定贴图覆盖物位置
                'include-points': [{
                    latitude: 39.935029,
                    longitude: 116.384377,
                }, {
                    latitude: 39.939577,
                    longitude: 116.388331,
                }],
                image: 'https://gw.alipayobjects.com/mdn/rms_dfc0fe/afts/img/a*x9yerpemtrsaaaaaaaaaaaaaarqnaq',
            }],
            // 网格贴图覆盖物
            'tile-overlay': {
              url: 'https://gw.alipayobjects.com/mdn/rms_dfc0fe/afts/img/a*x9yerpemtrsaaaaaaaaaaaaaarqnaq',
              type: 0,
              tilewidth: 64,
              tileheight: 64,
              zindex: 1,
            },
            success: res => {
                console.log('res', res);
            },
            fail: res => {
                console.log('fail', res);
            }
        });
    }
});