<template>
    <div id="container"></div>
</template>

<script>
    export default {
        name: "MapSearch",
        data(){
            return{
                latitude:0,
                longitude:0,
                keyword:'', //搜索关键词
                region:'', // 搜索范围
                key:'LACBZ-MDX6W-NT3RH-OLECY-XVHD3-G5BKA'
            }
        },
        methods:{

            MapSearch(){

              this.$http.MapSearch().then(res=>{

              })
            },

            setMap() {
                // 步骤：定义map变量 调用 qq.maps.Map() 构造函数   获取地图显示容器
                // 设置地图中心点
                var x = this.latitude;
                var y = this.longitude;
                var myLatlng = new qq.maps.LatLng(x,y);
                //定义工厂模式函数
                var myOptions = {
                    zoom: 20,               //设置地图缩放级别
                    center: myLatlng,    //设置中心点样式
                    mapTypeId: qq.maps.MapTypeId.ROADMAP  //设置地图样式详情参见MapType
                }
                //获取dom元素添加地图信息
                var map = new qq.maps.Map(document.getElementById("container"), myOptions);

                // 给定位的位置添加图片标注
                var marker = new qq.maps.Marker({
                    position: myLatlng,
                    map: map
                });
                // 给定位的位置添加文本标注
                // var marker = new qq.maps.Label({
                //     position: myLatlng,
                //     map: map,
                //     content: '这是我当前的位置，偏差有点大，哈哈'
                // });
            }
        }
    }
</script>

<style lang="less" scoped>
    .container{
        width: 100vw;
        height: 100vh;
    }
</style>
