สร้างแอป Augmented Reality (AR) โดยใช้ ARCore Geospatial API ใหม่

1. ภาพรวม

ARCore เป็นเฟรมเวิร์กของ Google สำหรับการสร้างประสบการณ์ Augmented Reality บนสมาร์ทโฟน ARCore Geospatial API ใหม่จะมอบแง่มุมใหม่ให้กับเทคโนโลยีความจริงเสริม ซึ่งช่วยให้คุณวางจุดแวะพักของเทคโนโลยีความจริงเสริมที่เจาะจงตำแหน่งรอบๆ สถานที่สำคัญในโลกแห่งความเป็นจริงได้

สิ่งที่คุณจะสร้าง

ใน Codelab นี้ คุณจะได้เริ่มต้นใช้งาน ARCore Geospatial API คุณจะได้ทราบว่า Geospatial API มอบข้อมูลใดบ้างให้กับประสบการณ์ AR โดยรวม และวิธีใช้ข้อมูลนี้เพื่อขับเคลื่อนประสบการณ์การค้นหาเส้นทางด้วย AR ที่เรียบง่าย

สิ่งที่คุณจะได้เรียนรู้

• วิธีตั้งค่าโปรเจ็กต์ ARCore ที่ใช้ Geospatial API
• วิธีการขอข้อมูลทางภูมิศาสตร์จาก Geospatial API และแสดงโดยใช้ Google Maps
• วิธีวางหมุดที่เชื่อมโยงกับสถานที่จริง

สิ่งที่คุณต้องมี

• อุปกรณ์ Android ที่รองรับ ARCore ซึ่งเชื่อมต่อโดยใช้สาย USB กับเครื่องสำหรับพัฒนาซอฟต์แวร์ที่กำหนดค่าด้วยการแก้ไขข้อบกพร่องผ่าน USB
• Android Studio ติดตั้งและกำหนดค่าให้สร้างแอป Android
• บริการ Google Play สำหรับ AR 1.31 ขึ้นไปที่ติดตั้งในอุปกรณ์สำหรับนักพัฒนาแอป Android

2. ตั้งค่าสภาพแวดล้อมในการพัฒนาซอฟต์แวร์

ตั้งค่า Android Studio

ในการเริ่มต้นใช้งาน Geospatial API เรามีโปรเจ็กต์เริ่มต้นที่มีพื้นฐานของโปรเจ็กต์ ARCore ที่ผสานรวมกับ Google Maps SDK ซึ่งจะช่วยให้คุณเริ่มต้นใช้งาน Geospatial API ได้อย่างรวดเร็ว

1. เริ่ม Android Studio และนําเข้าโปรเจ็กต์จาก VCS
   • หากเปิดโปรเจ็กต์ไว้แล้ว ให้ใช้ไฟล์ > ใหม่ > โปรเจ็กต์จากระบบควบคุมเวอร์ชัน...
   • หากเห็นหน้าต่างยินดีต้อนรับสู่ Android Studio ให้ใช้ตัวเลือกรับจาก VCS
2. เลือก Git และใช้ URL https://github.com/google-ar/codelab-geospatial.git เพื่อนำเข้าโปรเจ็กต์

ตั้งค่าโปรเจ็กต์ Google Cloud

Geospatial API ใช้ภาพ Street View ร่วมกับข้อมูลเครื่องวัดค่าความเข้มข้นของสนามแม่เหล็กและเซ็นเซอร์กล้องของอุปกรณ์เพื่อปรับปรุงค่าการวางแนว หากต้องการใช้บริการนี้ คุณต้องตั้งค่าโปรเจ็กต์ Google Cloud

1. สร้างโปรเจ็กต์ในคอนโซล Google Cloud ด้วยคำสั่ง
   • ไปที่สร้างโปรเจ็กต์ใน Google Cloud Platform
     
   • ป้อนชื่อโปรเจ็กต์ที่เหมาะสม (เช่น "โปรเจ็กต์ ARCore Geospatial API") แล้วเลือกตำแหน่งใดก็ได้
   • คลิกสร้าง
2. เปิดใช้ API ที่จําเป็น
   • ในแถบด้านข้าง ให้เลือกAPI และบริการ แล้วเลือกคลัง
   • ค้นหา ARCore API
   • คลิกเปิดใช้
   • กลับไปที่คลัง
   • ค้นหา Maps SDK สำหรับ Android
   • คลิกเปิดใช้
3. สร้างข้อมูลเข้าสู่ระบบคีย์ API:
   • ในส่วน API และบริการ ให้เลือกข้อมูลเข้าสู่ระบบ
   • ในแถบด้านบน ให้คลิกสร้างข้อมูลเข้าสู่ระบบ แล้วเลือกคีย์ API
   • จดคีย์ที่สร้างขึ้นไว้ เนื่องจากคุณต้องใช้ในขั้นตอนถัดไป กลับไปที่หน้าข้อมูลเข้าสู่ระบบหากต้องการเรียกข้อมูล

ด้วยขั้นตอนเหล่านี้ คุณได้สร้างโปรเจ็กต์ Google Cloud ที่มีการให้สิทธิ์คีย์ API และพร้อมที่จะใช้ Geospatial API แล้ว

ผสานรวมคีย์ API กับโปรเจ็กต์ Android Studio

หากต้องการเชื่อมโยงคีย์ API จาก Google Cloud กับโปรเจ็กต์ ให้เปิดโปรเจ็กต์ที่สร้างใน Android Studio และแก้ไขคีย์ API โดยทำดังนี้

1. เปิดแอป > src > AndroidManifest.xml
2. ค้นหารายการ meta-data ต่อไปนี้

   <meta-data
       android:name="com.google.android.ar.API_KEY"
       android:value="PLACEHOLDER_API_KEY" />
   
   <meta-data
       android:name="com.google.android.geo.API_KEY"
       android:value="PLACEHOLDER_API_KEY" />
   

3. แทนที่ PLACEHOLDER_API_KEY ด้วยคีย์ API ที่คุณสร้างในโปรเจ็กต์ Google Cloud

ค่าที่จัดเก็บไว้ใน com.google.android.ar.API_KEY จะอนุญาตให้แอปนี้ใช้ Geospatial API และค่าที่จัดเก็บไว้ใน com.google.android.geo.API_KEY จะให้สิทธิ์แอปนี้ใช้ Google Maps SDK

ยืนยันโปรเจ็กต์

ตรวจสอบว่าโปรเจ็กต์ทั้งหมดจะพร้อมใช้งาน ใน Android Studio ให้เรียกใช้แอป คุณควรจะเห็นมุมมองกล้องและแผนที่ที่ใช้งานได้ที่ด้านล่างของหน้าจอ

3. ระบุตำแหน่งของผู้ใช้

ในขั้นตอนนี้ คุณจะเพิ่มโค้ดลงในโปรเจ็กต์ตัวอย่างเพื่อเริ่มต้นใช้งาน Geospatial API

กำหนดค่าเซสชัน ARCore ให้ใช้ Geospatial API

หากต้องการรับข้อมูลภูมิสารสนเทศ คุณต้องเปิดใช้ Geospatial API เปลี่ยน GeospatialMode ในการกำหนดค่าเซสชันเป็น ENABLED โดยแก้ไขฟังก์ชัน configureSession ใน HelloGeoActivity.kt ดังนี้

fun configureSession(session: Session) {
  session.configure(
    session.config.apply {
      // Enable Geospatial Mode.
      geospatialMode = Config.GeospatialMode.ENABLED
    }
  )
}

เมื่อโหมดภูมิสารสนเทศเชิงพื้นที่เป็น ENABLED แอปพลิเคชันจะรับข้อมูลภูมิสารสนเทศเชิงพื้นที่ได้

ขอข้อมูลจาก Geospatial API

ใน HelloGeoRenderer.kt ให้ค้นหาบรรทัดต่อไปนี้

// TODO: Obtain Geospatial information and display it on the map.

ตรวจสอบด้านล่างว่าออบเจ็กต์ Earth พร้อมใช้งาน ซึ่งตรงกับวันที่ trackingState TrackingState.ENABLED

val earth = session.earth
if (earth?.trackingState == TrackingState.TRACKING) {
  // TODO: the Earth object may be used here.
}

ขอข้อมูลภูมิสารสนเทศจาก ARCore ใต้TODO เพิ่มบรรทัดนี้:

val cameraGeospatialPose = earth.cameraGeospatialPose

ซึ่งจะให้ GeospatialPose ที่มีข้อมูลต่อไปนี้

• ตำแหน่ง แสดงเป็นละติจูดและลองจิจูด ระบบจะแสดงค่าประมาณของความแม่นยำของตำแหน่งด้วย
• ระดับความสูงและความแม่นยำโดยประมาณของระดับความสูง
• ทิศทางโดยประมาณของอุปกรณ์ที่หันไป และค่าประมาณความแม่นยำของทิศทาง

แสดงข้อมูลตำแหน่งบนแผนที่

คุณสามารถใช้ GeospatialPose ที่เก็บไว้ใน cameraGeospatialPose เพื่อย้ายเครื่องหมายบนแผนที่ซึ่งแสดงตําแหน่งของผู้ใช้ ดําเนินการต่อจากจุดที่คุณค้างไว้ แล้วเพิ่มข้อมูลต่อไปนี้

activity.view.mapView?.updateMapPosition(
  latitude = cameraGeospatialPose.latitude,
  longitude = cameraGeospatialPose.longitude,
  heading = cameraGeospatialPose.heading
)

ซึ่งจะอัปเดตตำแหน่งของแผนที่อย่างต่อเนื่องโดยใช้ค่าที่ได้มาจาก Geospatial API

ลองเลย

ใน Android Studio ให้คลิกเล่น ถืออุปกรณ์ขึ้นแล้วเคลื่อนที่ไปรอบๆ เพื่อช่วยให้ ARCore สร้างการติดตาม หลังจากนั้นสักครู่ คุณควรเห็นเครื่องหมายสีเขียวปรากฏบนแผนที่ เครื่องหมายนี้จะหมุนไปเรื่อยๆ ตามที่คุณมองไปรอบๆ นอกจากนี้ ลูกศรควรชี้ไปในทิศทางที่ถูกต้องด้วย เช่น เมื่อคุณหันหน้าไปทางทิศเหนือ ลูกศรก็ควรชี้ไปทางทิศเหนือด้วย

4. วางหมุดโดยใช้พิกัดของดาวเคราะห์โลก

Geospatial API สามารถวาง Anchor ที่คู่พิกัดและการหมุนได้ในโลกจริง ซึ่งช่วยให้ผู้ใช้เห็นเนื้อหาที่ปักหมุดไว้เมื่อเข้าชมสถานที่หนึ่งๆ

ในขั้นตอนนี้ คุณเพิ่มวิธีวางหมุดโดยแตะแผนที่

ตั้งค่าการดำเนินการเมื่อแตะแผนที่

โปรเจ็กต์มาพร้อมกับฟังก์ชัน onMapClick ซึ่งจะเรียกใช้กับละติจูดและลองจิจูดเมื่อมีการคลิกข้อมูลแผนที่ หาฟังก์ชัน onMapClick ใน HelloGeoRenderer.kt

ตรวจสอบว่าใช้ออบเจ็กต์ Earth ได้

ก่อนสร้างจุดยึดบนโลก โปรดตรวจสอบว่า TrackingState ของวัตถุโลกคือ TRACKING ซึ่งหมายความว่าทราบตำแหน่งของโลกแล้ว และตรวจสอบว่า EarthState เป็น ENABLED ซึ่งหมายความว่าจะไม่พบปัญหาใดๆ กับ Geospatial API เพิ่มบรรทัดต่อไปนี้ภายใน onMapClick

val earth = session?.earth ?: return
if (earth.trackingState != TrackingState.TRACKING) {
  return
}

กำหนดตําแหน่งของแอนคอร์ใหม่

หลังจากยืนยันว่าวัตถุ Earth กำลังติดตามอยู่ ให้ปลด earthAnchor ก่อนหน้าออก หากมี คุณแทนที่ earthAnchor ด้วยหมุดใหม่ในขั้นตอนถัดไป

earthAnchor?.detach()

จากนั้นใช้ cameraGeospatialPose เพื่อกำหนดระดับความสูงของจุดยึดใหม่ ใช้คู่พิกัดจากการแตะแผนที่เป็นตำแหน่งของจุดยึด

// Place the earth anchor at the same altitude as that of the camera to make it easier to view.
val altitude = earth.cameraGeospatialPose.altitude - 1
// The rotation quaternion of the anchor in the East-Up-South (EUS) coordinate system.
val qx = 0f
val qy = 0f
val qz = 0f
val qw = 1f
earthAnchor =
  earth.createAnchor(latLng.latitude, latLng.longitude, altitude, qx, qy, qz, qw)

createAnchor สร้าง Anchor ที่ยึดตามพิกัดทางธรณีศาสตร์ที่มีการหมุนที่กำหนด หมุดนี้พยายามที่จะคงที่และยึดตามพิกัดและระดับความสูงที่ระบุ

ตัวแปร [qx, qy, qz, qw] จะกำหนดการหมุนที่แสดงเป็นควอตเทอร์นิโอนของจุดยึดในระบบพิกัด ตะวันออก-ขึ้น-ใต้ (EUS) คุณใช้ค่าต่างๆ เพื่อหมุนจุดยึด แต่ในตัวอย่างนี้จะใช้ควอเทอร์ไบน์หน่วยสำหรับการหมุนเริ่มต้น การหมุนควอร์เทอร์ไบน์หน่วยมีการกำหนดจุดยึดให้ X+ ชี้ไปทางตะวันออก Y+ ชี้ขึ้นจากใจกลางโลก และ Z+ ชี้ไปทางใต้

แสดงเครื่องหมายที่วางไว้บนแผนที่

สุดท้าย ให้ย้ายเครื่องหมายใหม่ที่ระบุตำแหน่งที่วางเครื่องหมาย

activity.view.mapView?.earthMarker?.apply {
  position = latLng
  isVisible = true
}

ลองเลย

ใน Android Studio ให้คลิกเล่น ถืออุปกรณ์ขึ้นแล้วขยับไปรอบๆ เพื่อช่วย ARCore ในการติดตาม หลังจากนั้นสักครู่ คุณควรเห็นเครื่องหมายสีเขียวปรากฏบนแผนที่ซึ่งระบุตำแหน่งปัจจุบันของคุณ

การแตะแผนที่จะใช้ Geospatial API เพื่อวางหมุดซึ่งยึดอยู่กับตำแหน่งในชีวิตจริง ลองวางจุดยึดใกล้กับตำแหน่งปัจจุบันของคุณเพื่อให้เห็นจุดยึดในมุมมอง AR ควรจะมีความเสถียรขณะที่ไปยังส่วนต่างๆ ของสภาพแวดล้อม

5. บทสรุป

ใน Codelab นี้ คุณได้เรียนรู้วิธีใช้ Geospatial API เพื่อสร้างประสบการณ์ AR แบบง่ายที่เชื่อมโยงกับโลกแห่งความเป็นจริง

สิ่งที่เราได้พูดถึง

• วิธีตั้งค่าโปรเจ็กต์ Google Cloud ที่เปิดใช้ Geospatial API
• วิธีรับข้อมูลเชิงพื้นที่ในโปรเจ็กต์ ARCore และแสดงบนแผนที่
• วิธีวางจุดยึดที่วางตำแหน่งในโลกแห่งความเป็นจริงโดยใช้การกำหนดตำแหน่งทางภูมิศาสตร์

แหล่งข้อมูลเพิ่มเติม

ดูรายละเอียดเพิ่มเติมเกี่ยวกับแนวคิดทางภูมิศาสตร์และ SDK ที่ใช้ใน Codelab นี้ได้ที่แหล่งข้อมูลเพิ่มเติมต่อไปนี้

• เอกสารประกอบเกี่ยวกับ ARCore Geospatial API
• ระบบพิกัดภูมิศาสตร์โลก (WGS)
• Google Maps SDK สําหรับ Android