首页 > 解决方案 > GoogleMaps:当我放置锚时,标记变为默认

问题描述

我正在尝试在地图上制作自己的标记,但问题是地图缩放时它会移出,我在这里读到了我需要添加锚点的事实

Google Maps v3 自定义标记图标无法保持其在地图上的位置

我添加了一个锚点,但标记立即变为默认,告诉我为什么?

  const position = {
  lat: 52.263810,
  lng: 104.311577
}

const goldStar = {
  path: 'M 10 10 h 80 v 80 h -80 Z',
  anchor: {position} // here i added anchor
  // path: 'M 125,5 155,90 245,90 175,145 200,230 125,180 50,230 75,145 5,90 95,90 z',
  // path: 'M 10, 20' +
  //   '    a 10,10 0 1,1 20,0' +
  //   '    a 10,10 0 1,1 -20,0',
  // fillColor: 'yellow',
  // fillOpacity: 0.8,
  // scale: 1,
  // strokeColor: 'gold',
  // strokeWeight: 2
};

 <Marker
            position={position}
            onClick={() => console.log(343)}
            icon={goldStar}
          />

标签: javascriptreactjsgoogle-maps

解决方案


anchor是类型的Point图标界面

与地图上标记的位置相对应的锚定图像的位置。默认情况下,锚点位于图像底部的中心点。

所以,正确的方法是:

anchor: new google.maps.Point(0,25) //Point(x,y),depend on youe icone size


@react-google-maps图书馆

 anchor:  { x: 10, y: 15 }

推荐阅读