סוג הרינדור (רסטרים ווקטוריים)

‫Maps JavaScript API מציע שני יישומים שונים של המפה: רסטר ו-vector. מפת הרסטר נטענת כברירת מחדל, והיא נטענת כמטריצה של משבצות תמונות רסטר מבוססות-פיקסלים, שנוצרות בצד השרת של הפלטפורמה של מפות Google, ואז מוגשות לאפליקציית האינטרנט. מפת הווקטור מורכבת ממשבצות מבוססות-ווקטור, שמצוירות בזמן הטעינה בצד הלקוח באמצעות WebGL, טכנולוגיית אינטרנט שמאפשרת לדפדפן לגשת ל-GPU במכשיר של המשתמש כדי לעבד גרפיקה דו-ממדית ותלת-ממדית. מומלץ להשתמש במפה וקטורית כדי לספק את חוויית המשתמש הטובה ביותר, כי היא מספקת נאמנות חזותית משופרת וגם מאפשרת לשלוט בהטיה ובכיוון במפה. מידע נוסף על התכונות של מפות וקטוריות

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

ציון האפשרות renderingType

אפשר להשתמש באפשרות renderingType כדי לציין את סוג העיבוד של המפה (רסטר או וקטור) (לא נדרש מזהה מפה). במפות שנטענות באמצעות רכיב div ו-JavaScript, סוג העיבוד שמוגדר כברירת מחדל הוא google.maps.RenderingType.RASTER. כדי להגדיר את האפשרות renderingType פועלים לפי השלבים הבאים:

  1. טוענים את ספריית RenderingType. אפשר לעשות זאת כשמטעינים את ספריית Maps:

    const { Map, RenderingType } = await google.maps.importLibrary("maps");

  2. כשמאתחלים את המפה, משתמשים באפשרות renderingType כדי לציין את RenderingType.VECTOR או את RenderingType.RASTER:

    map = new Map(
  document.getElementById('map'),
  {
    zoom: 4,
    center: position,
    renderingType: RenderingType.VECTOR,
  }
);

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

  • כדי להפעיל את ההטיה, מגדירים את אפשרות המפה tiltInteractionEnabled ל-true או מתקשרים אל map.setTiltInteractionEnabled(true).
  • כדי להפעיל את ההזזה, מגדירים את אפשרות המפה headingInteractionEnabled ל-true או מתקשרים אל map.setHeadingInteractionEnabled(true).

במפות שנטענות באמצעות רכיב <gmp-map>, סוג העיבוד שמוגדר כברירת מחדל הוא google.maps.RenderingType.VECTOR, עם אפשרות להטיה ושליטה בכיוון. כדי להגדיר את סוג העיבוד באמצעות הרכיב <gmp-map>, צריך להשתמש במאפיין rendering-type.

שימוש במזהה מפה כדי להגדיר את סוג העיבוד

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

יצירת מזהה של מפת וקטור

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

map = new google.maps.Map(document.getElementById('map'), {
  center: {lat: -34.397, lng: 150.644},
  zoom: 8,
  mapId: 'MAP_ID'
});