עיצוב של FeatureView

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

אובייקט סגנון

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

{
  // Broad style rules.
  opacity: ,
  polygonFillColor: ,

  // Specific style rules.
  rules: [
    {  },
    {  }
  ]
};

כללים רחבים

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

{
  opacity: 0.5,
  pointShape: 'triangle',
  lineWidth: 10,
  polygonFillColor: 'green'
};

כללים ספציפיים

כדי להחיל מאפייני סגנון על קבוצת משנה של תכונות, משתמשים בשדה rules. השדה rules מקבל רשימה של אובייקטים של JavaScript, לכל אחד מהם יש filter שבוחר תכונות בהתאם לתנאים שהוגדרו על ידי אובייקט ee.Filter, ואחריו סדרה של מאפייני סגנון. בדוגמה הבאה מופיע כלל שמגדיר את הערכים של polygonStrokeWidth ו-polygonFillColor רק אם הערך של המאפיין REP_AREA קטן מ-100. כללים ספציפיים מבטלים את מאפייני הסגנון של כללים רחבים, וכללים בסוף הרשימה rules מבטלים את אלה שבתחילת הרשימה (המערכת מעריכה כללים ספציפיים מהראשון עד האחרון).

{
  rules: [
    {
      filter: ee.Filter.lt('REP_AREA', 100),
      polygonStrokeWidth: 0.5,
      polygonFillColor: 'blue'
    },
    {  }  // Optionally include additional rules.
  ]
};

סגנון ההגדרה

אפשר להגדיר את סגנון התכונה כשמגדירים FeatureViewLayer או בכל שלב אחר כך.

הצהרה אחת (FeatureViewLayer)

כדי להגדיר את הפרמטרים של התצוגה החזותית כשמגדירים FeatureViewLayer, משתמשים בפרמטר visParams.

var visParams = {
  opacity: 0.5,
  lineWidth: 10,
  polygonFillColor: 'purple'
};

var layer = ui.Map.FeatureViewLayer({
  assetId: 'WCMC/WDPA/current/polygons_FeatureView',
  visParams: visParams
});

Map.add(layer);

נכסים קיימים מסוג FeatureViewLayer

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

var layer = ui.Map.FeatureViewLayer('WCMC/WDPA/current/polygons_FeatureView');
Map.add(layer);

layer.setVisParams({
  opacity: 0.5,
  lineWidth: 10,
  polygonFillColor: 'purple'
});

סמליות

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

קבוע

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

var visParams = {
  polygonFillColor: 'blue'
};

קטגוריאלי

כלל סגנון קטגורי מורכב ממאפיין סגנון להגדרה ומאובייקט JavaScript עם שלושה מאפיינים:

  • property – שם של מאפיין תכונה שהערך שלו ישפיע על הסגנון.
  • categories – רשימת רשימות שממפות ערכים של מאפייני תכונות לסימולוגיות של מאפייני סגנון. כל קטגוריה כוללת ערך של מאפיין ואחריו ערך של סמלוגיה להחלה. ערך המאפיין שמגדיר קטגוריה חייב להיות מחרוזת.
  • defaultValue – סמליות ברירת המחדל שחלה על תכונות שהערך של המאפיין שלהן לא מוגדר ב-categories. אם הערך הוא null/undefined, יוחלו הגדרות ברירת המחדל של הסגנון.

לדוגמה, באובייקט הבא מוגדר מאפיין הסגנון color על סמך מאפיין התכונה 'MARINE'. מאפיינים בקטגוריה 'MARINE' עם הערך '0' מוגדרים כסגולים, '1' כירוקים, '2' ככחולים וכל קטגוריה אחרת כלבנה.

var visParams = {
  color: {
    property: 'MARINE',
    categories: [
      ['0', 'purple'],
      ['1', 'green'],
      ['2', 'blue']
    ],
    defaultValue: 'white'
  }
};

אינטרפולציה

כלל סגנון שעבר אינטרפולציה מורכב ממאפיין סגנון להגדרה ומאובייקט JavaScript עם עד חמישה מאפיינים:

  • property – שם של מאפיין תכונה שהערך שלו ישפיע על הסגנון.
  • mode – מצב הבינוי, 'linear' או 'interval'.
  • palette – רשימה של צבעים, רמות שקיפיות או רוחבים שבין הערכים שלהם מתבצעת אינטרפולציה של ערכי מאפייני הקלט. הפורמט תלוי ב-mode. פרטים נוספים זמינים בקטעים לינארי ומרווח זמן.

התכונה חלה רק על מצב 'linear'

  • min – ערך המאפיין שרוצים למפות לרכיב הראשון ברשימה palette.
  • max — ערך המאפיין שרוצים למפות לרכיב האחרון ברשימה palette.

לינארי

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

לדוגמה, באובייקט הבא מוגדר מאפיין הסגנון color על סמך מאפיין התכונה 'REP_AREA'. המאפיין palette הוא רשימת צבעים שמציינת שערכי קלט בין min ל-max צריכים לקבל ציון ליניארי, מצהוב לאדום ולכחול. ערך בין 1 ל-500 מומר לערך בין צהוב לאדום, וערך בין 500 ל-1,000 מומר לערך בין אדום לכחול.

var visParams = {
  color: {
    property: 'REP_AREA',
    mode: 'linear',
    palette: ['yellow', 'red', 'blue'],
    min: 1,
    max: 1000
  }
};

מרווח

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

בדוגמה הבאה, השקיפות של מילוי המאפיינים מוגדרת בהתאם לקטגוריות הדרגתיות של המאפיין REP_AREA. הגדרת הכיתה וסמליות הסגנון מוצגות במאפיין palette כרשימה של רשימות. המשמעות היא שצריכים להיות 4 כיתות עם הפסקות בערך 0, ‏ 80, ‏ 2, 000 ו-5, 000, עם ערכי האטימות של המאפיינים בהתאמה של 0.5, ‏ 0.35, ‏ 0.22 ו-0.15. במילים אחרות, למאפיינים עם ערכי REP_AREA בטווח ‎ $ 0 \le x < 80 $ תהיה שקיפות מילוי של 0.5, לערכי REP_AREA בטווח ‎ $ 80 \le x < 2000 $ תהיה שקיפות מילוי של 0.35 וכן הלאה.

var visParams = {
  fillOpacity: {
    property: 'REP_AREA',
    mode: 'interval',
    palette: [
      [0, 0.5],
      [80, 0.35],
      [2000, 0.22],
      [5000, 0.15]
    ]
  }
};

כל מאפייני הסגנון

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

נכס סוג תיאור תמיכה בכלל משוער
כל הגיאומטריות
isVisible Boolean הגדרה שקובעת אם התכונה גלויה. לא
color String הגדרת צבע המילוי/הקו לכל סוגי הגיאומטריה. הערך חייב להיות ערך HEX או צבע CSS3. כן
opacity Double הגדרת האטימות של המילוי/הקו לכל סוגי הגיאומטריה. חייב להיות מספר מסוג double בין 0 ל-1. כן
width Double הגדרת רוחב הקו לכל סוגי הגיאומטריה. כן
fillColor String מגדיר את צבע המילוי לכל סוגי הגיאומטריה. הערך חייב להיות ערך HEX או צבע CSS3. כן
גיאומטריה של נקודות
pointShape String הגדרת הצורה של גיאומטריות של נקודות. יש תמיכה באותן צורות כמו ב-ee.FeatureCollection.style (עיגול, ריבוע, משולש, צלב, סימן פלוס, כוכב חמש-קודקודים, כוכב שש-קודקודים, משולש, triangle_up,‏ triangle_down, ‏ triangle_left, ‏ triangle_right, ‏ משולש חמישי, משושה, כוכב 5, כוכב 6). לא
pointSize Double הגדרת הרוחב של גיאומטריות של נקודות (ב-px). כן
pointFillColor String הגדרת צבע מילוי לגיאומטריות של נקודות. הערך חייב להיות ערך HEX או צבע CSS3. כן
pointFillOpacity Double הגדרת שקיפות המילוי של גיאומטריות של נקודות. חייב להיות מספר מסוג double בין 0 ל-1. כן
גיאומטריות של קו
lineType String הגדרת סוג הקו. תמיכה באותם סוגים כמו ee.FeatureCollection.style (קו ישר, קו מקווקו, קו מקווקו עם נקודות). לא
lineWidth Double הגדרת רוחב הקו (ב-px). כן
lineColor String הגדרת צבע לגיאומטריות של קווים. הערך חייב להיות ערך HEX או צבע CSS3. כן
lineOpacity Double הגדרת שקיפות לגיאומטריות של קווים. חייב להיות מספר מסוג double בין 0 ל-1. כן
גיאומטריות של פוליגונים
polygonStrokeWidth Double הגדרת רוחב הקו של הפוליגונים (ב-px). כן
polygonStrokeType String הגדרת סוג הקו של הפוליגונים. תמיכה באותם סוגים כמו ee.FeatureCollection.style (קו ישר, קו מקווקו, קו מקווקו עם נקודות). לא
polygonStrokeColor String הגדרת צבע הקו לגיאומטריות של פוליגונים. הערך חייב להיות ערך HEX או צבע CSS3. כן
polygonStrokeOpacity Double הגדרת האטימות של הקו הגיאומטרי לגיאומטריות של פוליגונים. חייב להיות ערך מסוג double בין 0 ל-1. כן
polygonFillColor String הגדרת צבע המילוי לגיאומטריות של פוליגונים. הערך חייב להיות ערך HEX או צבע CSS3. כן
polygonFillOpacity Double הגדרת שקיפות המילוי של גיאומטריות של פוליגונים. חייב להיות ערך מסוג double בין 0 ל-1. כן