javascript - 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}
/>
解决方案
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 }
推荐阅读
- oracle - 在 plsql 块中编译游标时出错
- java - 尝试创建新标记时,mMap 为空
- cmd - 获取 FCIV 以扫描批处理脚本中的隐藏文件
- javascript - 为什么反应功能组件中的回调没有读取更新的状态值
- reactjs - 反应钩子状态
- qt - 将 qml 项目添加到 Qt3DQuickWindow
- excel - 从右到左制作我的 birt 报告的 excel 表方向
- django - 文件未上传 django drf
- java - 如何在 Java 中创建一个字典数据结构,该结构具有使用部分键(如“goog%”)进行搜索的能力
- reactjs - React Route 不会重定向