מצלמה ותצוגה

בחירת פלטפורמה: Android iOS JavaScript

ניתן להטות ולסובב את המפות ב-SDK של מפות ל-Android בקלות שמאפשרות למשתמשים להתאים את המפה בכיוון הגיוני עבורם. בכל רמת זום ניתן להזיז את המפה או לשנות אותה עם זמן אחזור קצר מאוד, הודות לטביעת הרגל הקטנה יותר של קטעי מפה מבוססי וקטורים.

דוגמאות קוד

מאגר ApiDemos ב-GitHub כולל דוגמה מדגים את תכונות המצלמה:

מבוא

בדומה למפות Google באינטרנט, ה-SDK של מפות Google ל-Android מייצג את פני השטח של העולם (כדור) על מסך המכשיר שלך (מישור שטוח) באמצעות הפונקציה הקרנת Marcator. בכיוון מזרח ומערב, המפה חוזרת על עצמה ללא הגבלה, כי העולם עוטף את עצמו ללא הפרעות. ב הכיוון הצפוני והדרומי של המפה מוגבל ל-85 מעלות צפונה בערך. ו-85 מעלות דרומה.

הערה: להיטל Mercator יש רוחב סופי. לאורך אבל גובה אינסופי של גובה. אנחנו "חותכים" מפה בסיסית באמצעות הקרנה של Mercator בערך של 85 מעלות (+/- 85 מעלות) עד להפוך את צורת המפה שמתקבלת לריבוע, מה שמאפשר לוגיקה קלה יותר לאריח בחירה.

ה-SDK של מפות Google ל-Android מאפשר לשנות את נקודת המבט של המשתמש על ידי שינוי המצלמה של המפה.

שינויים במצלמה לא יבצעו שינויים בסמנים, בשכבות-על או בפריטים אחרים של הגרפיקה שהוספת, למרות שאולי תרצה לשנות את ההוספות כדי שיתאימו טוב יותר עם התצוגה החדשה.

מאחר שניתן להקשיב לתנועות של משתמשים במפה, אפשר לשנות את המפה ב תגובה לבקשות משתמשים. לדוגמה, שיטת הקריאה החוזרת OnMapClickListener.onMapClick() מגיב על בהקשה אחת על המפה. כי השיטה מקבלת את קווי האורך והרוחב של מיקום ההקשה, אפשר להגיב על ידי הזזה או שינוי מרחק התצוגה לנקודה הזו. יש שיטות דומות לתגובה להקשות על בועה של סמן, או לתגובה לתנועת גרירה על סמן.

אפשר גם להאזין לתנועות המצלמה, כדי שהאפליקציה תקבל התראה כשהמצלמה מתחילה לזוז, זזה כרגע או מפסיקה עובר. פרטים נוספים זמינים במדריך לאירועי שינוי מצלמה.

מיקום המצלמה

המודל של תצוגת המפה הוא מצלמה שמביטה למטה במישור שטוח. המיקום של המצלמה (וכתוצאה מכך עיבוד המפה) מוגדר על ידי המאפיינים הבאים: target (הגדרות של קו רוחב/קו אורך), נושא, הטיה, ולשנות את מרחק התצוגה.

תרשים של מאפייני המצלמה

טירגוט (מיקום)

יעד המצלמה הוא המיקום של מרכז המפה, מוגדר בתור קווי אורך ורוחב.

קו הרוחב יכול להיות בין -85 לבין 85 מעלות, כולל. ערכים מעל הפונקציה תותאם לערך הקרוב ביותר בטווח הזה או מתחת לטווח הזה. לדוגמה, ציון קו רוחב של 100 תגדיר את הערך כ-85. קו אורך בין -180 ל-180 מעלות, כולל. ערכים מעל או מתחת לערך הזה יהיה מוקף בטווח (180-, 180). עבור לדוגמה, הערכים 480, 840 ו-1200 יעטפו ב-120 מעלות.

כיוון (כיוון)

מיב המצלמה מציין את כיוון המצפן, נמדד במעלות מצפון אמיתי, תואם לקצה העליון של המפה. אם משרטטים קו אנכי ממרכז המפה עד לקצה העליון של המפה, הכיוון תואם לכותרת המצלמה (נמדד במעלות) באופן יחסי לצפון האמיתי.

אם הערך של 0 הוא 0, החלק העליון של המפה מפנה לכיוון הצפון האמיתי. ערך כיוון 90 מציין את החלק העליון של נקודות המפה עקב מזרח (90 מעלות במצפן). ערך 180 פירושו החלק העליון של הנקודות במפה לתשלום דרומה.

ה-API של מפות Google מאפשר לכם לשנות את כיוון הניווט של המפה. למשל, מישהו שנוהג במכונית בדרך כלל מפנה מפת כביש כדי ליישר אותה עם כיוון הנסיעה שלהם, בעוד שמטיילים משתמשים במפה בדרך כלל מכוונים את המפה כך שקו אנכי פונה צפונה.

הטיה (זווית צפייה)

ההטיה מגדירה את מיקום המצלמה על קשת ישירות מעל במרכז, נמדד במעלות נאדיר (הכיוון פונה ישירות מתחת למצלמה). הערך 0 תואם למכוונים במצלמה ישר למטה. ערכים שגדולים מ-0 מתאימים למצלמה שפונה לכיוון האופק באמצעות מספר המעלות שצוין. כשמשנים את זווית הצפייה, המפה מופיעה פרספקטיבה עם ישויות רחוקות מופיעות קטן יותר, ותכונות קרובות מופיעות גדולות יותר. הבאים ואיורים ממחישים זאת.

בתמונות שלמטה, זווית הצפייה היא 0 מעלות. בתמונה הראשונה מוצג תכמה זה; מיקום 1 הוא מיקום המצלמה ומיקום 2 הוא המיקום הנוכחי במפה. המפה שמתקבלת מוצגת מתחתיה.

צילום מסך של מפה עם מצלמה שממוקמת בזווית צפייה של 0 מעלות, ברמת זום של 18.
המפה שמוצגת עם זווית הצפייה שמוגדרת כברירת המחדל של המצלמה.
תרשים שמציג את מיקום ברירת המחדל של המצלמה, ישירות מעל המיקום במפה, בזווית של 0 מעלות.
זווית הצפייה שמוגדרת כברירת מחדל במצלמה.

בתמונות שלמטה, זווית הצפייה היא 45 מעלות. שימו לב שהמצלמה נע באמצע קשת בין קשת ישרה (0 מעלות) לבין הקרקע (90 מעלות), למיקום 3. המצלמה עדיין מופנית לנקודת המרכז של המפה, אבל האזור הקו מיוצג על ידי הקו במיקום 4 יוצג עכשיו.

צילום מסך של מפה עם מצלמה שממוקמת בזווית צפייה של 45 מעלות, ברמת זום של 18.
המפה מוצגת בזווית צפייה של 45 מעלות.
תרשים שבו זווית הצפייה של המצלמה מוגדרת ל-45 מעלות, ורמת הזום עדיין מוגדרת ל-18.
זווית צפייה של 45 מעלות של המצלמה.

המפה בצילום המסך הזה עדיין ממורכזת באותה נקודה המפה המקורית, אך תכונות נוספות הופיעו בחלק העליון של המפה. לפי המיקום שלך להגדיל את הזווית מעבר ל-45 מעלות, מיקומים בין המצלמה והמפה נראה גדול יותר באופן יחסי, בעוד שפריטים שנמצאים מעבר למיקום המפה ייראה קטן יותר בצורה פרופורציונלית, באופן שיוצר אפקט תלת ממדי.

מרחק מתצוגה

רמת הזום של המצלמה קובעת את קנה המידה של המפה. בזום גדול יותר רמות פירוט נוספות על המסך, וברמות זום קטנות יותר חלק גדול יותר מהעולם. ברמת זום 0, קנה המידה של כך שהרוחב של העולם כולו הוא כ-256dp (פיקסלים שלא תלויים בדחיסות).

הגדלת רמת הזום ב-1 מכפילה את רוחב העולם במסך. לכן ברמת הזום N, רוחב העולם הוא בערך 256 * 2N dp. לדוגמה, ברמת זום 2, העולם כולו הוא פחות או יותר רוחב של 1024dp.

רמת הזום לא חייבת להיות מספר שלם. הטווח של מרחק התצוגה הרמות שמותרות במפה תלויות במספר גורמים, כולל יעד, סוג המפה וגודל המסך. כל מספר שנמצא מחוץ לטווח יומר הערך החוקי הקרוב ביותר, שיכול להיות רמת הזום המינימלית רמת זום מקסימלית. ברשימה הבאה מוצגת רמת הפירוט המשוערת תוכלו לראות את הנתונים הבאים בכל אחת מרמות הזום:

  • 1: עולם
  • 5: פני השטח/יבשת
  • 10: עיר
  • 15: רחובות
  • 20: מבנים
בתמונות הבאות מוצג המראה החזותי של רמות זום שונות:
צילום מסך של מפה ברמת זום של 5
מפה ברמת זום 5.
צילום מסך של מפה ברמת זום של 15
מפה ברמת זום 15.
צילום מסך של מפה ברמת זום 20
מפה ברמת זום 20.

הזזת המצלמה

ה-API של מפות Google מאפשר לכם לשנות את החלק בעולם הגלוי מפה אפשר לעשות את זה על ידי שינוי מיקום המצלמה (בניגוד למצב של הזזת המפה).

כשמחליפים את המצלמה, אפשר להוסיף אנימציה תנועת המצלמה. האנימציה עוברת אינטרפולציה בין המצלמה הנוכחית ואת מאפייני המצלמה החדשים. אפשר גם לשלוט משך האנימציה.

כדי לשנות את מיקום המצלמה, צריך לציין את היעד מזיזים את המצלמה באמצעות CameraUpdate. API של מפות Google מאפשר ליצור סוגים רבים ושונים של CameraUpdate באמצעות CameraUpdateFactory. אלו האפשרויות הזמינות:

שינוי רמת הזום והגדרת זום מינימלי/מקסימלי

CameraUpdateFactory.zoomIn() ו- CameraUpdateFactory.zoomOut() נותן לך CameraUpdate שמשנה את רמת הזום ב-1.0, תוך שמירה על כל שאר המאפיינים זהים.

CameraUpdateFactory.zoomTo(float) נותן ערך של CameraUpdate שמשנה את מרחק התצוגה לערך הנתון, תוך שמירה על כל שאר הנכסים ללא שינוי.

CameraUpdateFactory.zoomBy(float) וגם CameraUpdateFactory.zoomBy(float, Point) נותן לך CameraUpdate עולה (או יורד, אם הערך הוא שלילי) רמת הזום בערך הנתון. האחרון מתקן את הנקודה הנתונה במסך כך שיישאר באותו מיקום (קו רוחב/קו אורך) ולכן הוא עשוי לשנות את מיקום המצלמה כדי לעשות זאת.

מומלץ להגדיר רמה מינימלית ו/או מקסימלית מועדפת לשינוי מרחק התצוגה. לדוגמה, המאפיין הזה עוזר לכם לשלוט בחוויית המשתמש אם באפליקציה מוצג אזור מוגדר סביב נקודת עניין, או אם משתמשים במשבצת מותאמת אישית ליצור שכבת-על עם קבוצה מוגבלת של רמות זום.

Kotlin



private lateinit var map: GoogleMap

    map.setMinZoomPreference(6.0f)
    map.setMaxZoomPreference(14.0f)

Java


private GoogleMap map;
    map.setMinZoomPreference(6.0f);
    map.setMaxZoomPreference(14.0f);

שימו לב שיש שיקולים טכניים שעשויים למנוע מה-API כך שמשתמשים יכולים להגדיל את התצוגה נמוכה או גבוהה מדי. לדוגמה: לוויין או פני שטח עשוי להיות מרחק מקסימלי נמוך יותר מאשר פקדי המפה הבסיסית.

שינוי מיקום המצלמה

יש שתי שיטות נוחות לשינויי מיקום נפוצים. CameraUpdateFactory.newLatLng(LatLng) נותן ערך CameraUpdate שמשנה את קו הרוחב וקו האורך של המצלמה תוך שימור כל שאר המאפיינים. CameraUpdateFactory.newLatLngZoom(LatLng, float) נותן CameraUpdate שמשנה את מיקום המצלמה קו רוחב, קו אורך וזום, תוך שימור כל שאר המאפיינים.

לקבלת גמישות מלאה בשינוי מיקום המצלמה, CameraUpdateFactory.newCameraPosition(CameraPosition) שמעניק CameraUpdate שמזיז את המצלמה את המיקום הנתון. אפשר לקבל CameraPosition באופן ישיר, באמצעות new CameraPosition() או עם CameraPosition.Builder באמצעות new CameraPosition.Builder()

הזזה (גלילה)

CameraUpdateFactory.scrollBy(float, float) נותן לך CameraUpdate משנה את קווי האורך והרוחב של המצלמה, כך שהמפה זזה את מספר הפיקסלים שצוין. ערך x חיובי גורם למצלמה לעבור אל מימין, כדי שנראה שהמפה זזה שמאלה. y חיובי גורם למצלמה לנוע למטה, כך שנראה שהמפה זזה למעלה. לעומת זאת, ערכי x שלילי גורמים למצלמה לנוע שמאלה, כך שנראה שהמפה זזה ימינה וערכי y שליליים גורמים להזיז את המצלמה למעלה. הגלילה ביחס לסביבה הנוכחית של המצלמה לכיוון מסוים. לדוגמה, אם למצלמה יש כיוון של 90 מעלות, אז לכיוון מזרח הוא 'למעלה'.

גבולות

הגדרת גבולות המפה

לפעמים כדאי להעביר את מצלמה כך שאזור עניין שלם ייראה בצורה הטובה ביותר. רמת הזום. לדוגמה, אם אתם מציגים את כל תחנות הדלק בתוך במרחק של 5 ק"מ מהמיקום הנוכחי של המשתמש, כדאי להזיז את המצלמה שהם גלויים לכולם במסך. לשם כך, קודם צריך לחשב את LatLngBounds שרוצים שיוצג במסך. שלך לאחר מכן הוא יכול להשתמש בפונקציה CameraUpdateFactory.newLatLngBounds(LatLngBounds bounds, int padding) כדי לקבל אובייקט CameraUpdate שמשנה את המצלמה כך ש-LatLngBounds הנתון יתאים לגמרי במפה, לוקח צריך להביא בחשבון את המרווח הפנימי (בפיקסלים) שצוין. הערך שהוחזר: CameraUpdate מבטיח שהפער (בפיקסלים) בין הגבולות הנתונים לקצה המפה תהיה בגודל של המרווח הפנימי שצוין לפחות. שימו לב שההטיה כיוון התצוגה של המפה יהיה 0.

Kotlin



val australiaBounds = LatLngBounds(
    LatLng((-44.0), 113.0),  // SW bounds
    LatLng((-10.0), 154.0) // NE bounds
)
map.moveCamera(CameraUpdateFactory.newLatLngBounds(australiaBounds, 0))

Java


LatLngBounds australiaBounds = new LatLngBounds(
    new LatLng(-44, 113), // SW bounds
    new LatLng(-10, 154)  // NE bounds
);
map.moveCamera(CameraUpdateFactory.newLatLngBounds(australiaBounds, 0));

מרכוז המפה בתוך אזור

במקרים מסוימים, כדאי למרכז את המצלמה בתוך גבולות במקום כולל הגבולות הקיצוניים. לדוגמה, כדי למקם את המצלמה במרכזה של מדינה מסוימת תוך שמירה על זום קבוע. במקרה כזה, אפשר להשתמש בשיטה דומה, באמצעות יצירה של LatLngBounds CameraUpdateFactory.newLatLngZoom(LatLng latLng, float zoom) עם LatLngBounds.אמצעי תשלום אחד (getCenter()). השיטה getCenter() תחזיר את הערך המרכז הגיאוגרפי של LatLngBounds.

Kotlin



val australiaBounds = LatLngBounds(
    LatLng((-44.0), 113.0),  // SW bounds
    LatLng((-10.0), 154.0) // NE bounds
)
map.moveCamera(CameraUpdateFactory.newLatLngZoom(australiaBounds.center, 10f))

Java


LatLngBounds australiaBounds = new LatLngBounds(
    new LatLng(-44, 113), // SW bounds
    new LatLng(-10, 154)  // NE bounds
);
map.moveCamera(CameraUpdateFactory.newLatLngZoom(australiaBounds.getCenter(), 10));

עומס יתר של השיטה, newLatLngBounds(boundary, width, height, padding) מאפשרת לציין רוחב וגובה בפיקסלים עבור מתוך כוונה שהם תואמים למידות של מפה המלבן ממוקם כך שהמרכז שלו זהה לזה של תצוגת המפה (כך שאם המאפיינים שצוינו זהים לאלה של בתצוגת המפה, ואז המלבן חופף לתצוגת המפה). הפקודה CameraUpdate תזיז את המצלמה כך LatLngBounds במרכז המסך בתוך המלבן הנתון מרחק התצוגה הגבוה ביותר האפשרי, תוך התייחסות למרווח הפנימי הנדרש.

הערה: מומלץ להשתמש רק בשיטה הפשוטה יותר. newLatLngBounds(boundary, padding) כדי ליצור CameraUpdate אם הוא ישמש להעברה המצלמה אחרי שהמפה עברה פריסה. במהלך הפריסה, ה-API מחשב את גבולות התצוגה של המפה לפי הצורך להקרין את התיבה התוחמת. לשם השוואה, אפשר להשתמש CameraUpdate הוחזרו בשיטה המורכבת יותר newLatLngBounds(boundary, width, height, padding) בכל עת, עוד לפני שהמפה עברה פריסה, מפני שה-API מחשבת את גבולות התצוגה מהארגומנטים שאתם מעבירים.

הגבלת התנועה האופקית של המשתמש לאזור נתון

בתרחישים שלמעלה, אתם מגדירים את גבולות המפה אבל המשתמש ואז לגלול או להזיז את המפה מחוץ לגבולות האלה. במקום זאת, להגביל את גבולות מרכז הרוחב/האורך של נקודת המוקד במפה (המצלמה ), כך שהמשתמשים יוכלו לגלול ולהזיז רק את הגבולות האלה. לדוגמה, יישום קמעונאי עבור מרכז קניות או שדה תעופה עשוי להגביל את המפה גבולות מסוימים, כך שהמשתמשים יוכלו לגלול ולנוע בתוך הגבולות האלה.

Kotlin



// Create a LatLngBounds that includes the city of Adelaide in Australia.
val adelaideBounds = LatLngBounds(
    LatLng(-35.0, 138.58),  // SW bounds
    LatLng(-34.9, 138.61) // NE bounds
)

// Constrain the camera target to the Adelaide bounds.
map.setLatLngBoundsForCameraTarget(adelaideBounds)

Java


// Create a LatLngBounds that includes the city of Adelaide in Australia.
LatLngBounds adelaideBounds = new LatLngBounds(
    new LatLng(-35.0, 138.58), // SW bounds
    new LatLng(-34.9, 138.61)  // NE bounds
);

// Constrain the camera target to the Adelaide bounds.
map.setLatLngBoundsForCameraTarget(adelaideBounds);

בתרשים הבא מתואר תרחיש שבו יעד המצלמה מוגבל לאזור שהוא מעט גדול יותר מאזור התצוגה. המשתמש יכול גוללים ומזיזים, בתנאי שיעד המצלמה נשאר בתוך האזור התחום. הצלב מייצג את יעד המצלמה:

תרשים שמראה LatLngBounds של מצלמה גדול מ- אזור התצוגה.

המפה תמיד ממלאת את אזור התצוגה, גם אם התוצאה היא באזור התצוגה אזורים שנמצאים מחוץ לגבולות המוגדרים. לדוגמה, אם תמקם את יעד המצלמה בפינה של האזור התחום, האזור שמעבר לפינה גלויים באזור התצוגה, אבל המשתמשים לא יכולים לגלול עוד לתוך האזור. התרשים הבא ממחיש את התרחיש הזה. הצלב מייצג את המצלמה target:

תרשים שמראה את יעד המצלמה ממוקם בפינה הימנית התחתונה של המצלמה LatLngBounds.

בתרשים הבא, ליעד המצלמה יש גבולות מוגבלים מאוד, ומציעים למשתמש מעט מאוד הזדמנויות לגלול או להזיז את המפה. הצלב מייצג את יעד המצלמה:

תרשים שמראה LatLngBounds של מצלמה קטן מ- אזור התצוגה.

התצוגה של המצלמה מתעדכנת

כדי להחיל CameraUpdate על המפה, אפשר להזיז מצלמה באופן מיידי או הוספת אנימציה למצלמה בצורה חלקה. כדי להזיז את המצלמה באופן מיידי בעזרת CameraUpdate, אפשר להתקשר GoogleMap.moveCamera(CameraUpdate).

ניתן להפוך את חוויית המשתמש לנעימה יותר, במיוחד בתנועות קצרות. על ידי אנימציית השינוי. כדי לעשות זאת במקום להתקשר GoogleMap.moveCamera לשלוח קריאה GoogleMap.animateCamera. המפה תעבור בצורה חלקה למאפיינים החדשים. בצורה המפורטת ביותר של השיטה הזו, GoogleMap.animateCamera(cameraUpdate, duration, callback), כוללת שלושה ארגומנטים:

cameraUpdate
הCameraUpdate שמתאר לאן להזיז את המצלמה.
callback
אובייקט שמטמיע GoogleMap.CancellableCallback. הממשק הכללי הזה לטיפול במשימות מגדיר שתי שיטות 'onCancel() ' ו-'onFinished() '. באנימציה, השיטות נקראות בנסיבות הבאות:
onFinish()
מופעלת אם האנימציה תושלם ללא הפרעה.
onCancel()

מופעל אם האנימציה מופסקת על ידי התקשרות stopAnimation() או התחלת תנועת מצלמה חדשה.

מצב כזה יכול לקרות גם GoogleMap.stopAnimation().

duration
משך הזמן הרצוי של האנימציה, באלפיות שנייה, כint.

קטעי הקוד הבאים ממחישים כמה מהדרכים הנפוצות להעברת מצלמה.

Kotlin



val sydney = LatLng(-33.88, 151.21)
val mountainView = LatLng(37.4, -122.1)

// Move the camera instantly to Sydney with a zoom of 15.
map.moveCamera(CameraUpdateFactory.newLatLngZoom(sydney, 15f))

// Zoom in, animating the camera.
map.animateCamera(CameraUpdateFactory.zoomIn())

// Zoom out to zoom level 10, animating with a duration of 2 seconds.
map.animateCamera(CameraUpdateFactory.zoomTo(10f), 2000, null)

// Construct a CameraPosition focusing on Mountain View and animate the camera to that position.
val cameraPosition = CameraPosition.Builder()
    .target(mountainView) // Sets the center of the map to Mountain View
    .zoom(17f)            // Sets the zoom
    .bearing(90f)         // Sets the orientation of the camera to east
    .tilt(30f)            // Sets the tilt of the camera to 30 degrees
    .build()              // Creates a CameraPosition from the builder
map.animateCamera(CameraUpdateFactory.newCameraPosition(cameraPosition))

Java


LatLng sydney = new LatLng(-33.88,151.21);
LatLng mountainView = new LatLng(37.4, -122.1);

// Move the camera instantly to Sydney with a zoom of 15.
map.moveCamera(CameraUpdateFactory.newLatLngZoom(sydney, 15));

// Zoom in, animating the camera.
map.animateCamera(CameraUpdateFactory.zoomIn());

// Zoom out to zoom level 10, animating with a duration of 2 seconds.
map.animateCamera(CameraUpdateFactory.zoomTo(10), 2000, null);

// Construct a CameraPosition focusing on Mountain View and animate the camera to that position.
CameraPosition cameraPosition = new CameraPosition.Builder()
    .target(mountainView )      // Sets the center of the map to Mountain View
    .zoom(17)                   // Sets the zoom
    .bearing(90)                // Sets the orientation of the camera to east
    .tilt(30)                   // Sets the tilt of the camera to 30 degrees
    .build();                   // Creates a CameraPosition from the builder
map.animateCamera(CameraUpdateFactory.newCameraPosition(cameraPosition));