vue amap 自定义图标icon 大小修改和绑定点击事件

<template>   <div class="row">     <el-amap id="map" vid="amapDemo" :zoom="zoom" :center="center">       <el-amap-marker         v-for="marker in markers"
        :events="events"
        :key="marker.id"         :position="marker.position"         :icon="marker.icon"       ></el-amap-marker>     </el-amap>   </div> </template> <script> export default {   name: "maps",   data() {     return {       center: [115.95317,28.680948],       zoom: 14,       markers:[         {           id:1,           position:[115.95317,28.684863],           icon: require("@/assets/icon1.png")         },         {           id:2,           position:[115.978576,28.696985],           icon: require("@/assets/icon2.png")         },         {           id:3,           position:[115.955831,28.666113],           icon: require("@/assets/icon1.png")         },       ],

        events:{

          //点击事件
          click(a) {
            console.log(a)
          }
        }

    }   } } </script> <style scoped>   .row,#map {     height: 100%;   }   /* 图标大小修改 */   /deep/ .amap-icon img {     max-width: 2rem !important;     max-height: 2rem !important;   } </style>

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zzsfgx.html