marker | Vue-Amap

# 参数配置

marker组件支持高德地图marker类所有MarkerOption属性及事件。在此基础上，对以下属性变动在组件内部监听，并会主动触发对应对set方法

属性名	类型	默认值
position	LngLat	-
offset	Pixel	-
anchor	string	'top-left'
label	{ content: string, offset?: Pixel, direction?: string }	-
animation	string	'AMAP_ANIMATION_NONE'
clickable	boolean	true
angle	number	-
zIndex	number	-
draggable	boolean	false
title	string	-
content	string	-
icon	string \| Icon	-
extData	any	-

# 示例

<template>
  <el-amap 
    style="height: 400px;"
    :zoom="zoom"
    :center="center"
  >
    <el-amap-mark
      v-for="marker in markers"
      :key="`${marker.position[0]}_${marker.position[1]}`"
      v-bind="marker"
      @click="markerClick"
    />
  </el-amap>
</template>

<script>
export default {
  data () {
    return {
      zoom: 6,
      center: [116.3, 39.1],
      markers: [
        {
          position: [120.15, 30.28],
          label: { content: '杭州' },
          icon: {
            imageSize: [20, 40],
            size: [20, 40],
            image: '/car.png'
          },
        },
        {
          position: [116.15, 39.28],
          label: { content: '北京' },
          icon: {
            imageSize: [20, 40],
            size: [20, 40],
            image: '/car.png'
          },
        }
      ],
    }
  },
  methods: {
    markerClick (...args) {
      console.log(args)
    }
  }
}
</script>

← control massMarker →