开始使用
使用集合让一切井井有条
根据您的偏好保存内容并对其进行分类。
此页面介绍了如何获取 API 密钥、启用所需的 API 以及加载地点库,以便您使用 Place 类。
获取 API 密钥并启用所需的 API
在使用 Place 类之前,您需要:
- 创建有结算账号的 Cloud 项目。
- 获取 API 密钥。
- 启用以下 API:
- Maps JavaScript API
- Places API
- Places API(新)(必须启用此 API 才能使用文本搜索 [新]和地点自动补全)
如需了解详情,请参阅设置您的 Google Cloud 项目。
获取 API 密钥
启用 Places API(新)
加载地点库
若要加载地点库,请先通过将内嵌引导程序加载器添加到应用代码中来加载 Maps JavaScript API,如以下代码段所示:
<script>
(g=>{var h,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=>h||(h=new Promise(async(f,n)=>{await (a=m.createElement("script"));e.set("libraries",[...r]+"");for(k in g)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=>h=n(Error(p+" could not load."));a.nonce=m.querySelector("script[nonce]")?.nonce||"";m.head.append(a)}));d[l]?console.warn(p+" only loads once. Ignoring:",g):d[l]=(f,...n)=>r.add(f)&&u().then(()=>d[l](f,...n))})({
key: "YOUR_API_KEY",
v: "weekly",
// Use the 'v' parameter to indicate the version to use (weekly, beta, alpha, etc.).
// Add other bootstrap parameters as needed, using camel case.
});
</script>
接下来,使用 await
运算符从 async
函数中调用 importLibrary()
,如下所示:
const {Place} = await google.maps.importLibrary("places");
您的函数还可以加载库,而无需为所需类声明变量:
async function initMap() {
google.maps.importLibrary("places");
...
}
initMap();
或者,您也可以直接在 HTML 中加载库,如下所示:
<script>
google.maps.importLibrary("places");
</script>
如需详细了解如何加载库,请参阅加载 Maps JavaScript API。
后续步骤
如未另行说明,那么本页面中的内容已根据知识共享署名 4.0 许可获得了许可,并且代码示例已根据 Apache 2.0 许可获得了许可。有关详情,请参阅 Google 开发者网站政策。Java 是 Oracle 和/或其关联公司的注册商标。
最后更新时间 (UTC):2025-08-10。
[null,null,["最后更新时间 (UTC):2025-08-10。"],[[["\u003cp\u003eThis guide explains how to prepare your application to work with the Google Maps Places API's Place class.\u003c/p\u003e\n"],["\u003cp\u003eYou'll need to set up a Cloud project, obtain an API key, and enable necessary APIs including Maps JavaScript API, Places API, and Places API (New).\u003c/p\u003e\n"],["\u003cp\u003eThe Places Library is loaded by including the Maps JavaScript API bootstrap loader and then calling \u003ccode\u003eimportLibrary("places")\u003c/code\u003e.\u003c/p\u003e\n"],["\u003cp\u003eOnce set up, you can utilize the Place class for searching places, retrieving details, and using Place Autocomplete.\u003c/p\u003e\n"]]],["To use the Place class, you must first create a Cloud project with billing, obtain an API key, and enable the Maps JavaScript API, Places API, and Places API (New). Then, load the Places Library by including the Maps JavaScript API bootstrap loader in your code, and utilizing the `importLibrary()` function within an `async` context. This allows for the use of the \"places\" library, and subsequent place related tasks.\n"],null,["**European Economic Area (EEA) developers** If your billing address is in the European Economic Area, effective on 8 July 2025, the [Google Maps Platform EEA Terms of Service](https://cloud.google.com/terms/maps-platform/eea) will apply to your use of the Services. Functionality varies by region. [Learn more](/maps/comms/eea/faq).\n\nThis page shows you how to get an API key, enable the required APIs, and load the Places Library,\nso that you can work with the Place class.\n\nGet an API key and enable the required APIs\n\nBefore using the Place class, you need to:\n\n- Create a Cloud project with a billing account.\n- Get an API key.\n- Enable the following APIs: \n - Maps JavaScript API\n - Places API\n - Places API (New) (required to use Text Search (New) and Place Autocomplete)\n\nTo learn more, see [Set up your Google Cloud project](/maps/documentation/javascript/cloud-setup).\n[Get an API key](/maps/documentation/javascript/get-api-key)\n\n\n[Enable Places API (New)](https://console.cloud.google.com/apis/library/places.googleapis.com)\n\nLoad the Places Library\n\nTo load the Places Library, first load the Maps JavaScript API, by adding the\ninline bootstrap loader to your application code, as shown in the following snippet: \n\n```javascript\n\u003cscript\u003e\n (g=\u003e{var h,a,k,p=\"The Google Maps JavaScript API\",c=\"google\",l=\"importLibrary\",q=\"__ib__\",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=\u003eh||(h=new Promise(async(f,n)=\u003e{await (a=m.createElement(\"script\"));e.set(\"libraries\",[...r]+\"\");for(k in g)e.set(k.replace(/[A-Z]/g,t=\u003e\"_\"+t[0].toLowerCase()),g[k]);e.set(\"callback\",c+\".maps.\"+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=\u003eh=n(Error(p+\" could not load.\"));a.nonce=m.querySelector(\"script[nonce]\")?.nonce||\"\";m.head.append(a)}));d[l]?console.warn(p+\" only loads once. Ignoring:\",g):d[l]=(f,...n)=\u003er.add(f)&&u().then(()=\u003ed[l](f,...n))})({\n key: \"YOUR_API_KEY\",\n v: \"weekly\",\n // Use the 'v' parameter to indicate the /maps/documentation/javascript/versions to use (weekly, beta, alpha, etc.).\n // Add other /maps/documentation/javascript/load-maps-js-api#required_parameters as needed, using camel case.\n });\n\u003c/script\u003e\n```\n\nNext, use the `await` operator to call `importLibrary()`\nfrom within an `async` function, as shown here: \n\n```javascript\n const {Place} = await google.maps.importLibrary(\"places\");\n \n```\n\nYour function can also load libraries without declaring a variable\nfor the needed classes: \n\n```javascript\n async function initMap() {\n google.maps.importLibrary(\"places\");\n ...\n }\n\n initMap();\n \n```\n\nAlternatively, you can load the libraries directly in HTML as shown here: \n\n```javascript\n \u003cscript\u003e\n google.maps.importLibrary(\"places\");\n \u003c/script\u003e\n \n```\n\n\nFor more information about loading libraries, see\n[Load the Maps JavaScript API](/maps/documentation/javascript/load-maps-js-api).\n\nNext steps\n\n- [Search for places](/maps/documentation/javascript/place-search)\n- [Get place details](/maps/documentation/javascript/place-details)\n- [Use Place Autocomplete](/maps/documentation/javascript/place-autocomplete-new)"]]