如何在“vue2- Google - Map”组件中的google Map上添加带有自定义图像的标记？

<template>
  <div>
    <GmapMap :center="center" :zoom="zoom">
      <GmapMarker :position="markerPosition" :icon="customIcon"></GmapMarker>
    </GmapMap>
  </div>
</template>

<script>
export default {
  data() {
    return {
      center: { lat: 37.7749, lng: -122.4194 }, // 地图中心位置
      zoom: 10, // 缩放级别
      markerPosition: { lat: 37.7749, lng: -122.4194 }, // 标记位置
      customIcon: {
        url: 'https://example.com/custom-icon.png', // 自定义图像的URL
        size: { width: 50, height: 50 }, // 图像尺寸
        scaledSize: { width: 50, height: 50 }, // 缩放后的图像尺寸
        origin: { x: 0, y: 0 }, // 图像原点位置
        anchor: { x: 25, y: 50 } // 锚点位置
      }
    };
  }
};
</script>

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>