ווידג'ט החיפוש של Knowledge Graph הוא מודול JavaScript שעוזר להוסיף נושאים לתיבות קלט באתר שלכם. המשתמשים מתחילים להקליד טקסט, והווידג'ט מוצא התאמות רלוונטיות תוך כדי הקלדה, באמצעות ממשק ה-API לחיפוש של Knowledge Graph.
תכונות
- דפדפן חוצה - הוא כתוב בסגירת דפדפן שנבדקה היטב ועבר הידור ל-JavaScript טהור.
- מספר דומיינים. הודות ל-JSONP, לא נדרשים שרתי proxy.
- מתארח בשרתי Google.
- חינם! (בכפוף לתנאים הרגילים של Google API.)
למה כדאי להשתמש בווידג'ט החיפוש של Knowledge Graph?
- המשתמשים יכולים להקליד פחות כדי להזין יותר נתונים.
- הזנת נתונים קלה ומדויקת יותר.
- הפחתת העומס הקוגניטיבי על המשתמשים על ידי הוספת תמונות ותיאורים.
- צריך להימנע מכפילויות של שמות עבור אותה יישות: Puff Daddy, P. דידי, שון קומבס מתייחס ל
/en/sean_combs
.
הוספת ווידג'ט החיפוש של Knowledge Graph לאתר
כדי להוסיף את ווידג'ט החיפוש של Knowledge Graph לדף, צריך לכלול את הקוד הבא במקור האתר. תצטרכו להשתמש במפתח API כדי שהווידג'ט יוכל לגשת לממשק ה-API של Google Knowledge Graph.
קוד להכללה באתר
יש לכלול את הפרטים הבאים ב-<head>
של מסמך ה-HTML:
<link type="text/css" rel="stylesheet" href="https://www.gstatic.com/knowledge/kgsearch/widget/1.0/widget.min.css">
<style>
.kge-search-picker {
width: <DROPDOWN_MENU_WIDTH>;
}
</style>
<script type="text/javascript" src="https://www.gstatic.com/knowledge/kgsearch/widget/1.0/widget.min.js"></script>
לאחר מכן, במסמך <body>
, השתמשו בשדה קלט עם מזהה תואם, באופן הבא:
<input type="text" id="myInput">
<script type="text/javascript">
KGSearchWidget(<API_KEY>, document.getElementById("myInput"), {});
</script>
קבלת מפתח API ושימוש בו
קבלת מפתח API מאפשרת לאפליקציה לשלוח בקשות ל-Google Suggest. הווידג'ט לא יפעל בלי מפתח API. אם עדיין אין לכם מפתח API, תוכלו לרכוש מפתח כזה לפי ההוראות המפורטות בדף Prequis (דרישות המוקדמות).
אחרי שמקבלים מפתח, מעבירים אותו לווידג'ט החיפוש של Knowledge Graph באמצעות קוד כמו בדוגמה הבאה:
KGSearchWidget(<API_KEY>, document.getElementById("myInput"), {});
הגדרת ווידג'ט החיפוש
JavaScript יכול לקרוא ל-KGSearchWidget()
עם ארגומנט שלישי ריק,
כפי שמוצג למעלה. לחלופין, תוכלו להשתמש בארגומנט השלישי כדי להעביר באובייקט הגדרה, ולציין מסננים שונים, אילוצים וגורמים מטפלים באירועים.
העברת אובייקט config
ווידג'ט החיפוש של Knowledge Graph מקבל פרמטר אופציונלי של הגדרה. כך תוכלו לאכלס מבנה נתונים במספר אפשרויות הגדרה, ולהעביר אותו לווידג'ט כפי שמוצג בדוגמה הבאה.
var config = {
'limit': 10,
'languages': ['en', 'fr'],
'types': ['Person', 'Movie'],
'maxDescChars': 100,
};
config['selectHandler'] = function(e) {
alert(e.row.name + ' selected');
};
config['highlightHandler'] = function(e) {
alert(e.row.name + ' highlighted');
};
KGSearchWidget(<API_KEY>, document.getElementById('myInput'), config);
אפשרויות הגדרה
בטבלה הבאה מתוארות אפשרויות ההגדרה שאפשר להעביר לווידג'ט החיפוש של Knowledge Graph.
שם | תיאור | ברירת המחדל | התיאור |
---|---|---|---|
שפות | מערך(מחרוזת) | אנגלית |
רשימה של קודי שפות (מוגדרים בתקן ISO 639-1) שגורמים לביצוע החיפוש בכל השפות
שצוינו. התוצאות מדורגות בשפה הראשונה שמופיעה
ומוצגת בשפה הראשונה ברשימה שיש לה שם
לישות. הכיסוי הביטוחי ביותר הוא באנגלית. הערך הזה מועבר
בשקיפות אל Search API. לדוגמה, אם השפה מוגדרת לערך [fr, en] |
הגבלה | מספר שלם | 20 | מספר התוצאות המקסימלי בתפריט הנפתח. |
סוגים | מערך(מחרוזת) | כל הסוגים | הפונקציה מחזירה רק ישויות שתואמות לאחד מסוגי הישויות שצוינו. אם הפרמטר הזה לא נכלל, הפונקציה מחזירה התאמות מכל סוג של ישות. |
maxDescChars | מספר שלם | ללא הגבלה | מספר התווים המקסימלי בתיאור מפורט של כל ישות. תוכן שאורכו עולה על maxDescChars ייחתך. |
selectHandler | פעולה | null |
פונקציית הקריאה החוזרת לפונקציה כאשר נבחרת שורה. הארגומנט של פונקציית הקריאה החוזרת (callback) הוא אירוע, והוא כולל מאפיין row
שמכיל מידע על השורה שנבחרה. כדי לראות דוגמה לשימוש בקריאה החוזרת (callback), אפשר לעיין במאמר
שימוש בגורמים מטפלים באירועים.
|
highlightHandler | פעולה | null |
פונקציית הקריאה החוזרת שמופעלת כשהמשתמש מעביר את סמן העכבר מעל השורה.
הארגומנט של פונקציית הקריאה החוזרת הוא אירוע, והוא כולל
מאפיין row שמכיל מידע על השורה
שנבחרה.
חשוב לזכור שלא ניתן ליצור את האירוע הזה במכשירים רבים (כמו חומרה עם מסך מגע). אפשר לראות דוגמה לשימוש בקריאה החוזרת (callback) במאמר שימוש בגורמים מטפלים באירועים. |
הטמעה של גורמים מטפלים באירועים
ווידג'ט החיפוש של Knowledge Graph מפעיל את האירועים הבאים בהקשר של הקלט שאיתו הוא הופעל. אפשר לספק פונקציות קריאה חוזרת ב-config כדי להטמיע handlers לאירועים האלה.
selectHandler – האירוע הזה מופעל כשמשתמש בוחר פריט מהרשימה Suggest. לאירוע יש אובייקט נתונים שבו event.row
הוא הנתונים של השורה שנבחרה.
הערכים event.row.name
ו-event.row.id
מייצגים את השם והמזהה של הפריט שנבחר. בקטע הקוד הבא אפשר לראות איך בודקים מה selectHandler
עושה.
KGSearchWidget(<API_KEY>, document.getElementById("myInput"), {
"selectHandler": function(e) {
alert("selected " + e.row.name);
}
});
highlightHandler – האירוע הזה מופעל כשפריט מודגש על ידי המשתמש עם העכבר מעליו. קטע הקוד הבא מראה איך אפשר לבדוק מה highlightHandler
עושה.
KGSearchWidget(<API_KEY>, document.getElementById("myInput"), {
"highlightHandler": function(e) {
alert("highlighted " + e.row.name);
}
});
עזרה ומשוב
אם יש לכם שאלות, דוחות על באגים או משוב לגבי ה-Knowledge Graph Search API, השתמשו בפורום העזרה.