כלי ליצירת תרשימי עמודות. פרטים נוספים זמינים במסמכי העזרה של Google Charts.
דוגמה ליצירת תרשים עמודות. הנתונים מיובאים מגיליון אלקטרוני של Google.
// Get sample data from a spreadsheet. const dataSourceUrl = 'https://docs.google.com/spreadsheet/tq?range=B1%3AC11' + '&key=0Aq4s9w_HxMs7dHpfX05JdmVSb1FpT21sbXd4NVE3UEE&gid=0&headers=-1'; const chartBuilder = Charts.newBarChart() .setTitle('Top Grossing Films in US and Canada') .setXAxisTitle('USD') .setYAxisTitle('Film') .setDimensions(600, 500) .setLegendPosition(Charts.Position.BOTTOM) .setDataSourceUrl(dataSourceUrl); const chart = chartBuilder.build();
Methods
שיטה | סוג הערך המוחזר | תיאור קצר |
---|---|---|
build() | Chart | יצירת התרשים. |
reverse | Bar | היפוך כיוון הציור של הסדרות בציר הדומיין. |
reverse | Bar | הכיוון שבו העמודות גדלות לאורך הציר האופקי מתהפך. |
set | Bar | הגדרת צבע הרקע של התרשים. |
set | Bar | הגדרת הצבעים של השורות בתרשים. |
set | Bar | הגדרת כתובת ה-URL של מקור הנתונים שמשמש לשליפת נתונים ממקור חיצוני, כמו Google Sheets. |
set | Bar | הגדרת טבלת הנתונים לשימוש בתרשים באמצעות DataTableBuilder. |
set | Bar | הגדרת טבלת הנתונים שמכילה את הקווים של התרשים, וגם את התוויות של ציר ה-X. |
set | Bar | הגדרת ההגדרה של תצוגת הנתונים שישמשו את התרשים. |
set | Bar | הגדרת המאפיינים של התרשים. |
set | Bar | הגדרת המיקום של המקרא ביחס לתרשים. |
set | Bar | הגדרת סגנון הטקסט של המיתוג של התרשים. |
set | Bar | הגדרת אפשרויות מתקדמות לתרשים הזה. |
set | Bar | הגדרת הטווח של התרשים. |
set | Bar | נעשה שימוש בקווים מוערמים, כלומר ערכי הקווים והעמודות מוערמים (מקובצים). |
set | Bar | הגדרת כותרת התרשים. |
set | Bar | הגדרת סגנון הטקסט של שם התרשים. |
set | Bar | הגדרת סגנון הטקסט של הציר האופקי. |
set | Bar | הוספת כותרת לציר האופקי. |
set | Bar | הגדרת סגנון הטקסט של הכותרת של הציר האופקי. |
set | Bar | הגדרת סגנון הטקסט של הציר האנכי. |
set | Bar | הוספת כותרת לציר האנכי. |
set | Bar | הגדרת סגנון הטקסט של הכותרת של הציר האנכי. |
use | Bar | הופכת את ציר הטווח לסולם לוגריתמי (כל הערכים צריכים להיות חיוביים). |
מסמכים מפורטים
build()
יצירת התרשים.
חזרה
Chart
— אובייקט של תרשים, שאפשר להטמיע במסמכים, ברכיבי ממשק משתמש או להשתמש בו כתמונה סטטית.
reverse Categories()
היפוך כיוון הציור של הסדרות בציר הדומיין. בתרשימים עם טווח אנכי (כמו תרשימי קו, תרשימי שטח או תרשימי עמודות), המשמעות היא שהציר האנכי מצויר מימין לשמאל. בתרשימים עם טווח אופקי (כמו תרשימי עמודות), המשמעות היא שהציר האנכי מצויר מלמעלה למטה. בתרשים עוגה, המשמעות היא שהפלחים מצוירים נגד כיוון השעון.
// Creates a pie chart builder and sets drawing of the slices in a // counter-clockwise manner. const builder = Charts.newPieChart(); builder.reverseCategories();
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
reverse Direction()
הכיוון שבו העמודות גדלות לאורך הציר האופקי מתהפך. כברירת מחדל, הערכים גדלים משמאל לימין. קריאה ל-method הזה גורמת להן לגדול מימין לשמאל.
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set Background Color(cssValue)
הגדרת צבע הרקע של התרשים.
// Creates a line chart builder and sets the background color to gray const builder = Charts.newLineChart(); builder.setBackgroundColor('gray');
פרמטרים
שם | סוג | תיאור |
---|---|---|
css | String | ערך ה-CSS של הצבע (למשל "blue" או "#00f" ). |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set Colors(cssValues)
הגדרת הצבעים של השורות בתרשים.
// Creates a line chart builder and sets the first two lines to be drawn in // green and red, respectively. const builder = Charts.newLineChart(); builder.setColors(['green', 'red']);
פרמטרים
שם | סוג | תיאור |
---|---|---|
css | String[] | מערך של ערכי CSS של צבעים, כמו ["red", "#acf"] . האלמנט ה-n במערך מייצג את הצבע של הקו ה-n בתרשים. |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set Data Source Url(url)
הגדרת כתובת ה-URL של מקור הנתונים שמשמש לשליפת נתונים ממקור חיצוני, כמו Google Sheets. אם מציינים כתובת URL של מקור נתונים ו-DataTable, המערכת מתעלמת מכתובת ה-URL של מקור הנתונים.
מידע נוסף על שליחת שאילתות למקורות נתונים זמין במסמכי התיעוד של Google Charts.
פרמטרים
שם | סוג | תיאור |
---|---|---|
url | String | כתובת ה-URL של מקור הנתונים, כולל פרמטרים של שאילתה. |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set Data Table(tableBuilder)
הגדרת טבלת הנתונים לשימוש בתרשים באמצעות DataTableBuilder. זוהי שיטה נוחה להגדרת טבלת הנתונים בלי צורך לקרוא ל-build()
.
פרמטרים
שם | סוג | תיאור |
---|---|---|
table | Data | כלי ליצירת טבלאות נתונים. כחלק מהקריאה הזו, נוצרת טבלת נתונים חדשה באופן מיידי, כך שעדכונים נוספים ב-builder לא ישתקפו בתרשים. |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set Data Table(table)
הגדרת טבלת הנתונים שמכילה את הקווים של התרשים, וגם את התוויות של ציר ה-X. העמודה הראשונה צריכה להיות מחרוזת, ולהכיל את התוויות של הציר האנכי. אחרי העמודה הזו אפשר להוסיף כל מספר עמודות שרוצים, והן כולן חייבות לכלול מספרים. כל עמודה מוצגת בשורה נפרדת.
פרמטרים
שם | סוג | תיאור |
---|---|---|
table | Data | טבלת הנתונים שתשמש לתרשים. |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set Data View Definition(dataViewDefinition)
הגדרת ההגדרה של תצוגת הנתונים שישמשו את התרשים.
פרמטרים
שם | סוג | תיאור |
---|---|---|
data | Data | אובייקט של הגדרת תצוגת נתונים שמגדיר את התצוגה שצריך להפיק ממקור הנתונים הנתון לצורך ציור התרשים. |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set Dimensions(width, height)
הגדרת המאפיינים של התרשים.
פרמטרים
שם | סוג | תיאור |
---|---|---|
width | Integer | רוחב התרשים, בפיקסלים. |
height | Integer | הגובה של התרשים, בפיקסלים. |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set Legend Position(position)
הגדרת המיקום של המקרא ביחס לתרשים. כברירת מחדל, אין שם תרשים.
// Creates a line chart builder and sets the legend position to right. const builder = Charts.newLineChart(); builder.setLegendPosition(Charts.Position.RIGHT);
פרמטרים
שם | סוג | תיאור |
---|---|---|
position | Position | המיקום של המקרא. |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set Legend Text Style(textStyle)
הגדרת סגנון הטקסט של המיתוג של התרשים.
// Creates a line chart builder and sets it up for a blue, 26-point legend. const textStyleBuilder = Charts.newTextStyle().setColor('#0000FF').setFontSize(26); const style = textStyleBuilder.build(); const builder = Charts.newLineChart(); builder.setLegendTextStyle(style);
פרמטרים
שם | סוג | תיאור |
---|---|---|
text | Text | סגנון הטקסט שישמש את כותרת התרשים. |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set Option(option, value)
הגדרת אפשרויות מתקדמות לתרשים הזה. האפשרויות הזמינות לתרשים הזה אם האפשרות שצוינה לא חוקית, אין להשפעה על השיטה הזו.
// Build a bar chart with a 1-second animation duration. const builder = Charts.newBarChart(); builder.setOption('animation.duration', 1000); const chart = builder.build();
פרמטרים
שם | סוג | תיאור |
---|---|---|
option | String | האפשרות להגדרה. |
value | Object | הערך להגדרה. |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set Range(start, end)
הגדרת הטווח של התרשים.
אם נקודות נתונים מסוימות יוצאות מהטווח, הטווח יתרחב כך שיכלול את נקודות הנתונים האלה.
פרמטרים
שם | סוג | תיאור |
---|---|---|
start | Number | הערך של קו התא של הציר 'טווח' הנמוך ביותר. |
end | Number | הערך של קו התאמה הכי גבוה בציר הטווח. |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set Stacked()
נעשה שימוש בקווים מוערמים, כלומר ערכי הקווים והעמודות מוערמים (מקובצים). כברירת מחדל, אין צבירה.
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set Title(chartTitle)
הגדרת כותרת התרשים. הכותרת מוצגת במרכז מעל התרשים.
// Creates a line chart builder and title to 'My Line Chart'. const builder = Charts.newLineChart(); builder.setTitle('My Line Chart');
פרמטרים
שם | סוג | תיאור |
---|---|---|
chart | String | כותרת התרשים. |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set Title Text Style(textStyle)
הגדרת סגנון הטקסט של שם התרשים.
// Creates a line chart builder and sets it up for a blue, 26-point title. const textStyleBuilder = Charts.newTextStyle().setColor('#0000FF').setFontSize(26); const style = textStyleBuilder.build(); const builder = Charts.newLineChart(); builder.setTitleTextStyle(style);
פרמטרים
שם | סוג | תיאור |
---|---|---|
text | Text | סגנון הטקסט לשימוש בכותרת התרשים. אפשר ליצור אובייקט Text באמצעות קריאה ל-Charts.newTextStyle() . |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set XAxis Text Style(textStyle)
הגדרת סגנון הטקסט של הציר האופקי.
// Creates a line chart builder and sets the X-axis text style to blue, 18-point // font. const textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build(); const builder = Charts.newLineChart(); builder.setXAxisTextStyle(textStyle);
פרמטרים
שם | סוג | תיאור |
---|---|---|
text | Text | סגנון הטקסט שישמש לכותרת של הציר האופקי. אפשר ליצור אובייקט Text באמצעות קריאה ל-Charts.newTextStyle() . |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set XAxis Title(title)
הוספת כותרת לציר האופקי. הכותרת ממוקמת במרכז ומופיעה מתחת לתוויות של ערכי הצירים.
// Creates a line chart builder and sets the X-axis title. const builder = Charts.newLineChart(); builder.setTitle('X-axis Title');
פרמטרים
שם | סוג | תיאור |
---|---|---|
title | String | הכותרת של ציר ה-X. |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set XAxis Title Text Style(textStyle)
הגדרת סגנון הטקסט של הכותרת של הציר האופקי.
// Creates a line chart builder and sets the X-axis title text style to blue, // 18-point font. const textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build(); const builder = Charts.newLineChart(); builder.setXAxisTitleTextStyle(textStyle);
פרמטרים
שם | סוג | תיאור |
---|---|---|
text | Text | סגנון הטקסט שישמש לכותרת של הציר האופקי. אפשר ליצור אובייקט Text באמצעות קריאה ל-Charts.newTextStyle() . |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set YAxis Text Style(textStyle)
הגדרת סגנון הטקסט של הציר האנכי.
// Creates a line chart builder and sets the Y-axis text style to blue, 18-point // font. const textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build(); const builder = Charts.newLineChart(); builder.setYAxisTextStyle(textStyle);
פרמטרים
שם | סוג | תיאור |
---|---|---|
text | Text | סגנון הטקסט שישמש לכותרת של הציר האופקי. אפשר ליצור אובייקט Text באמצעות קריאה ל-Charts.newTextStyle() . |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set YAxis Title(title)
הוספת כותרת לציר האנכי. הכותרת ממוקמת במרכז ומופיעה מימין לתוויות הערכים.
// Creates a line chart builder and sets the Y-axis title. const builder = Charts.newLineChart(); builder.setYAxisTitle('Y-axis Title');
פרמטרים
שם | סוג | תיאור |
---|---|---|
title | String | הכותרת של ציר ה-Y. |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
set YAxis Title Text Style(textStyle)
הגדרת סגנון הטקסט של הכותרת של הציר האנכי.
// Creates a line chart builder and sets the Y-axis title text style to blue, // 18-point font. const textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build(); const builder = Charts.newLineChart(); builder.setYAxisTitleTextStyle(textStyle);
פרמטרים
שם | סוג | תיאור |
---|---|---|
text | Text | סגנון הטקסט שישמש לכותרת של הציר האופקי. אפשר ליצור אובייקט Text באמצעות קריאה ל-Charts.newTextStyle() . |
חזרה
Bar
— ה-builder הזה שימושי לשרשור.
use Log Scale()
הופכת את ציר הטווח לסולם לוגריתמי (כל הערכים צריכים להיות חיוביים). ציר הטווח הוא הציר האנכי בתרשימים אנכיים (כמו תרשים קו, תרשים שטח או תרשים עמודות) והציר האופקית בתרשימים אופקיים (כמו תרשים עמודות).
חזרה
Bar
— ה-builder הזה שימושי לשרשור.