vue.js element-ui 고덕 지도 선택 좌표 dialog




  //https://elemefe.github.io/vue-amap
  export default {
    data() {
      return {
        q: '',
        zoom: 14,
        center: [116.602489, 40.080734],
        marker: {
          position: [116.602489, 40.080734],
          //events: {
          //    click: () => {
          //        alert('click marker');
          //    },
          //    dragend: (e) => {
          //        this.marker.position = [e.lnglat.lng, e.lnglat.lat];
          //    }
          //},
          visible: true,
          draggable: false
        },
        events: {
          click: (e) => {
            this.marker.position = [e.lnglat.lng, e.lnglat.lat]
          }
        },
        dialogVisible: false
      }
    },
    methods: {
      open(lng, lat) {
        if (lng && lat) {
          this.center = [lng, lat]
          this.marker.position = [lng, lat]
        }

        this.dialogVisible = true
      },
      onSearchResult(pois) {
        let latSum = 0;
        let lngSum = 0;
        pois.forEach(poi => {
          lngSum += poi.lng;
          latSum += poi.lat;
        });
        let center = {
          lng: lngSum / pois.length,
          lat: latSum / pois.length
        };
        this.center = [center.lng, center.lat];
      },
      submit() {
        this.$emit('callback', this.marker.position)
        this.dialogVisible = false
      }
    }
  }


좋은 웹페이지 즐겨찾기