בדף הזה מפורט מידע על תכונות מרכזיות במפות תלת-ממדיות ריאליסטיות ב-JavaScript של מפות Google, שמאפשרות ליצור חוויות תלת-ממדיות אינטראקטיביות וסוחפות. במסמכי העזרה הבאים מוסבר על:
- טיפול באירועים של ממשק המשתמש לצורך אינטראקציה חלקה.
- כולל פקדי הניווט במרחבים תלת-ממדיים.
- שימוש בנתיבי מצלמה מוגדרים מראש לסיורים מודרכים.
- החלת הגבלות על המצלמה כדי לשמור על המיקוד באזור מסוים.
אירועים בממשק המשתמש
בקטע הזה מפורטים האירועים האינטראקטיביים וההתראות על שינויים במצב שאפשר להאזין להם ולטפל בהם באופן פרוגרמטי כשעובדים עם מפות תלת-ממד. JavaScript בדפדפן מבוססת-אירועים, כלומר היא מגיבה לאינטראקציות של משתמשים על ידי יצירת אירועים שהתוכנית יכולה להאזין להם ולבצע קוד בהתאם.
יש שני סוגים עיקריים של אירועים:
- אירועי אינטראקציה של משתמשים (כמו קליקים בעכבר) מועברים מחלון התצוגה של המפה התלת-ממדית לקוד שלכם. האירועים האלה מאפשרים לכם להגיב לפעולות ישירות של משתמשים בסביבת המפה התלת-ממדית. לצפייה בדוגמה
- התראות על שינויים בסטטוס משקפות עדכונים במודלים הבסיסיים של נתוני המפה התלת-ממדית ובסטטוס העיבוד, באמצעות סכימה רגילה למתן שמות של
property_changed
.
כל אובייקט של 3D mapping API חושף קבוצה של אירועים עם שמות, שהתוכנית יכולה לרשום למעקב אחרי אירועים ולבצע לוגיקה כשהאירועים האלה מתרחשים באמצעות הפונקציה המובנית addEventListener()
. בדוגמה הבאה מפורטים אירועים נפוצים שמתרחשים כשמשתמש מבצע פעולות במפה תלת-ממדית.
בדוגמה הבאה מוצגים האירועים שמתרחשים כשמשתמש מבצע אינטראקציה עם המפה:
אמצעי הבקרה של כלי הניתוחים
המפות שמוצגות במפות התלת-ממדיות הריאליסטיות ב-Maps JavaScript API מכילות רכיבי ממשק משתמש שתומכים באינטראקציה של המשתמשים עם המפה. הרכיבים האלה נקראים אמצעי בקרה על משתמשים. אמצעי הבקרה של הניתוחים כלולים כברירת מחדל, אבל אתם יכולים להסתיר אותם באפליקציה.
בתמונה הבאה מוצגים אמצעי הבקרה שמוגדרים כברירת מחדל במפות התלת-ממד הריאליסטיות ב-JavaScript של מפות Google:
בהמשך מופיעה רשימה של כל אמצעי הבקרה במפות התלת-ממדיות הריאליסטיות ב-JavaScript של מפות Google:
- בפקד הזום מוצגים הלחצנים '+' ו-'-', שמאפשרים לשנות את רמת הזום של המפה.
- אמצעי הבקרה להטיה מאפשרים לשנות את ההטיה של המצלמה.
- פקד הסיבוב מאפשר לשנות את כיוון המצלמה.
- בפקד ההזזה מוצגים הלחצנים ←, →, ↑ ו-↓, שבעזרתם אפשר לשנות את מרכז המפה.
אמצעי בקרה ואנימציה למצלמה
מסלולים מוגדרים מראש במצלמה
במפות Google ב-JavaScript יש שתי דרכים מוגדרות מראש למיקום המצלמה במפות תלת-ממד ריאליסטיות. אפשר להתאים אישית את נתיבי המצלמה על ידי שינוי משך ההנפשה (כך מגדילים או מקטינים את המהירות) או על ידי שילוב שלהם כדי ליצור חוויות צפייה קולנועיות יותר.
מפות תלת-ממד ריאליסטיות ב-JavaScript של מפות Google תומכות בנתיבי המצלמה הבאים:
- אנימציה של
FlyCameraTo
שתמריא ממרכז המפה ליעד מסוים. - אנימציה מסוג
FlyCameraAround
מסתובבת סביב נקודה במפה כמה פעמים שציינתם.
אפשר לשלב בין שני המסלולים הזמינים כדי לטוס לנקודת עניין, להסתובב סביבה ואז לעצור כשרוצים.
הגבלות על מצלמה
יכול להיות שתרצו לשלוט בתנועת המצלמה, בגובה המקסימלי שלה או ליצור גבולות קו הרוחב/קו האורך שיגבילו את תנועת המשתמש במפה נתונה. אפשר לעשות זאת באמצעות הגבלות על המצלמה.
בדמו תוכלו לראות דוגמה לאופן שבו ההגבלות על המצלמה פועלות ומוטמעות.