制作 AirBNB 谷歌地图图标

Question

我是谷歌地图的新手——如何制作谷歌地图 AirBnB 类型的标记？我将标记设置得很好，我只需要能够创建一个带有背景的矩形，其中包含图片中的文本...

我也可以设置一个“价格”变量。

这是我的代码：

var marker = new google.maps.Marker({
        position : latlng,
        map : map,
        label: {
            text: price, // $100,000
            color: 'white'
        }
    });

Answer 1

标记标签通常是出现在标记中的字母或数字。您可以输入多个字母或数字，但标记不会自动调整大小以适应文本。一种可能的解决方案是使用信息窗口来显示您想要的信息。这里有一些关于 infowindows 的好文档：

https://developers.google.com/maps/documentation/javascript/infowindows

另一种选择是使用自定义标记：

https://developers.google.com/maps/documentation/javascript/custom-markers

Google 允许您使用自定义标记而不是默认标记，您可以在此处按照简单标记图标的说明进行操作：

https://developers.google.com/maps/documentation/javascript/markers#simple_icons

自定义图标的唯一缺点是，如果您在发布的图片中列出价格信息，则每个价格都需要一个自定义图标。

我希望这会有所帮助！