Class BarChartBuilder

BarChartBuilder

Kreator wykresów słupkowych. Więcej szczegółów znajdziesz w dokumentacji Wykresów Google.

Oto przykład tworzenia wykresu słupkowego. Dane są importowane z arkusza kalkulacyjnego 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();

Metody

MetodaZwracany typKrótki opis
build()ChartTworzy wykres.
reverseCategories()BarChartBuilderOdwraca rysowanie serii na osi domeny.
reverseDirection()BarChartBuilderOdwraca kierunek, w którym słupki rosną wzdłuż osi poziomej.
setBackgroundColor(cssValue)BarChartBuilderUstawia kolor tła wykresu.
setColors(cssValues)BarChartBuilderUstawia kolory linii na wykresie.
setDataSourceUrl(url)BarChartBuilderUstawia adres URL źródła danych, który jest używany do pobierania danych ze źródła zewnętrznego, np. z Arkuszy Google.
setDataTable(tableBuilder)BarChartBuilderUstawia tabelę danych, która ma być używana na wykresie, za pomocą obiektu DataTableBuilder.
setDataTable(table)BarChartBuilderUstawia tabelę danych, która zawiera linie wykresu oraz etykiety osi X.
setDataViewDefinition(dataViewDefinition)BarChartBuilderOkreśla definicję widoku danych, która ma być używana na wykresie.
setDimensions(width, height)BarChartBuilderOkreśla wymiary wykresu.
setLegendPosition(position)BarChartBuilderUstawia położenie legendy względem wykresu.
setLegendTextStyle(textStyle)BarChartBuilderUstawia styl tekstu legendy wykresu.
setOption(option, value)BarChartBuilderUstawia zaawansowane opcje tego wykresu.
setRange(start, end)BarChartBuilderUstawia zakres wykresu.
setStacked()BarChartBuilderUżywa linii skumulowanych, co oznacza, że wartości linii i słupków są skumulowane.
setTitle(chartTitle)BarChartBuilderUstawia tytuł wykresu.
setTitleTextStyle(textStyle)BarChartBuilderUstawia styl tekstu tytułu wykresu.
setXAxisTextStyle(textStyle)BarChartBuilderUstawia styl tekstu osi poziomej.
setXAxisTitle(title)BarChartBuilderDodaje tytuł osi poziomej.
setXAxisTitleTextStyle(textStyle)BarChartBuilderUstawia styl tekstu tytułu osi poziomej.
setYAxisTextStyle(textStyle)BarChartBuilderUstawia styl tekstu osi pionowej.
setYAxisTitle(title)BarChartBuilderDodaje tytuł osi pionowej.
setYAxisTitleTextStyle(textStyle)BarChartBuilderUstawia styl tekstu tytułu osi pionowej.
useLogScale()BarChartBuilderPrzekształca oś zakresu w skalę logarytmiczną (wymaga, aby wszystkie wartości były dodatnie).

Szczegółowa dokumentacja

build()

Tworzy wykres.

Powrót

Chart – obiekt wykresu, który można umieszczać w dokumentach i elementach interfejsu lub używać jako statycznego obrazu.


reverseCategories()

Odwraca rysowanie serii na osi domeny. W przypadku wykresów zakresu pionowego (np. liniowych, obszarowych lub kolumnowych) oznacza to, że oś pozioma jest rysowana od prawej do lewej. W przypadku wykresów zakresu poziomego (np. wykresów słupkowych) oznacza to, że oś pionowa jest rysowana od góry do dołu. W przypadku wykresów kołowych oznacza to, że wycinki są rysowane w kierunku przeciwnym do ruchu wskazówek zegara.

// Creates a pie chart builder and sets drawing of the slices in a
// counter-clockwise manner.
const builder = Charts.newPieChart();
builder.reverseCategories();

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


reverseDirection()

Odwraca kierunek, w którym słupki rosną wzdłuż osi poziomej. Domyślnie wartości rosną od lewej do prawej. Wywołanie tej metody powoduje, że rosną one od prawej do lewej.

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setBackgroundColor(cssValue)

Ustawia kolor tła wykresu.

// Creates a line chart builder and sets the background color to gray
const builder = Charts.newLineChart();
builder.setBackgroundColor('gray');

Parametry

NazwaTypOpis
cssValueStringWartość CSS koloru (np. "blue" lub "#00f").

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setColors(cssValues)

Ustawia kolory linii na wykresie.

// 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']);

Parametry

NazwaTypOpis
cssValuesString[]Tablica wartości kolorów CSS, np. ["red", "#acf"]. N-ty element tablicy reprezentuje kolor n-tej linii na wykresie.

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setDataSourceUrl(url)

Ustawia adres URL źródła danych, który jest używany do pobierania danych ze źródła zewnętrznego, np. z Arkuszy Google. Jeśli podasz adres URL źródła danych i tabelę danych, adres URL źródła danych zostanie zignorowany.

Więcej informacji o wysyłaniu zapytań do źródeł danych znajdziesz w dokumentacji Wykresów Google.

Parametry

NazwaTypOpis
urlStringAdres URL źródła danych, w tym wszystkie parametry zapytania.

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setDataTable(tableBuilder)

Ustawia tabelę danych, która ma być używana na wykresie, za pomocą obiektu DataTableBuilder. Jest to wygodna metoda ustawiania tabeli danych bez konieczności wywoływania funkcji build().

Parametry

NazwaTypOpis
tableBuilderDataTableBuildernarzędzie do tworzenia tabel danych, W ramach tego wywołania natychmiast tworzona jest nowa tabela danych, więc żadne dalsze aktualizacje narzędzia do tworzenia nie będą odzwierciedlone na wykresie.

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setDataTable(table)

Ustawia tabelę danych, która zawiera linie wykresu oraz etykiety osi X. Pierwsza kolumna powinna być ciągiem znaków i zawierać etykiety osi poziomej. Może po niej następować dowolna liczba kolumn, które muszą zawierać wartości liczbowe. Każda kolumna jest wyświetlana jako osobna linia.

Parametry

NazwaTypOpis
tableDataTableSourceTabela danych, która ma być używana na wykresie.

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setDataViewDefinition(dataViewDefinition)

Określa definicję widoku danych, która ma być używana na wykresie.

Parametry

NazwaTypOpis
dataViewDefinitionDataViewDefinitionObiekt definicji widoku danych, który określa widok, jaki powinien zostać utworzony na podstawie danego źródła danych na potrzeby rysowania wykresu.

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setDimensions(width, height)

Określa wymiary wykresu.

Parametry

NazwaTypOpis
widthIntegerSzerokość wykresu w pikselach.
heightIntegerWysokość wykresu w pikselach.

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setLegendPosition(position)

Ustawia położenie legendy względem wykresu. Domyślnie legenda nie jest wyświetlana.

// Creates a line chart builder and sets the legend position to right.
const builder = Charts.newLineChart();
builder.setLegendPosition(Charts.Position.RIGHT);

Parametry

NazwaTypOpis
positionPositionPołożenie legendy.

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setLegendTextStyle(textStyle)

Ustawia styl tekstu legendy wykresu.

// 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);

Parametry

NazwaTypOpis
textStyleTextStyleStyl tekstu, który ma być używany w legendzie wykresu.

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setOption(option, value)

Ustawia zaawansowane opcje tego wykresu. Zobacz dostępne opcje tego wykresu. Ta metoda nie działa, jeśli podana opcja jest nieprawidłowa.

// Build a bar chart with a 1-second animation duration.
const builder = Charts.newBarChart();
builder.setOption('animation.duration', 1000);
const chart = builder.build();

Parametry

NazwaTypOpis
optionStringOpcja do ustawienia.
valueObjectWartość do ustawienia.

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setRange(start, end)

Ustawia zakres wykresu.

Jeśli którykolwiek punkt danych wykracza poza zakres, zakres jest rozszerzany, aby go uwzględnić.

Parametry

NazwaTypOpis
startNumberWartość najniższej linii siatki osi zakresu.
endNumberWartość najwyższej linii siatki osi zakresu.

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setStacked()

Używa linii skumulowanych, co oznacza, że wartości linii i słupków są skumulowane. Domyślnie nie ma nakładania.

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setTitle(chartTitle)

Ustawia tytuł wykresu. Tytuł jest wyświetlany na środku nad wykresem.

// Creates a line chart builder and title to 'My Line Chart'.
const builder = Charts.newLineChart();
builder.setTitle('My Line Chart');

Parametry

NazwaTypOpis
chartTitleStringtytuł wykresu;

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setTitleTextStyle(textStyle)

Ustawia styl tekstu tytułu wykresu.

// 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);

Parametry

NazwaTypOpis
textStyleTextStyleStyl tekstu, który ma być używany w tytule wykresu. Obiekt TextStyleBuilder możesz utworzyć, wywołując Charts.newTextStyle().

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setXAxisTextStyle(textStyle)

Ustawia styl tekstu osi poziomej.

// 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);

Parametry

NazwaTypOpis
textStyleTextStyleStyl tekstu, który ma być używany w przypadku tytułu osi poziomej. Obiekt TextStyleBuilder możesz utworzyć, wywołując Charts.newTextStyle().

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setXAxisTitle(title)

Dodaje tytuł osi poziomej. Tytuł jest wyśrodkowany i wyświetlany pod etykietami wartości osi.

// Creates a line chart builder and sets the X-axis title.
const builder = Charts.newLineChart();
builder.setTitle('X-axis Title');

Parametry

NazwaTypOpis
titleStringTytuł osi X.

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setXAxisTitleTextStyle(textStyle)

Ustawia styl tekstu tytułu osi poziomej.

// 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);

Parametry

NazwaTypOpis
textStyleTextStyleStyl tekstu, który ma być używany w przypadku tytułu osi poziomej. Obiekt TextStyleBuilder możesz utworzyć, wywołując Charts.newTextStyle().

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setYAxisTextStyle(textStyle)

Ustawia styl tekstu osi pionowej.

// 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);

Parametry

NazwaTypOpis
textStyleTextStyleStyl tekstu, który ma być używany w przypadku tytułu osi poziomej. Obiekt TextStyleBuilder możesz utworzyć, wywołując Charts.newTextStyle().

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setYAxisTitle(title)

Dodaje tytuł osi pionowej. Tytuł jest wyśrodkowany i wyświetlany po lewej stronie etykiet wartości.

// Creates a line chart builder and sets the Y-axis title.
const builder = Charts.newLineChart();
builder.setYAxisTitle('Y-axis Title');

Parametry

NazwaTypOpis
titleStringTytuł osi Y.

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


setYAxisTitleTextStyle(textStyle)

Ustawia styl tekstu tytułu osi pionowej.

// 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);

Parametry

NazwaTypOpis
textStyleTextStyleStyl tekstu, który ma być używany w przypadku tytułu osi poziomej. Obiekt TextStyleBuilder możesz utworzyć, wywołując Charts.newTextStyle().

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.


useLogScale()

Przekształca oś zakresu w skalę logarytmiczną (wymaga, aby wszystkie wartości były dodatnie). Oś zakresu to oś pionowa w przypadku wykresów pionowych (np. liniowych, warstwowych lub kolumnowych) i oś pozioma w przypadku wykresów poziomych (np. słupkowych).

Powrót

BarChartBuilder – ten konstruktor jest przydatny do łączenia.