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

1. ภาพรวม

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

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

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

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

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

สิ่งที่ต้องมี

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

ตั้งค่า Android Studio

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

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

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

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

  1. สร้างโปรเจ็กต์ในคอนโซล Google Cloud ดังนี้
  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.
}

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

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. วางจุดยึดโดยใช้พิกัด Earth

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

ในขั้นตอนนี้ คุณจะเพิ่มวิธีการวางแท็ก Anchor โดยการแตะบนแผนที่

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

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

ตรวจสอบว่าสามารถใช้วัตถุ Earth ได้

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

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

กำหนดตำแหน่งของจุดยึดใหม่

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

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 คงที่เป็นพิกัดทางภูมิศาสตร์ด้วยการหมุนที่กำหนด จุดยึดนี้จะพยายามคงตัวและคงที่ตามพิกัดและระดับความสูงที่ระบุ

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

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

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 นี้ได้ในแหล่งข้อมูลเพิ่มเติมต่อไปนี้