กล้องและมุมมอง

Maps SDK สำหรับ iOS ช่วยให้คุณเปลี่ยนจุดชมวิวของผู้ใช้ในแผนที่ได้โดยการเปลี่ยนกล้องของแผนที่

Maps SDK สำหรับ iOS ช่วยให้ผู้ใช้เอียงและหมุนแผนที่เพื่อปรับการวางแนวให้เหมาะกับบริบทได้ ผู้ใช้สามารถเลื่อนแผนที่หรือเปลี่ยนมุมมองโดยมีเวลาในการตอบสนองน้อยมาก ไม่ว่าจะซูมในระดับใดก็ตาม

การเปลี่ยนแปลงกล้องจะไม่เปลี่ยนเครื่องหมาย เส้นประกอบ หรือกราฟิกอื่นๆ ที่คุณเพิ่มไว้ แม้ว่าคุณอาจต้องการเปลี่ยนส่วนที่เพิ่มเหล่านี้เพื่อให้เหมาะกับมุมมองใหม่มากขึ้นก็ตาม

มุมมองแผนที่

Maps SDK สำหรับ iOS ใช้การฉายภาพแบบเมอร์เคเตอร์เพื่อแสดงพื้นผิวโลก (ทรงกลม) บนหน้าจออุปกรณ์ (ระนาบแบน)

ตำแหน่งกล้อง

มุมมองแผนที่จะจำลองเป็นกล้องที่มองลงมายังระนาบแบนราบ ตำแหน่งของกล้อง (และการแสดงผลแผนที่) จะระบุโดยพร็อพเพอร์ตี้ต่อไปนี้ เป้าหมาย (ตำแหน่งละติจูด/ลองจิจูด), ทิศทาง, การเอียง และการซูม

เป้าหมาย (สถานที่ตั้ง)

เป้าหมายของกล้องคือตำแหน่งของศูนย์กลางแผนที่ ซึ่งระบุเป็นพิกัดละติจูดและลองจิจูด

ทิศทาง (การวางแนว)

ทิศทางของกล้องจะระบุทิศทางเข็มทิศ โดยวัดเป็นองศาจากทิศเหนือจริง ซึ่งสอดคล้องกับขอบด้านบนของแผนที่ หากคุณลากเส้นแนวตั้งจากกึ่งกลางแผนที่ไปยังขอบด้านบนของแผนที่ ทิศทางจะสอดคล้องกับทิศทางของกล้อง (วัดเป็นองศา) โดยสัมพันธ์กับทิศเหนือจริง

ทิศทาง 0 หมายความว่าด้านบนของแผนที่ชี้ไปทางทิศเหนือจริง ค่าทิศทาง 90 หมายความว่าด้านบนของแผนที่ชี้ไปทางทิศตะวันออก (90 องศาบนเข็มทิศ) ค่า 180 หมายความว่าด้านบนของแผนที่ชี้ไปทางทิศใต้

Maps API ช่วยให้คุณเปลี่ยนทิศทางของแผนที่ได้ ตัวอย่างเช่น คนขับรถมักจะหมุนแผนที่ถนนให้สอดคล้องกับทิศทางการเดินทาง ขณะที่นักเดินป่าที่ใช้แผนที่และเข็มทิศมักจะปรับทิศทางแผนที่เพื่อให้เส้นแนวตั้งชี้ไปทางทิศเหนือ

การเอียง (มุมมอง)

การเอียงจะกำหนดตำแหน่งของกล้องบนส่วนโค้งเหนือตำแหน่งกึ่งกลางของแผนที่โดยตรง โดยวัดเป็นองศาจากจุดต่ำสุด (ทิศทางที่ชี้ลงด้านล่างของกล้องโดยตรง) ค่า 0 สอดคล้องกับกล้องที่ชี้ลงตรงๆ ค่าที่มากกว่า 0 สอดคล้องกับกล้องที่หันไปทางขอบฟ้าตามจำนวนองศาที่ระบุ เมื่อคุณเปลี่ยนมุมมอง แผนที่จะปรากฏในมุมมองที่มีลักษณะที่อยู่ไกลออกไปจะดูเล็กลง และลักษณะที่อยู่ใกล้จะดูใหญ่ขึ้น ภาพต่อไปนี้แสดงให้เห็นถึงกรณีดังกล่าว

ในรูปภาพด้านล่าง มุมมองคือ 0 องศา ภาพแรกแสดงแผนผังของตำแหน่งนี้ โดยตำแหน่ง 1 คือตำแหน่งกล้อง และตำแหน่ง 2 คือตำแหน่งแผนที่ปัจจุบัน แผนที่ที่ได้จะแสดงอยู่ด้านล่าง

ในรูปภาพด้านล่าง มุมมองคือ 45 องศา สังเกตว่ากล้องจะเคลื่อนที่ไปครึ่งทางตามส่วนโค้งระหว่างตำแหน่งเหนือศีรษะตรงๆ (0 องศา) และพื้น (90 องศา) ไปยังตำแหน่ง 3 กล้องยังคงชี้ไปที่จุดศูนย์กลางของแผนที่ แต่ตอนนี้พื้นที่ที่แสดงด้วยเส้นที่ตำแหน่ง 4 จะมองเห็นได้

แผนที่ในภาพหน้าจอนี้ยังคงอยู่ตรงกลางจุดเดียวกับในแผนที่ต้นฉบับ แต่มีฟีเจอร์เพิ่มเติมปรากฏที่ด้านบนของแผนที่ เมื่อคุณเพิ่มมุมเกิน 45 องศา ฟีเจอร์ระหว่างกล้องและตำแหน่งแผนที่จะปรากฏขึ้นตามสัดส่วนที่ใหญ่ขึ้น ขณะที่ฟีเจอร์ที่อยู่นอกตำแหน่งแผนที่จะปรากฏขึ้นตามสัดส่วนที่เล็กลง ซึ่งจะทำให้เกิดเอฟเฟกต์ 3 มิติ

ซูม

ระดับการซูมของกล้องจะเป็นตัวกำหนดมาตราส่วนของแผนที่ ที่ระดับการซูมที่สูงขึ้น คุณจะเห็นรายละเอียดบนหน้าจอมากขึ้น ขณะที่ระดับการซูมที่ต่ำลง คุณจะเห็นโลกบนหน้าจอมากขึ้น ที่ระดับการซูม 0 มาตราส่วนของแผนที่จะเป็นแบบที่ทั้งโลกมีความกว้างประมาณ 256 จุด

การเพิ่มระดับการซูมขึ้น 1 ระดับจะเพิ่มความกว้างของโลกบนหน้าจอเป็น 2 เท่า ดังนั้นที่ระดับการซูม N ความกว้างของโลกจะอยู่ที่ประมาณ 256 * 2^N จุด เช่น ที่ระดับการซูม 2 ทั่วโลกจะมีความกว้างประมาณ 1024 จุด

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

• 1: โลก
• 5: ผืนแผ่นดิน/ทวีป
• 10: เมือง
• 15: ถนน
• 20: อาคาร

ตั้งค่าตำแหน่งกล้องเริ่มต้น

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

หากต้องการตั้งค่าตำแหน่งกล้องเริ่มต้น ให้สร้างออบเจ็กต์ GMSMapViewOptions และตั้งค่าพร็อพเพอร์ตี้ camera เป็น GMSCameraPosition จากนั้นส่งตัวเลือกไปยังเมธอดคอนสตรัคเตอร์ GMSMapView ที่ช่วยอำนวยความสะดวก

let options = GMSMapViewOptions()
options.camera = GMSCameraPosition.camera(withLatitude: -33.8683, longitude: 151.2086, zoom: 16)
let mapView = GMSMapView(options:options)

GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
options.camera = [GMSCameraPosition cameraWithLatitude:-33.8683
                                                        longitude:151.2086
                                                             zoom:16];
GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];

นอกจากนี้ คุณยังสร้างออบเจ็กต์ GMSMapView โดยใช้เมธอด init UIView เริ่มต้นได้ด้วย ในกรณีนี้ ตำแหน่งกล้องจะเริ่มต้นที่ตำแหน่งเริ่มต้น และคุณจะเปลี่ยนตำแหน่งกล้องได้หลังจากสร้างแล้ว

let options = GMSMapViewOptions()
options.frame = self.view.bounds
let mapView = GMSMapView(options:options)

GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
options.frame = self.view.bounds;
GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];

เปลี่ยนตำแหน่งกล้อง

คุณสามารถเปลี่ยนตำแหน่งกล้องแบบเป็นโปรแกรมเพื่อตั้งค่าตำแหน่ง ทิศทาง การเอียง และการซูมได้ แม้ว่า GMSMapView จะมีหลายวิธีที่คุณสามารถใช้เพื่อเปลี่ยนตำแหน่งกล้อง แต่โดยทั่วไปคุณจะใช้ GMSCameraPosition หรือ GMSCameraUpdate ดังนี้

• GMSCameraPosition มีพร็อพเพอร์ตี้และเมธอดที่คุณใช้เพื่อเปลี่ยนพารามิเตอร์ตำแหน่งกล้องทุกรายการ ได้แก่ เป้าหมาย ทิศทาง การเอียง และการซูม

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

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

ภาพเคลื่อนไหวจะสอดแทรกระหว่างแอตทริบิวต์กล้องปัจจุบันกับแอตทริบิวต์กล้องใหม่ คุณควบคุมระยะเวลาของภาพเคลื่อนไหวได้โดยใช้ Core Animation

ใช้ GMSCameraPosition

หากต้องการเปลี่ยนกล้องด้วย GMSCameraPosition คุณต้องสร้างออบเจ็กต์ใหม่หรือคัดลอกออบเจ็กต์ที่มีอยู่ แล้วตั้งค่าในออบเจ็กต์ GMSMapView ใช้ออบเจ็กต์ GMSCameraPosition เพื่อสแนปกล้องไปยังตำแหน่งใหม่โดยมีหรือไม่มีภาพเคลื่อนไหว

ใช้ออบเจ็กต์ GMSCameraPosition เพื่อกำหนดค่าพร็อพเพอร์ตี้ของกล้อง เช่น ละติจูด ลองจิจูด การซูม ทิศทาง และมุมมอง จากนั้นใช้ออบเจ็กต์นั้นเพื่อตั้งค่าพร็อพเพอร์ตี้ camera ของ GMSMapView

let fancy = GMSCameraPosition(
  latitude: -33,
  longitude: 151,
  zoom: 6,
  bearing: 270,
  viewingAngle: 45
)
mapView.camera = fancy
      

GMSCameraPosition *fancy = [GMSCameraPosition cameraWithLatitude:-33.8683
                                                       longitude:151.2086
                                                            zoom:6
                                                         bearing:30
                                                    viewingAngle:45];
[mapView setCamera:fancy];
      

ละเว้นพร็อพเพอร์ตี้ GMSCameraPosition ที่ต้องการตั้งค่าเป็นค่าเริ่มต้น

หากต้องการทำให้การเคลื่อนไหวเป็นภาพเคลื่อนไหว ให้ใช้เมธอด animateToCameraPosition: แทนการตั้งค่าพร็อพเพอร์ตี้ camera

ใช้ GMSCameraUpdate

GMSCameraUpdate ช่วยให้คุณอัปเดตตำแหน่งกล้อง และเลือกว่าจะสแนปหรือเคลื่อนไหวไปยังตำแหน่งใหม่นั้น ข้อดีของ GMSCameraUpdate คือความสะดวกสบาย คุณสามารถใช้ GMSCameraPosition เพื่อทำงานเดียวกันกับ GMSCameraUpdate ได้ แต่ GMSCameraUpdate จะมีเมธอดตัวช่วยเพิ่มเติมเพื่อให้จัดการกล้องได้ง่ายขึ้น

ตัวอย่างเช่น หากต้องการใช้ GMSCameraPosition เพื่อเพิ่มระดับการซูมปัจจุบัน คุณต้องกำหนดระดับการซูมปัจจุบันก่อน จากนั้นจึงสร้างออบเจ็กต์ GMSCameraPosition โดยตั้งค่าการซูมให้มากกว่าการซูมปัจจุบัน 1 ระดับ

หรือสร้างออบเจ็กต์ GMSCameraUpdate ด้วยเมธอด zoomIn: จากนั้นอัปเดตกล้องโดยส่งออบเจ็กต์ GMSCameraUpdate ไปยังเมธอด GMSMapView animateWithCameraUpdate:

// Zoom in one zoom level
let zoomCamera = GMSCameraUpdate.zoomIn()
mapView.animate(with: zoomCamera)
      

// Zoom in one zoom level
GMSCameraUpdate *zoomCamera = [GMSCameraUpdate zoomIn];
[mapView animateWithCameraUpdate:zoomCamera];
      

ใช้เมธอด GMSMapView moveCamera: เพื่อสแนปกล้องไปยังตำแหน่งใหม่แทน

ในตัวอย่างถัดไป คุณจะใช้ GMSCameraUpdate เพื่อสร้างภาพเคลื่อนไหวของการเคลื่อนกล้องเพื่อจัดให้อยู่ตรงกลางของแวนคูเวอร์

// Center the camera on Vancouver, Canada
let vancouver = CLLocationCoordinate2D(latitude: 49.26, longitude: -123.11)
let vancouverCam = GMSCameraUpdate.setTarget(vancouver)
mapView.animate(with: vancouverCam)
      

// Center the camera on Vancouver, Canada
CLLocationCoordinate2D vancouver = CLLocationCoordinate2DMake(49.26, -123.11);
GMSCameraUpdate *vancouverCam = [GMSCameraUpdate setTarget:vancouver];
[mapView animateWithCameraUpdate:vancouverCam];
      

สร้างออบเจ็กต์ GMSCameraUpdate

สร้างออบเจ็กต์ GMSCameraUpdate โดยใช้วิธีการใดวิธีการหนึ่ง

zoomIn: และ zoomOut:

เปลี่ยนระดับการซูมปัจจุบัน 1.0 โดยคงพร็อพเพอร์ตี้อื่นๆ ทั้งหมดไว้เหมือนเดิม

zoomTo:

เปลี่ยนระดับการซูมเป็นค่าที่ระบุ โดยยังคงพร็อพเพอร์ตี้อื่นๆ ทั้งหมดไว้เหมือนเดิม

zoomBy:

เพิ่ม (หรือลด หากค่าเป็นลบ) ระดับการซูมตามค่าที่ระบุ

zoomBy:atPoint:

เพิ่ม (หรือลด หากค่าเป็นลบ) ระดับการซูมตามค่าที่ระบุ โดยยังคงตำแหน่งของจุดที่ระบุไว้บนหน้าจอ

setTarget:

เปลี่ยนละติจูดและลองจิจูดของกล้อง โดยยังคงพร็อพเพอร์ตี้อื่นๆ ทั้งหมดไว้

setTarget:zoom:

เปลี่ยนละติจูด ลองจิจูด และการซูมของกล้อง โดยยังคงพร็อพเพอร์ตี้อื่นๆ ทั้งหมดไว้

setCamera:

ตั้งค่า GMSCameraPosition ใหม่

scrollByX:Y:

เปลี่ยนละติจูดและลองจิจูดของกล้องเพื่อเลื่อนแผนที่ตามจำนวนจุดที่ระบุ ค่า x ที่เป็นบวกจะทำให้กล้องเลื่อนไปทางขวา เพื่อให้แผนที่ดูเหมือนเลื่อนไปทางซ้าย ค่า y ที่เป็นบวกจะทำให้กล้องเลื่อนลง เพื่อให้แผนที่ดูเหมือนเลื่อนขึ้น การเลื่อนจะสัมพันธ์กับทิศทางปัจจุบันของกล้อง เช่น หากกล้องมีทิศทาง 90 องศา ทิศตะวันออกจะอยู่ "ด้านบน"

fitBounds:

เปลี่ยนรูปแบบกล้องเพื่อจัดกึ่งกลางขอบเขตที่ระบุบนหน้าจอที่ระดับการซูมสูงสุดที่เป็นไปได้ ใช้ระยะห่างจากขอบเริ่มต้นกับขอบเขต 64 จุด

fitBounds:withPadding:

เปลี่ยนรูปแบบกล้องเพื่อจัดกึ่งกลางขอบเขตที่ระบุบนหน้าจอที่ระดับการซูมสูงสุดที่เป็นไปได้ ใช้วิธีนี้เพื่อระบุระยะห่างจากขอบเดียวกัน (หน่วยเป็นพอยต์) สำหรับทุกด้านของกรอบล้อมรอบ

fitBounds:withEdgeInsets:

เปลี่ยนรูปแบบกล้องเพื่อจัดกึ่งกลางขอบเขตที่ระบุบนหน้าจอที่ระดับการซูมสูงสุดที่เป็นไปได้ เมื่อใช้ UIEdgeInsets คุณจะระบุระยะห่างจากขอบสำหรับแต่ละด้านของกรอบล้อมรอบแยกกันได้

ใช้ GMSMapView เพื่อเปลี่ยนพร็อพเพอร์ตี้เดียว

GMSMapView มีหลายวิธีที่ช่วยให้คุณย้ายกล้องได้โดยไม่ต้องใช้ออบเจ็กต์ GMSCameraPosition หรือออบเจ็กต์ GMSCameraUpdate วิธีการเหล่านี้ เช่น animateToLocation: หรือ animateToZoom: ช่วยให้คุณสร้างภาพเคลื่อนไหวของการเปลี่ยนแปลงพร็อพเพอร์ตี้กล้องรายการเดียวได้

เช่น ใช้เมธอด toViewingAngle: เพื่อสร้างภาพเคลื่อนไหวการเปลี่ยนแปลงการเอียงกล้อง

mapView.animate(toViewingAngle: 45)
      

[mapView animateToViewingAngle:45];
      

กำหนดเป้าหมาย (สถานที่ตั้ง)

ตำแหน่งจะเป็นตัวกำหนดจุดศูนย์กลางของแผนที่ สถานที่ตั้งจะระบุด้วยละติจูดและลองจิจูด และแสดงแบบเป็นโปรแกรมโดย CLLocationCoordinate2D ซึ่งสร้างด้วย CLLocationCoordinate2DMake

ใช้ GMSCameraPosition เพื่อเปลี่ยนตำแหน่ง ในตัวอย่างนี้ แผนที่จะสแนป ไปยังตำแหน่งใหม่

let target = CLLocationCoordinate2D(latitude: -33.868, longitude: 151.208)
mapView.camera = GMSCameraPosition(target: target, zoom: 6)
      

CLLocationCoordinate2D target =
    CLLocationCoordinate2DMake(-33.868, 151.208);
mapView.camera = [GMSCameraPosition cameraWithTarget:target zoom:6];
      

หากต้องการทำให้การเปลี่ยนแปลงเคลื่อนไหวและเลื่อนแผนที่ไปยังตำแหน่งใหม่ คุณสามารถใช้เมธอด animateToCameraPosition: แทนการตั้งค่าพร็อพเพอร์ตี้ camera หรือใช้เมธอด animateToLocation: ใน GMSMapView

mapView.animate(toLocation: CLLocationCoordinate2D(latitude: -33.868, longitude: 151.208))
      

[mapView animateToLocation:CLLocationCoordinate2DMake(-33.868, 151.208)];
      

นอกจากนี้ คุณยังสร้างออบเจ็กต์ GMSCameraUpdate เพื่อย้ายกล้องได้ด้วย ใช้เมธอดในตัว scrollByX:Y: เพื่อระบุจำนวนจุดที่จะเลื่อนกล้องในทิศทาง X และ Y ในตัวอย่างนี้ คุณเลื่อนกล้องไปทางขวา 200 จุดและเลื่อนลง 100 จุด

// Move the camera 200 points to the right, and 100 points downwards
let downwards = GMSCameraUpdate.scrollBy(x: 200, y: 100)
mapView.animate(with: downwards)
      

// Move the camera 200 points to the right, and 100 points downwards
GMSCameraUpdate *downwards = [GMSCameraUpdate scrollByX:200.0 Y:100.0];
[mapView animateWithCameraUpdate:downwards];
      

ตั้งค่าทิศทาง (การวางแนว)

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

ตั้งค่าทิศทางแบบเป็นโปรแกรมด้วย GMSCameraPosition หรือ GMSCameraUpdate หรือด้วยเมธอด animateToBearing: ของ GMSMapView

mapView.animate(toBearing: 0)
      

[mapView animateToBearing:0];
      

ตั้งค่าการเอียง (มุมมอง)

มุมมองคือตำแหน่งของกล้องบนส่วนโค้งระหว่างตำแหน่งเหนือศูนย์กลางของแผนที่โดยตรงกับพื้นผิวโลก โดยวัดเป็นองศาจากจุดต่ำสุด (ทิศทางที่ชี้ลงด้านล่างของกล้องโดยตรง) เมื่อคุณเปลี่ยนมุมมอง แผนที่จะปรากฏในมุมมองที่มีฟีเจอร์ระหว่างกล้องกับตำแหน่งแผนที่ซึ่งปรากฏใหญ่ขึ้นตามสัดส่วน และฟีเจอร์ที่อยู่นอกตำแหน่งแผนที่ซึ่งปรากฏเล็กลงตามสัดส่วน ทำให้เกิดเอฟเฟกต์ 3 มิติ

มุมมองอาจอยู่ระหว่าง 0 (ชี้ลงตรงๆ ที่แผนที่) และสูงสุดตามระดับการซูม สำหรับระดับการซูม 16 ขึ้นไป มุมสูงสุดคือ 65 องศา สำหรับระดับการซูม 10 หรือต่ำกว่า มุมสูงสุดคือ 30 องศา

ตั้งค่ามุมมองแบบเป็นโปรแกรมโดยใช้ GMSCameraPosition หรือ GMSCameraUpdate หรือใช้เมธอด animateToViewingAngle: ของ GMSMapView

mapView.animate(toViewingAngle: 45)
      

[mapView animateToViewingAngle:45];
      

ตั้งค่าการซูม

ระดับการซูมของกล้องจะเป็นตัวกำหนดมาตราส่วนของแผนที่ ที่ระดับการซูมที่ใหญ่ขึ้น คุณจะเห็นรายละเอียดบนหน้าจอมากขึ้น ส่วนที่ระดับการซูมที่เล็กลง คุณจะเห็นโลกมากขึ้น

ตั้งค่าการซูมแบบเป็นโปรแกรมด้วย GMSCameraPosition หรือ GMSCameraUpdate หรือด้วยเมธอด animateToZoom: ของ GMSMapView

mapView.animate(toZoom: 12)
      

[mapView animateToZoom:12];
      

ตัวอย่างต่อไปนี้ใช้เมธอด zoomIn: เพื่อสร้างออบเจ็กต์ GMSCameraUpdate เพื่อทำให้การซูมเข้าเคลื่อนไหวโดยเพิ่มขึ้น 1 ระดับจากระดับปัจจุบัน

// Zoom in one zoom level
let zoomCamera = GMSCameraUpdate.zoomIn()
mapView.animate(with: zoomCamera)
      

// Zoom in one zoom level
GMSCameraUpdate *zoomCamera = [GMSCameraUpdate zoomIn];
[mapView animateWithCameraUpdate:zoomCamera];
      

กำหนดขอบเขต

หากต้องการขยับกล้องเพื่อให้มองเห็นพื้นที่ที่สนใจทั้งหมดในระดับการซูมสูงสุดที่เป็นไปได้ ให้กำหนดขอบเขตสำหรับมุมมองกล้อง ตัวอย่างเช่น หากต้องการแสดงปั๊มน้ำมันทั้งหมดภายในรัศมี 5 ไมล์จากตำแหน่งปัจจุบันของผู้ใช้ ให้เลื่อนกล้องเพื่อให้ปั๊มน้ำมันทั้งหมดปรากฏบนหน้าจอ ดังนี้

1. คำนวณ GMSCoordinateBounds ที่คุณต้องการให้แสดงบนหน้าจอ
2. ใช้เมธอด cameraForBounds:insets: ของ GMSMapView เพื่อแสดงผล GMSCameraPosition ใหม่

ตั้งค่าขอบเขตเหล่านี้เพื่อให้ GMSCoordinateBounds ที่ระบุพอดีกับขนาดของแผนที่ปัจจุบัน โปรดทราบว่าวิธีนี้จะตั้งค่าการเอียงและการหมุนของแผนที่เป็น 0

ตัวอย่างต่อไปนี้แสดงวิธีเปลี่ยนกล้องเพื่อให้เมืองแวนคูเวอร์และแคลกะรีปรากฏในมุมมองเดียวกัน

let vancouver = CLLocationCoordinate2D(latitude: 49.26, longitude: -123.11)
let calgary = CLLocationCoordinate2D(latitude: 51.05,longitude: -114.05)
let bounds = GMSCoordinateBounds(coordinate: vancouver, coordinate: calgary)
let camera = mapView.camera(for: bounds, insets: UIEdgeInsets())!
mapView.camera = camera
      

CLLocationCoordinate2D vancouver = CLLocationCoordinate2DMake(49.26, -123.11);
CLLocationCoordinate2D calgary = CLLocationCoordinate2DMake(51.05, -114.05);
GMSCoordinateBounds *bounds =
    [[GMSCoordinateBounds alloc] initWithCoordinate:vancouver coordinate:calgary];
GMSCameraPosition *camera = [mapView cameraForBounds:bounds insets:UIEdgeInsetsZero];
mapView.camera = camera;
      

จำกัดการเลื่อนของผู้ใช้ให้อยู่ในพื้นที่ที่กำหนด

สถานการณ์เหล่านี้จะกำหนดขอบเขตของแผนที่ แต่ผู้ใช้สามารถเลื่อนหรือแพนออกนอกขอบเขตเหล่านี้ได้ แต่คุณอาจต้องการจำกัดขอบเขตศูนย์กลางพิกัดของจุดโฟกัสของแผนที่ (เป้าหมายกล้อง) เพื่อให้ผู้ใช้เลื่อนและเลื่อนได้ภายในขอบเขตเหล่านี้เท่านั้น

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

หากต้องการจำกัดการเลื่อนให้อยู่ในขอบเขตที่เฉพาะเจาะจง ให้ตั้งค่าพร็อพเพอร์ตี้ cameraTargetBounds ของ GMSMapView เป็นออบเจ็กต์ GMSCoordinateBounds ที่กำหนดขอบเขตที่ต้องการ หากต้องการนำข้อจำกัดออกในภายหลัง ให้ตั้งค่า cameraTargetBounds เป็น nil

mapView.cameraTargetBounds = bounds
      

mapView.cameraTargetBounds = bounds;
      

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

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

ในแผนภาพต่อไปนี้ เป้าหมายกล้องมีขอบเขตที่จำกัดมาก ทำให้ผู้ใช้มีโอกาสเลื่อนหรือแพนแผนที่ได้น้อยมาก เครื่องหมายกากบาทแสดงถึง เป้าหมายของกล้อง

ตั้งค่าการซูมต่ำสุดหรือสูงสุด

ค่าคงที่ส่วนกลาง kGMSMinZoomLevel และ kGMSMaxZoomLevel จะกำหนดค่าการซูมต่ำสุดหรือสูงสุด โดยค่าเริ่มต้น พร็อพเพอร์ตี้ minZoom และ maxZoom ของ GMSMapView จะตั้งค่าเป็นค่าคงที่เหล่านี้

หากต้องการจำกัดช่วงของระดับการซูมที่ใช้ได้กับแผนที่ ให้ตั้งค่าระดับการซูมต่ำสุดและสูงสุด โค้ดต่อไปนี้จะจำกัดระดับการซูมให้อยู่ระหว่าง 10 ถึง 15

let camera = GMSCameraPosition(
  latitude: 41.887,
  longitude: -87.622,
  zoom: 12
)
let options = GMSMapViewOptions()
options.camera = camera
let mapView = GMSMapView(options: options)
mapView.setMinZoom(10, maxZoom: 15)
      

GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:41.887
                                                       longitude:-87.622
                                                             zoom:12];
GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
options.camera = camera;
GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];
[mapView setMinZoom:10 maxZoom:15];
      

คุณต้องตั้งค่าช่วงการซูมด้วยเมธอด setMinZoom:maxZoom: แต่คุณสามารถอ่านค่าปัจจุบันได้โดยใช้พร็อพเพอร์ตี้ minZoom และ maxZoom วิธีนี้มีประโยชน์เมื่อจำกัดค่าเพียงค่าเดียว โค้ดต่อไปนี้จะเปลี่ยนเฉพาะระดับการซูมต่ำสุด

mapView.setMinZoom(12, maxZoom: mapView.maxZoom)
      

[mapView setMinZoom:12 maxZoom:mapView.maxZoom];
      

หากหลังจากอัปเดตการซูมต่ำสุดและสูงสุดแล้ว ระดับการซูมของกล้องถูกตั้งค่าเป็นค่าที่อยู่นอกช่วงใหม่ การซูมปัจจุบันจะอัปเดตโดยอัตโนมัติเพื่อแสดงค่าที่ถูกต้องที่ใกล้เคียงที่สุด ตัวอย่างเช่น ในโค้ดต่อไปนี้ การซูมเดิมจะกำหนดเป็น 4 เมื่อตั้งค่าช่วงการซูมเป็น 10-15 ในภายหลัง การซูมปัจจุบันจะอัปเดตเป็น 10

// Sets the zoom level to 4.
let camera2 = GMSCameraPosition(
  latitude: 41.887,
  longitude: -87.622,
  zoom: 4
)
let options2 = GMSMapViewOptions()
options2.camera = camera2
let mapView2 = GMSMapView(options: options2)

// The current zoom, 4, is outside of the range. The zoom will change to 10.
mapView2.setMinZoom(10, maxZoom: 15)
      

// Sets the zoom level to 4.
GMSCameraPosition *camera2 = [GMSCameraPosition cameraWithLatitude:41.887
                                                         longitude:-87.622
                                                              zoom:4];
GMSMapViewOptions *options2 = [[GMSMapViewOptions alloc] init];
options2.camera = camera2;
GMSMapView *mapView2 = [[GMSMapView alloc] initWithOptions:options2];
// The current zoom, 4, is outside of the range. The zoom will change to 10.
[mapView setMinZoom:10 maxZoom:15];