地点图标表示各种类型的地点(例如咖啡馆、图书馆和博物馆)。您可以使用 Place 类请求图标及其背景颜色。
字段
使用以下字段处理地点图标:
| 字段 | Place 类 | 地点服务 | 
|---|---|---|
| 图标 | --- | icon | 
| 图标背景颜色 | iconBackgroundColor | icon_background_color | 
| 图标遮罩 URI | svgIconMaskURI | icon_mask_base_uri | 
- icon会返回 71 像素 x 71 像素的 PNG 彩色图标的网址(仅限地点服务)。
- iconBackgroundColor和- icon_background_color会针对地点图标的类别返回默认的 HEX 颜色代码。
- icon_mask_base_uri(地点服务)会返回非彩色图标的基础网址,去掉文件类型扩展名(附加- .svg或- .png)。
- svgIconMaskURI(Place 类)会返回非彩色 SVG 图标的基础网址。
将地点图标和颜色应用于标记
使用“地点详情”时,您可以请求可应用于标记的地点图标和背景颜色。以下示例显示了使用地点数据创建标记所用的代码:将 place.iconBackgroundColor 传递到 PinElement.background选项,并将 place.svgIconMaskURI 传递到 PinElement.glyph。然后使用 place.location 将标记放置在正确位置。下例还会在标记标题中显示 place.displayName。
TypeScript
// A marker customized using a place icon and color, name, and geometry. const place = new Place({ id: 'ChIJN5Nz71W3j4ARhx5bwpTQEGg', }); // Call fetchFields, passing the desired data fields. await place.fetchFields({ fields: ['location', 'displayName', 'svgIconMaskURI', 'iconBackgroundColor'] }); const pinElement = new PinElement({ background: place.iconBackgroundColor, glyph: new URL(String(place.svgIconMaskURI)), }); const placeIconMarkerView = new AdvancedMarkerElement({ map, position: place.location, content: pinElement.element, title: place.displayName, });
JavaScript
// A marker customized using a place icon and color, name, and geometry. const place = new Place({ id: "ChIJN5Nz71W3j4ARhx5bwpTQEGg", }); // Call fetchFields, passing the desired data fields. await place.fetchFields({ fields: [ "location", "displayName", "svgIconMaskURI", "iconBackgroundColor", ], }); const pinElement = new PinElement({ background: place.iconBackgroundColor, glyph: new URL(String(place.svgIconMaskURI)), }); const placeIconMarkerView = new AdvancedMarkerElement({ map, position: place.location, content: pinElement.element, title: place.displayName, });
地点图标和背景颜色请求
下表按类别显示了所有可用的地点图标。默认情况下,这些图标以黑色字形显示。图标背景颜色取决于地点的类别。
| 地点类别:食品和饮料 (图标背景颜色 #FF9E67) | |||
|---|---|---|---|
| 酒吧、夜总会 | 咖啡馆 | 餐馆、糕点店 | |
| 地点类别:零售 (图标背景颜色 #4B96F3) | |||
| 图书、服装、电子产品、珠宝、鞋类、购物中心/商场 |  便利店 | 杂货店、超市 | 药店 | 
| 地点类别:服务 (图标背景颜色 #909CE1) | |||
| ATM | 银行 | 加油站 | 住宿 | 
| 邮局 | |||
| 地点类别:娱乐 (图标背景颜色 #13B5C7) | |||
| 水族馆、旅游 | 高尔夫 | 历史古迹 | 电影院 | 
| 博物馆 | 剧院 | ||
| 地点类别:交通 (图标背景颜色 #10BDFF) | |||
| 机场 | 公交车、拼车、出租车 | 火车/轨道交通 | |
| 地点类别:市政/一般/宗教 (图标背景颜色 #7B9EB0) | |||
| 墓地 | 市政建筑 | 图书馆 | 纪念碑 | 
| 停车场 | 学校(小学、中学、大学) | 宗教场所(基督教) | |
| 宗教场所(印度教) | 宗教场所(伊斯兰教) | 宗教场所(耆那教) | 宗教场所(犹太教) | 
| 宗教场所(锡克教) | 一般业务 | ||
| 地点类别:户外 (图标背景颜色 #4DB546) | |||
| 乘船 | 野营 | 公园 | 体育馆 | 
| 动物园 | |||
| 地点类别:紧急状况 (图标背景颜色 #F88181) | |||
| 医院 | 警察局 | ||