การควบคุมและการสำรวจแผนที่ 3 มิติ

เลือกแพลตฟอร์ม: Android iOS JavaScript

ภาพรวมการควบคุม

แผนที่ที่แสดงผ่านแผนที่ 3 มิติใน Maps JavaScript API มีองค์ประกอบ UI ที่เรียกว่าการควบคุมการสำรวจเพื่อรองรับการโต้ตอบของผู้ใช้กับแผนที่ การควบคุมการสำรวจจะแสดงใน UI ของแผนที่โดยค่าเริ่มต้น แต่สามารถปิดใช้เพื่อความเรียบง่ายหรือเพื่อเว้นที่ว่างสำหรับการควบคุมที่กำหนดเอง โปรดทราบว่าแป้นพิมพ์ลัด สำหรับการสำรวจแผนที่จะพร้อมใช้งานเมื่อปิดใช้ตัวควบคุม UI

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

การควบคุมการสำรวจ

รูปภาพต่อไปนี้แสดงชุดการควบคุมเริ่มต้นที่แสดงโดย แผนที่ 3 มิติใน Maps JavaScript API

รูปภาพแผนที่ที่มีตัวควบคุม

ด้านล่างนี้คือรายการชุดการควบคุมทั้งหมดในแผนที่ 3 มิติใน Maps JavaScript

  • ตัวควบคุมการซูมจะแสดงปุ่ม "+" และ "-" สำหรับเปลี่ยนระดับการซูมของแผนที่
  • ตัวควบคุมการย้ายจะแสดงปุ่ม "←" "→" "↑" และ "↓" สำหรับเปลี่ยน จุดกึ่งกลางของแผนที่
  • การควบคุมการหมุนช่วยให้คุณเปลี่ยนทิศทางของกล้องได้
  • การควบคุมการเอียงช่วยให้คุณเปลี่ยนการเอียงของกล้องได้
  • การควบคุมเข็มทิศจะระบุทิศเหนือของเข็มทิศ และช่วยให้คุณรีเซ็ตกล้องให้หันไปทางทิศเหนือได้

ตัวอย่างโค้ดต่อไปนี้แสดงการสลับการควบคุมการสำรวจ

JavaScript

const map = new Map3DElement({
  center: { lat: 37.819852, lng: -122.478549, altitude: 2000 },
  tilt: 75,
  heading: 330,
  mode: MapMode.SATELLITE,
  defaultUIHidden: true,
});

HTML

<gmp-map-3d
  mode="hybrid"
  range="639.274301042242"
  tilt="64.92100184857551"
  center="34.0768990953219,-118.47450491266041,292.9794737933403"
  heading="-61.02026752077781"
  default-ui-disabled
></gmp-map-3d>

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