vue2.0 맵 커버물 활용 1

하나.vue-amap 참조

    1.npm install vue-amap
    2.import VueAmap from 'vue-amap'
    3.AMap.initAMapApiLoader({
        //    key
        key: 'XXXX',
        //     
        plugin: ['AMap.Autocomplete', 'AMap.PlaceSearch', 'AMap.Scale', 'AMap.OverView', 'AMap.ToolBar', 'AMap.MapType', 'AMap.PolyEditor', 'AMap.CircleEditor'],
        uiVersion: '1.0'
    });

둘.스크립트에서 인용

    let amapManager=new VueAmap.AMapManager();
    export default(){
         data(){
             return {
                 markers:[],
                 windows:[],
                 amapManager: amapManager,
                 events:{
                     'init':(o)=>{
                     amapManager.setMap(o);
                     amapManager.getMap().setMapStyle('amap://styles/light');
                     }
                 }
             }
         },
         mounted(){
             var that=this;
             //       
             let markers=[];
             let windows=[];
             let lnglats=data.result.lnglats;
             for(let i=0,i{
                         this.windows.forEach(window=>{
                              window.visible=false
                         })
                         this.$nextTick(()=>{
                              self.windows[i].visible=true;
                              self.window[i].content="    "
                              //             
                         })
                     }
                 }
                })
                window.push({
                     visible:false
                })
             }
             this.markers=markers;
             this.windows=windows;
         }
    }

셋.template 데이터 바인딩

    
    
    
{{window.content}}