เริ่มต้น

หน้านี้จะแสดงวิธีรับคีย์ API, เปิดใช้ API ที่จำเป็น และโหลดไลบรารี Places เพื่อให้คุณทํางานกับคลาส Place ได้

รับคีย์ API และเปิดใช้ API ที่จําเป็น

คุณต้องดำเนินการต่อไปนี้ก่อนใช้คลาสสถานที่

  • สร้างโปรเจ็กต์ Cloud ด้วยบัญชีสำหรับการเรียกเก็บเงิน
  • รับคีย์ API
  • เปิดใช้ API ต่อไปนี้
    • Maps JavaScript API
    • Places API
    • Places API (ใหม่) (จําเป็นสําหรับการใช้การค้นหาข้อความ (ใหม่) การค้นหาในพื้นที่ใกล้เคียง (ใหม่) รายละเอียดสถานที่ (ใหม่))

โปรดดูข้อมูลเพิ่มเติมที่หัวข้อตั้งค่าโปรเจ็กต์ Google Cloud

รับคีย์ API

เปิดใช้ Places API (ใหม่)

โหลด Places Library

หากต้องการโหลดไลบรารี Places ให้โหลด Maps JavaScript API ก่อนโดยเพิ่มโปรแกรมโหลด Bootstrap แบบอินไลน์ลงในโค้ดแอปพลิเคชัน ดังที่แสดงในข้อมูลโค้ดต่อไปนี้

<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 เพื่อเรียก importLibrary() จากภายในฟังก์ชัน async ดังที่แสดงที่นี่

  const {Place} = await google.maps.importLibrary("places");
  

ขั้นตอนถัดไป