在google-maps-react中,要减小标记的自定义图标大小,可以通过以下步骤实现:
icon
属性,该属性用于指定标记的图标。Icon
组件,并在其中设置url
属性为你想要的自定义图标的URL。Icon
组件中,可以使用scaledSize
属性来设置图标的大小。该属性接受一个Size
对象,其中包含width
和height
属性。Size
对象的width
和height
属性的值,以减小图标的大小。可以根据需要进行实验和调整。以下是一个示例代码,展示了如何减小google-maps-react中标记的自定义图标大小:
import React from 'react';
import { GoogleMap, Marker, Icon } from 'google-maps-react';
const CustomMarker = () => {
const icon = {
url: 'your-custom-icon-url',
scaledSize: {
width: 20, // 调整图标宽度
height: 20 // 调整图标高度
}
};
return (
<GoogleMap>
<Marker
position={{ lat: 37.7749, lng: -122.4194 }}
icon={icon}
/>
</GoogleMap>
);
};
export default CustomMarker;
请注意,上述代码中的your-custom-icon-url
应替换为你自己的自定义图标的URL。另外,你还可以根据需要调整width
和height
属性的值。
推荐的腾讯云相关产品:腾讯地图服务(https://cloud.tencent.com/product/maps)
领取专属 10元无门槛券
手把手带您无忧上云