地点图标

请选择平台： Android iOS JavaScript 网络服务

地点图标表示各种类型的地点（例如咖啡馆、图书馆和博物馆）。您可以使用 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,
});
index.ts

注意：请参阅 TypeScript 和 Google 地图的使用方法指南。

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,
});
index.js

查看示例

地点图标和背景颜色请求

下表按类别显示了所有可用的地点图标。默认情况下，这些图标以黑色字形显示。图标背景颜色取决于地点的类别。

地点类别：食品和饮料 （图标背景颜色 #FF9E67）
酒吧、夜总会	咖啡馆	餐馆、糕点店
地点类别：零售 （图标背景颜色 #4B96F3）
图书、服装、电子产品、珠宝、鞋类、购物中心/商场	便利店	杂货店、超市	药店
地点类别：服务 （图标背景颜色 #909CE1）
ATM	银行	加油站	住宿
邮局
地点类别：娱乐 （图标背景颜色 #13B5C7）
水族馆、旅游	高尔夫	历史古迹	电影院
博物馆	剧院
地点类别：交通 （图标背景颜色 #10BDFF）
机场	公交车、拼车、出租车	火车/轨道交通
地点类别：市政/一般/宗教 （图标背景颜色 #7B9EB0）
墓地	市政建筑	图书馆	纪念碑
停车场	学校（小学、中学、大学）	宗教场所（基督教）
宗教场所（印度教）	宗教场所（伊斯兰教）	宗教场所（耆那教）	宗教场所（犹太教）
宗教场所（锡克教）	一般业务
地点类别：户外 （图标背景颜色 #4DB546）
乘船	野营	公园	体育馆
动物园
地点类别：紧急状况 （图标背景颜色 #F88181）
医院	警察局