getCenterLocation获取不到中心点

<template>  
    <view>  
        <map id="myMap" class="map" :show-location="true" :latitude="lat" :longitude="lng" @regionchange="regionchange">  
        </map>  
        <view>lat:{{lat}}</view>  
        <view>lng:{{lng}}</view>  
    </view>  
</template>  

<script>  
    var app = getApp();  
    export default {  
        data() {  
            return {  
                lat:'',  
                lng:''  
            }  
        },  
        onShow() {  
            var that = this;  
            uni.getLocation({  
                type: 'gcj02',  
                success: res => {  
                    console.log(JSON.stringify(res))  
                    that.lat = res.latitude  
                    that.lng = res.longitude  
                },  
                fail: () => {},  
                complete: () => {}  
            });  
        },  
        onload(){  
        },  
        onReady() {  
            this.map = uni.createMapContext('myMap', this);  
        },  
        methods: {  
            regionchange(e){  
                this.getLngLat();  
            },  
            //获取地图中心点  
            getLngLat(){  
                               var that = this;  
                this.map.getCenterLocation({  
                    success(res) {  
                        console.log(JSON.stringify(res))  
                        that.lat= res.latitude  
                        that.lng= res.longitude  
                    }  
                })  
            },  
        },  

    }  
</script>  

<style>  
    .map {  
        width: 100%;  
        height: 1000rpx;  
    }  
</style>