Omówienie
Wykres, który umożliwia renderowanie poszczególnych serii jako różnych typów znaczników z tej listy: linia, obszar, słupki, świece i obszar schodkowy.
Aby przypisać domyślny typ znacznika do serii, podaj właściwość seriesType.
Użyj właściwości series, aby określić właściwości każdej serii z osobna.
Przykład
<html>
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawVisualization);
function drawVisualization() {
// Some raw data (not necessarily accurate)
var data = google.visualization.arrayToDataTable([
['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua New Guinea', 'Rwanda', 'Average'],
['2004/05', 165, 938, 522, 998, 450, 614.6],
['2005/06', 135, 1120, 599, 1268, 288, 682],
['2006/07', 157, 1167, 587, 807, 397, 623],
['2007/08', 139, 1110, 615, 968, 215, 609.4],
['2008/09', 136, 691, 629, 1026, 366, 569.6]
]);
var options = {
title : 'Monthly Coffee Production by Country',
vAxis: {title: 'Cups'},
hAxis: {title: 'Month'},
seriesType: 'bars',
series: {5: {type: 'line'}}
};
var chart = new google.visualization.ComboChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="chart_div" style="width: 900px; height: 500px;"></div>
</body>
</html>
Wczytuję
Nazwa pakietu google.charts.load to "corechart"
google.charts.load("current", {packages: ["corechart"]});
Nazwa klasy wizualizacji to google.visualization.ComboChart
var visualization = new google.visualization.ComboChart(container);
Format danych
Wiersze: każdy wiersz tabeli reprezentuje zbiór punktów danych z tą samą lokalizacją na osi X.
Kolumny:
| Kolumna 0 | Kolumna 1 | ... | Kolumna N | |
|---|---|---|---|---|
| Przeznaczenie: | Wartości wiersza 1 | ... | Wartości wiersza N | |
| Typ danych: | Liczba | ... | Liczba | |
| Rola: | domena | dane | ... | dane |
| Opcjonalne role kolumn: | ... |
Opcje konfiguracji
| Nazwa | |
|---|---|
| aggregationTarget |
Sposób grupowania wybranych danych w etykietkach:
Pole
aggregationTarget jest często używane w połączeniu z parametrami selectionMode i tooltip.trigger, na przykład:
var options = {
// Allow multiple
// simultaneous selections.
selectionMode: 'multiple',
// Trigger tooltips
// on selections.
tooltip: {trigger: 'selection'},
// Group selections
// by x-value.
aggregationTarget: 'category',
};
Typ: ciąg znaków
Domyślnie: „auto”.
|
| animation.duration |
Czas trwania animacji w milisekundach. Szczegółowe informacje znajdziesz w dokumentacji animacji. Typ: liczba
Wartość domyślna: 0
|
| animation.easing |
Funkcja wygładzania zastosowana do animacji. Dostępne są te ustawienia:
Typ: ciąg znaków
Domyślnie: „liniowy”
|
| animation.startup |
Określa, czy wykres będzie animowany przy pierwszym rysowaniu. Jeśli parametr ma wartość Typ: wartość logiczna
Domyślnie fałsz
|
| annotations.boxStyle |
W przypadku wykresów, które obsługują adnotacje, obiekt
var options = {
annotations: {
boxStyle: {
// Color of the box outline.
stroke: '#888',
// Thickness of the box outline.
strokeWidth: 1,
// x-radius of the corner curvature.
rx: 10,
// y-radius of the corner curvature.
ry: 10,
// Attributes for linear gradient fill.
gradient: {
// Start color for gradient.
color1: '#fbf6a7',
// Finish color for gradient.
color2: '#33b679',
// Where on the boundary to start and
// end the color1/color2 gradient,
// relative to the upper left corner
// of the boundary.
x1: '0%', y1: '0%',
x2: '100%', y2: '100%',
// If true, the boundary for x1,
// y1, x2, and y2 is the box. If
// false, it's the entire chart.
useObjectBoundingBoxUnits: true
}
}
}
};
Ta opcja jest obecnie obsługiwana w przypadku wykresów warstwowych, słupkowych, kolumnowych, mieszanych, liniowych i punktowych. Nie jest on obsługiwany w wykresie adnotacji. Typ: obiekt
Wartość domyślna:null
|
| annotations.datum |
W przypadku wykresów obsługujących adnotacje obiekt
annotations.datum umożliwia zastąpienie wybranych z Wykresów Google adnotacji podanych dla poszczególnych elementów danych (np. wartości wyświetlanych wraz z każdym słupkiem na wykresie słupkowym). Kolorem możesz sterować za pomocą parametru annotations.datum.stem.color, długością trzonu za pomocą annotations.datum.stem.length, a stylem – annotations.datum.style.
Typ: obiekt
Domyślny: kolor to „black”, długość to 12, a styl to „punkt”.
|
| annotations.domain |
Na wykresach obsługujących adnotacje obiekt
annotations.domain pozwala zastąpić wybór z Wykresów Google w przypadku adnotacji wyświetlanych w domenie (główna oś wykresu, np. oś X na typowym wykresie liniowym). Kolorem możesz sterować za pomocą parametru annotations.domain.stem.color, długością trzonu za pomocą annotations.domain.stem.length, a stylem – annotations.domain.style.
Typ: obiekt
Domyślny: kolor to „black”, długość to 5, styl to „punkt”.
|
| annotations.highContrast |
W przypadku wykresów obsługujących adnotacje wartość logiczna
annotations.highContrast umożliwia zastąpienie wybranego przez Wykresy Google koloru adnotacji. Domyślnie annotations.highContrast ma wartość prawda, co sprawia, że na wykresach jest wybierany kolor adnotacji o dobrym kontraście: jasnym kolorem na ciemnym tle i ciemnym na jasnym. Jeśli ustawisz wartość annotations.highContrast na fałsz i nie określisz własnego koloru adnotacji, Wykresy Google będą używać domyślnego koloru serii tej adnotacji:
Typ: wartość logiczna
Wartość domyślna:true (prawda)
|
| annotations.stem |
W przypadku wykresów, które obsługują adnotacje, obiekt
annotations.stem pozwala zastąpić wybrany przez Wykresy Google styl rdzenia. Kolorem możesz sterować za pomocą parametru annotations.stem.color, a długością trzonu
– annotations.stem.length. Pamiętaj, że opcja długości trzonu nie ma wpływu na adnotacje o stylu 'line': w przypadku adnotacji punktu odniesienia 'line' długość trzonu jest zawsze taka sama jak tekst, a w przypadku adnotacji domeny 'line' rdzenia rozciąga się na cały wykres.
Typ: obiekt
Domyślny:kolor to „black”, długość to 5 w przypadku adnotacji domeny i 12 w przypadku adnotacji odniesienia.
|
| annotations.style |
W przypadku wykresów obsługujących adnotacje opcja
annotations.style pozwala zastąpić wybrany typ adnotacji przez Wykresy Google. Może to być 'line' lub 'point'.
Typ: ciąg znaków
Domyślnie: „punkt”.
|
| annotations.textStyle |
W przypadku wykresów, które obsługują adnotacje, obiekt
annotations.textStyle kontroluje wygląd tekstu adnotacji:
var options = {
annotations: {
textStyle: {
fontName: 'Times-Roman',
fontSize: 18,
bold: true,
italic: true,
// The color of the text.
color: '#871b47',
// The color of the text outline.
auraColor: '#d799ae',
// The transparency of the text.
opacity: 0.8
}
}
};
Ta opcja jest obecnie obsługiwana w przypadku wykresów warstwowych, słupkowych, kolumnowych, mieszanych, liniowych i punktowych. Nie jest on obsługiwany w wykresie adnotacji . Typ: obiekt
Wartość domyślna:null
|
| areaOpacity |
Domyślna przezroczystość kolorowego obszaru pod seria wykresu warstwowego, gdzie 0,0 oznacza pełną przezroczystość, a 1,0 – pełną nieprzezroczystość. Aby określić przezroczystość pojedynczej serii, ustaw wartość „obszarOpacity” we właściwości Typ: liczba, 0,0–1,0
Wartość domyślna: 0,3
|
| axisTitlesPosition |
Gdzie umieszczać tytuły osi w porównaniu z obszarem wykresu. Obsługiwane wartości:
Typ: ciąg znaków
Domyślnie: „out”
|
| backgroundColor |
Kolor tła głównego obszaru wykresu. Może to być prosty ciąg znaków koloru HTML, np. Typ: ciąg znaków lub obiekt
Domyślnie: „white”
|
| backgroundColor.stroke |
Kolor obramowania wykresu jako ciąg znaków HTML koloru. Typ: ciąg znaków
Domyślnie: „#666”.
|
| backgroundColor.strokeWidth |
Szerokość obramowania w pikselach. Typ: liczba
Wartość domyślna: 0
|
| backgroundColor.fill |
Kolor wypełnienia wykresu jako ciąg znaków HTML koloru. Typ: ciąg znaków
Domyślnie: „white”
|
| bar.groupWidth |
Szerokość grupy słupków podana w jednym z tych formatów:
Typ: liczba lub ciąg znaków.
Domyślny: złoty współczynnik, czyli około „61,8%”.
|
| candlestick.hollowIsRising |
Jeśli wartość to prawda, świece wznoszące się będą wyświetlane jako puste, a spadające z nich będą stałe. W przeciwnym razie sytuacja będzie odwrotna. Typ: wartość logiczna
Wartość domyślna: false (zmienna później na wartość prawda)
|
| candlestick.fallingColor.fill |
Kolor wypełnienia spadających świec w postaci ciągu koloru HTML. Typ: ciąg znaków
Domyślne: auto (zależnie od koloru serii i pustego obrazu)
|
| candlestick.fallingColor.stroke |
Kolor kreski spadających świec w postaci ciągu koloru HTML. Typ: ciąg znaków
Domyślny:auto (kolor serii)
|
| candlestick.fallingColor.strokeWidth |
Szerokość kreski spadających świec w postaci ciągu koloru HTML. Typ: 2
Domyślnie: liczba
|
| candlestick.risingColor.fill |
Kolor wypełnienia rosnących świec w postaci ciągu koloru HTML. Typ: ciąg znaków
Domyślne: auto (biały lub kolor serii w zależności od pustego obrazu)
|
| candlestick.risingColor.stroke |
Kolor kreski rosnących świec w postaci ciągu koloru HTML. Typ: ciąg znaków
Domyślne: automatycznie (kolor serii lub biały w zależności od pustego obrazu)
|
| candlestick.risingColor.strokeWidth |
Szerokość kreski rosnących świec w postaci ciągu koloru HTML. Typ: liczba
Wartość domyślna: 2
|
| chartArea |
Obiekt z elementami służącymi do konfigurowania miejsca docelowego i rozmiaru obszaru wykresu (gdzie sam wykres jest rysowany, z wyłączeniem osi i legend). Obsługiwane są dwa formaty: liczba lub liczba, po której następuje znak %. Prosta liczba to wartość w pikselach, po której następuje znak %, a po nim wartość procentowa. Przykład: Typ: obiekt
Wartość domyślna:null
|
| chartArea.backgroundColor |
Kolor tła obszaru wykresu. Używany ciąg może być ciągiem szesnastkowym (np. „#fdc”) lub angielską nazwę koloru. Jeśli używany jest obiekt, można podać te właściwości:
Typ: ciąg znaków lub obiekt
Domyślnie: „white”
|
| chartArea.left |
Jak daleko od lewej krawędzi należy narysować wykres. Typ: liczba lub ciąg znaków.
Domyślnie automatycznie
|
| chartArea.top |
Odległość wykresu od górnej krawędzi. Typ: liczba lub ciąg znaków.
Domyślnie automatycznie
|
| chartArea.width |
Szerokość obszaru wykresu. Typ: liczba lub ciąg znaków.
Domyślnie automatycznie
|
| chartArea.height |
Wysokość obszaru wykresu. Typ: liczba lub ciąg znaków.
Domyślnie automatycznie
|
| kolory |
Kolory elementów wykresu. Tablica ciągów znaków, w których każdy element jest ciągiem znaków koloru HTML, np. Typ: tablica ciągów znaków
Domyślne:kolory domyślne
|
| krzyżyk |
Obiekt z właściwościami krzyżyka wykresu. Typ: obiekt
Wartość domyślna:null
|
| crosshair.color |
Kolor krzyżyka wyrażony jako nazwa koloru (np. „niebieski”) lub wartość RGB (np. „#adf”). Typ: ciąg znaków
Typ:domyślny
|
| crosshair.focused |
Obiekt zawierający po zaznaczeniu właściwości krzyżyka. Typ: obiekt
Domyślny:domyślny
|
| crosshair.opacity |
Przezroczystość krzyżyka, gdzie Typ: liczba
Wartość domyślna: 1,0
|
| crosshair.orientation |
Orientacja krzyżyka: „pionowa” tylko w przypadku włosów pionowych, „pozioma” tylko w przypadku włosów poziomych lub „obie” w przypadku tradycyjnego krzyżyka. Typ: ciąg znaków
Domyślnie: „zarówno”
|
| crosshair.selected |
Obiekt zawierający po zaznaczeniu właściwości krzyżyka. Typ: obiekt
Domyślny:domyślny
|
| crosshair.trigger |
Kiedy wyświetlać krzyżyk: na Typ: ciąg znaków
Domyślnie: „zarówno”
|
| curveType |
Kontroluje krzywą linii, gdy szerokość linii jest różna od zera. Użyj jednego z tych rodzajów wartości:
Type:string
Domyślna: „none” (brak).
|
| dataOpacity |
Przezroczystość punktów danych – wartość 1,0 oznacza całkowitą nieprzezroczystość, a wartość 0,0 – pełną przezroczystość. Na wykresach punktowych, histogramach, słupkowych i kolumnowych oznacza to widoczne dane: kropki na wykresie punktowym, a na innych prostokątach – prostokąty. Na wykresach, na których wybór danych powoduje utworzenie kropki (np. na wykresach liniowych i warstwowych), odnosi się ona do okręgów widocznych po najechaniu kursorem lub zaznaczeniu. Wykres mieszany prezentuje oba zachowania i ta opcja nie ma wpływu na inne wykresy. Aby dowiedzieć się, jak zmienić przezroczystość linii trendu, przeczytaj o przezroczystości linii trendu . Typ: liczba
Wartość domyślna: 1,0
|
| enableInteractivity |
Określa, czy wykres generuje zdarzenia dotyczące użytkowników czy reaguje na interakcję użytkownika. Jeśli ma wartość false (fałsz), wykres nie będzie wywoływać zdarzenia „select” ani innych zdarzeń związanych z interakcją (ale będzie generować zdarzenia gotowe lub zdarzenia błędu) i nie będzie wyświetlać tekstu wyświetlanego po najechaniu kursorem ani w inny sposób zmieniać się w zależności od danych wejściowych użytkownika. Typ: wartość logiczna
Wartość domyślna:true (prawda)
|
| focusTarget |
Typ elementu, który zostanie zaznaczony po najechaniu kursorem myszy. Wpływa też na to, który element jest wybierany kliknięciem myszy i który element tabeli danych jest powiązany ze zdarzeniami. Może to być:
W polu „category” (kategoria) etykietka pokazuje wszystkie wartości kategorii. Ta opcja może przydać się do porównywania wartości różnych serii. Typ: ciąg znaków
Wartość domyślna: „datum”.
|
| fontSize |
Domyślny rozmiar czcionki całego tekstu na wykresie (w pikselach). Możesz zastąpić to ustawienie za pomocą właściwości dla konkretnych elementów wykresu. Typ: liczba
Domyślne:automatyczne
|
| fontName |
Domyślna krój czcionki dla całego tekstu na wykresie. Możesz zastąpić to ustawienie za pomocą właściwości dla konkretnych elementów wykresu. Typ: ciąg znaków
Wartość domyślna: „Blogger”
|
| forceIFrame |
Rysuje wykres wewnątrz ramki wbudowanej. (Pamiętaj, że w IE8 ta opcja jest ignorowana – wszystkie wykresy w IE8 są rysowane w ramkach i-frame). Typ: wartość logiczna
Wartość domyślna: fałsz.
|
| hAxis |
Obiekt z elementami umożliwiającymi konfigurowanie różnych elementów osi poziomej. Aby określić właściwości tego obiektu, możesz użyć notacji literału obiektu, jak pokazano poniżej:
{
title: 'Hello',
titleTextStyle: {
color: '#FF0000'
}
}
Typ: obiekt
Wartość domyślna:null
|
| hAxis.baseline |
Punkt odniesienia na osi poziomej. Ta opcja jest obsługiwana tylko w przypadku osi Typ: liczba
Domyślne:automatyczne
|
| hAxis.baselineColor |
Kolor punktu odniesienia na osi poziomej. Może to być dowolny ciąg znaków HTML koloru, na przykład Ta opcja jest obsługiwana tylko w przypadku osi Typ: liczba
Domyślny: „black”
|
| hAxis.direction |
Kierunek, w którym rosną wartości na osi poziomej. Określ Typ: 1 lub -1
Wartość domyślna: 1
|
| hAxis.format |
Ciąg formatowania etykiet osi daty lub liczb.
W przypadku etykiet osi liczbowej jest to podzbiór formatowania dziesiętnego
Zbiór wzorców ICU
. Na przykład
W przypadku etykiet osi daty jest to podzbiór formatowania daty
zestaw wzorców OIOM
. Na przykład Faktyczne formatowanie zastosowane do etykiety jest pobierane z języka, w którym załadowano interfejs API. Więcej informacji znajdziesz w artykule o wczytywaniu wykresów w określonym języku .
Przy obliczaniu wartości znaczników i linii siatki branych jest pod uwagę kilka alternatywnych kombinacji wszystkich odpowiednich opcji linii siatki, a te alternatywne zostaną odrzucone, jeśli sformatowane etykiety znacznika będą się powtarzać lub się nakładać.
Możesz więc określić
Ta opcja jest obsługiwana tylko w przypadku osi Typ: ciąg znaków
Domyślnie automatycznie
|
| hAxis.gridlines |
Obiekt z właściwościami służącymi do konfigurowania linii siatki na osi poziomej. Pamiętaj, że linie siatki na osi poziomej są rysowane w pionie. Aby określić właściwości tego obiektu, możesz użyć notacji literału obiektu w następujący sposób: {color: '#333', minSpacing: 20}
Ta opcja jest obsługiwana tylko w przypadku osi Typ: obiekt
Wartość domyślna:null
|
| hAxis.gridlines.color |
Kolor poziomych linii siatki w obszarze wykresu. Podaj prawidłowy ciąg znaków HTML koloru. Typ: ciąg znaków
Domyślnie: „#CCC”.
|
| hAxis.gridlines.count |
Przybliżona liczba poziomych linii siatki w obszarze wykresu.
Jeśli podasz liczbę dodatnią dla elementu Typ: liczba
Wartość domyślna: -1
|
| hAxis.gridlines.interval |
Tablica rozmiarów (jako wartości danych, a nie pikseli) między sąsiednimi liniami siatki. Ta opcja jest obecnie dostępna tylko w przypadku osi liczbowych, ale jest ona podobna do opcji Typ: liczba od 1 do 10 (bez 10).
Wartość domyślna: obliczone.
|
| hAxis.gridlines.minSpacing |
Minimalna przestrzeń ekranu (w pikselach) między głównymi liniami siatki na osi HAx.
Wartość domyślna głównych linii siatki to Typ: liczba
Wartość domyślna: obliczone.
|
| hAxis.gridlines.multiple |
Wszystkie wartości linii siatki i znaczników muszą być wielokrotnościami wartości tej opcji. Pamiętaj, że w przeciwieństwie do interwałów potęga dziesięciokrotnej wielokrotności nie jest uwzględniana.
Możesz więc wymuszać, aby znaczniki były liczbami całkowitymi, określając wartość Typ: liczba
Wartość domyślna: 1
|
| hAxis.gridlines.units |
Zastępuje domyślny format różnych aspektów typów danych daty, daty, godziny i godziny, gdy są używane z liniami siatki obliczonymi na wykresie. Umożliwia formatowanie lat, miesięcy, dni, godzin, minut, sekund i milisekund. Ogólny format to:
gridlines: {
units: {
years: {format: [/*format strings here*/]},
months: {format: [/*format strings here*/]},
days: {format: [/*format strings here*/]}
hours: {format: [/*format strings here*/]}
minutes: {format: [/*format strings here*/]}
seconds: {format: [/*format strings here*/]},
milliseconds: {format: [/*format strings here*/]},
}
}
Więcej informacji znajdziesz w sekcji Daty i godziny. Typ: obiekt
Wartość domyślna:null
|
| hAxis.minorGridlines |
Obiekt z elementami służącymi do konfigurowania podrzędnych linii siatki na osi poziomej, podobnie jak w przypadku opcji hAxis.gridlines.
Ta opcja jest obsługiwana tylko w przypadku osi Typ: obiekt
Wartość domyślna:null
|
| hAxis.minorGridlines.color |
Kolor poziomych mniejszych linii siatki w obszarze wykresu. Podaj prawidłowy ciąg znaków HTML koloru. Typ: ciąg znaków
Domyślny: połączenie koloru linii siatki i koloru tła.
|
| hAxis.minorGridlines.count |
Opcja Typ: liczba
Wartość domyślna: 1
|
| hAxis.minorGridlines.interval |
Opcja MinGridlines.interval jest podobna do opcji interwału większych linii siatki, ale wybrany przedział będzie zawsze równy dzielnikowi większej linii siatki.
Domyślny interwał dla skal liniowych to Typ: liczba
Wartość domyślna: 1
|
| hAxis.minorGridlines.minSpacing |
Minimalna wymagana ilość miejsca (w pikselach) między sąsiednimi mniejszymi liniami siatki oraz między mniejszymi i głównymi liniami siatki. Wartość domyślna to 1/2 minSpacing głównych linii siatki dla skal liniowych i 1/5 minSpacing dla skal logicznych. Typ: liczba
Default (wartość domyślna): obliczone
|
| hAxis.minorGridlines.multiple |
Tak samo jak w przypadku głównych Typ: liczba
Wartość domyślna: 1
|
| hAxis.minorGridlines.units |
Zastępuje domyślny format różnych aspektów danych typu data, godzina i godzina w przypadku używania z wykresami podrzędnymi obliczonymi na wykresie. Umożliwia formatowanie lat, miesięcy, dni, godzin, minut, sekund i milisekund. Ogólny format to:
gridlines: {
units: {
years: {format: [/*format strings here*/]},
months: {format: [/*format strings here*/]},
days: {format: [/*format strings here*/]}
hours: {format: [/*format strings here*/]}
minutes: {format: [/*format strings here*/]}
seconds: {format: [/*format strings here*/]},
milliseconds: {format: [/*format strings here*/]},
}
}
Więcej informacji znajdziesz w sekcji Daty i godziny. Typ: obiekt
Wartość domyślna:null
|
| hAxis.logScale |
Właściwość Ta opcja jest obsługiwana tylko w przypadku osi Typ: wartość logiczna
Wartość domyślna: fałsz.
|
| hAxis.scaleType |
Właściwość
Ta opcja jest obsługiwana tylko w przypadku osi Typ: ciąg znaków
Wartość domyślna: null
|
| hAxis.textPosition |
Położenie tekstu na osi poziomej względem obszaru wykresu. Obsługiwane wartości: „out”, „in”, „none”. Typ: ciąg znaków
Domyślnie: „out”
|
| hAxis.textStyle |
Obiekt określający styl tekstu osi poziomej. Obiekt ma ten format:
{ color: <string>,
fontName: <string>,
fontSize: <number>,
bold: <boolean>,
italic: <boolean> }
Typ: obiekt
Domyślnie:
{color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
|
| hAxis.ticks |
Zastępuje automatycznie wygenerowane znaczniki osi X określoną tablicą. Każdy element tablicy powinien być prawidłową wartością znacznika (np. liczba, data, data i godzina lub godzina) albo obiektem. Jeśli jest to obiekt, powinien mieć właściwość
Pole viewWindow zostanie automatycznie rozwinięte i będzie zawierać minimalną i maksymalną liczbę taktów, chyba że określisz Przykłady:
Ta opcja jest obsługiwana tylko w przypadku osi Typ: tablica elementów.
Domyślnie automatycznie
|
| hAxis.title |
Właściwość Typ: ciąg znaków
Wartość domyślna:null
|
| hAxis.titleTextStyle |
Obiekt określający styl tekstu tytułu osi poziomej. Obiekt ma ten format:
{ color: <string>,
fontName: <string>,
fontSize: <number>,
bold: <boolean>,
italic: <boolean> }
Typ: obiekt
Domyślnie:
{color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
|
| hAxis.allowContainerBoundaryTextCutoff |
W przypadku wartości false (fałsz) najbardziej zewnętrzne etykiety będą ukryte, zamiast zezwalać na ich przycinanie przez kontener wykresu. Jeśli ma wartość Prawda, przycinanie etykiet jest dozwolone. Ta opcja jest obsługiwana tylko w przypadku osi Typ: wartość logiczna
Wartość domyślna: fałsz.
|
| hAxis.slantedText |
Jeśli ma wartość prawda, narysuj tekst na osi poziomej pod kątem, aby dopasować większy tekst wzdłuż osi. Jeśli nie, narysuj tekst osi poziomej pionowo. Jeśli tekst jest przechylony pionowo, domyślnie nie zmieści się on w całości. Zwróć uwagę, że ta opcja jest dostępna tylko wtedy, gdy Typ: wartość logiczna
Domyślne:automatyczne
|
| hAxis.slantedTextAngle |
Kąt tekstu na osi poziomej (jeśli jest on skośny). Ignorowana, jeśli właściwość Typ: liczba, -90–90
Wartość domyślna: 30
|
| hAxis.maxAlternation |
Maksymalna liczba poziomów tekstu na osi poziomej. Jeśli etykiety tekstowe osi staną się zbyt zatłoczone, serwer może przesuwać sąsiednie etykiety w górę lub w dół, aby je lepiej dopasować. Ta wartość określa największą liczbę używanych poziomów. Serwer może użyć mniejszej liczby poziomów, jeśli etykiety mieszczą się bez nakładania się. Domyślna wartość dla dat i godzin to 1. Typ: liczba
Wartość domyślna: 2
|
| hAxis.maxTextLines |
Maksymalna dozwolona liczba wierszy w etykietach tekstowych. Etykiety mogą obejmować wiele wierszy, jeśli są za długie, a liczba wierszy jest domyślnie ograniczona wysokością dostępnego miejsca. Typ: liczba
Domyślnie automatycznie
|
| hAxis.minTextSpacing |
Minimalne odstępy w poziomie (w pikselach) dopuszczalne między 2 przyległymi etykietami tekstowymi. Jeśli etykiety są rozmieszczone zbyt gęsto lub zbyt długie, odstępy mogą spaść poniżej tego progu i w takim przypadku zostanie zastosowany jeden z mechanizmów ułatwiających zachowanie poufności etykiet (na przykład obcięcie etykiet lub usunięcie niektórych z nich). Typ: liczba
Domyślna: wartość
hAxis.textStyle.fontSize. |
| hAxis.showTextEvery |
Liczba etykiet osi poziomej do pokazania, gdzie 1 oznacza każdą etykietę, 2 oznacza, że są widoczne wszystkie pozostałe etykiety itd. Domyślnie wyświetlane jest jak najwięcej etykiet bez nakładania się etykiet. Typ: liczba
Domyślne:automatyczne
|
| hAxis.maxValue |
Przenosi maksymalną wartość osi poziomej do określonej wartości. Na większości wykresów będzie to zmiana w prawo. Ignorowana, jeśli ustawiona jest wartość mniejsza niż maksymalna wartość x danych.
Ta opcja jest obsługiwana tylko w przypadku osi Typ: liczba
Domyślne:automatyczne
|
| hAxis.minValue |
Przenosi wartość minimalną na osi poziomej do określonej wartości. Na większości wykresów będzie ona ustawiona w lewo. Ignorowana, jeśli ustawiona jest wartość większa niż minimalna wartość x danych.
Ta opcja jest obsługiwana tylko w przypadku osi Typ: liczba
Domyślne:automatyczne
|
| hAxis.viewWindowMode |
Określa, jak skalować oś poziomą, by renderować wartości na obszarze wykresu. Obsługiwane są te wartości ciągów:
Ta opcja jest obsługiwana tylko w przypadku osi Typ: ciąg znaków
Domyślnie: odpowiednik „ładne”. Jednak jeśli są używane, pierwszeństwo mają
haxis.viewWindow.min i haxis.viewWindow.max.
|
| hAxis.viewWindow |
Określa zakres przycięcia osi poziomej. Typ: obiekt
Wartość domyślna:null
|
| hAxis.viewWindow.max |
Ignorowana, gdy atrybut Typ: liczba
Domyślnie automatycznie
|
| hAxis.viewWindow.min |
Ignorowana, gdy atrybut Typ: liczba
Domyślnie automatycznie
|
| wysokość |
Wysokość wykresu w pikselach. Typ: liczba
Domyślna: wysokość elementu nadrzędnego.
|
| interpolateNulls |
Określa, czy odgadnąć wartość brakujących punktów. Jeśli ma wartość true (prawda), odgadnie wartość wszystkich brakujących danych na podstawie sąsiednich punktów. Jeśli ma wartość Fałsz, spowoduje to pozostawienie przerwy w wierszu w nieznanym punkcie.
Ta metoda nie jest obsługiwana w przypadku wykresów warstwowych z opcją Typ: wartość logiczna
Wartość domyślna: fałsz.
|
| isStacked |
Jeśli ma wartość Prawda, elementy serii tego samego typu są skumulowane. Ma wpływ tylko na serie słupkowe, kolumny i obszary. Typ: wartość logiczna
Wartość domyślna: fałsz.
|
| legenda |
Obiekt z członkami służącymi do konfigurowania różnych aspektów legendy. Aby określić właściwości tego obiektu, możesz użyć notacji literału obiektu, jak pokazano poniżej: {position: 'top', textStyle: {color: 'blue', fontSize: 16}}
Typ: obiekt
Wartość domyślna:null
|
| legend.alignment |
Wyrównanie legendy. Użyj jednego z tych rodzajów wartości:
Początek, środek i koniec odnoszą się do stylu (pionowego lub poziomego) legendy. Na przykład w legendzie „po prawej” punkty „początek” i „koniec” znajdują się odpowiednio na górze i na dole. W legendzie „góra” wartości „początek” i „koniec” znajdują się odpowiednio po lewej i prawej stronie obszaru. Wartość domyślna zależy od pozycji legendy. Domyślna wartość w legendach „bottom” to „center”, a w innych – „start”. Typ: ciąg znaków
Domyślne:automatyczne
|
| legend.maxLines |
Maksymalna liczba wierszy w legendzie. Aby dodać wiersze do legendy, ustaw wartość większą niż 1. Uwaga: dokładna logika używana do określenia rzeczywistej liczby wyrenderowanych wierszy wciąż się zmienia. Obecnie ta opcja działa tylko wtedy, gdy pole legend.position ma wartość „top”. Typ: liczba
Wartość domyślna: 1
|
| legend.pageIndex |
Początkowo wybrany indeks stron legendy liczony od zera. Typ: liczba
Wartość domyślna: 0
|
| legend.position |
Pozycja legendy. Użyj jednego z tych rodzajów wartości:
Typ: ciąg znaków
Domyślnie: „right”
|
| legend.textStyle |
Obiekt określający styl tekstu legendy. Obiekt ma ten format:
{ color: <string>,
fontName: <string>,
fontSize: <number>,
bold: <boolean>,
italic: <boolean> }
Typ: obiekt
Domyślnie:
{color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
|
| lineDashStyle |
Wzorzec włączania i wyłączania przerywanych linii. Na przykład Typ: tablica liczb
Wartość domyślna:null
|
| lineWidth |
Szerokość linii danych w pikselach. Aby ukryć wszystkie linie i pokazać tylko punkty, wpisz 0. Możesz zastąpić wartości dla poszczególnych serii za pomocą właściwości Typ: liczba
Wartość domyślna: 2
|
| orientacja |
Orientacja wykresu. Ustawienie wartości Typ: ciąg znaków
Domyślnie: „poziomo”
|
| pointShape |
Kształt poszczególnych elementów danych: „koło”, „trójkąt”, „kwadrat”, „romb”, „gwiazdka” lub „wielokąt”. Przykłady znajdziesz w dokumentacji punktów . Typ: ciąg znaków
Domyślnie: „okrąg”.
|
| pointSize |
Średnica wyświetlanych punktów w pikselach. Aby ukryć wszystkie punkty, wpisz 0. Możesz zastąpić wartości dla poszczególnych serii za pomocą właściwości Typ: liczba
Wartość domyślna: 0
|
| pointsVisible |
Określa, czy punkty będą wyświetlane. Aby ukryć wszystkie punkty, ustaw wartość
Można ją też zastąpić, używając roli stylu w postaci Typ: wartość logiczna
Wartość domyślna:true (prawda)
|
| reverseCategories |
Jeśli zasada ma wartość Prawda, seria jest rysowana od prawej do lewej. Domyślnie rysowanie od lewej do prawej.
Ta opcja jest obsługiwana tylko w przypadku osi Typ: wartość logiczna
Wartość domyślna: fałsz.
|
| selectionMode |
Gdy Typ: ciąg znaków
Domyślnie: „pojedynczy”
|
| seria |
Tablica obiektów, z których każdy opisuje format odpowiedniej serii na wykresie. Aby użyć wartości domyślnych dla serii, podaj pusty obiekt {}. Jeśli nie określono serii lub wartości, zostanie użyta wartość globalna. Każdy obiekt obsługuje te właściwości:
Możesz podać tablicę obiektów, z których każdy odnosi się do serii w podanej kolejności, albo określić obiekt, w którym każdy element podrzędny ma klucz numeryczny wskazujący, do której serii ma zastosowanie. Na przykład dwie poniższe deklaracje są identyczne. Pierwsza seria jest zadeklarowana jako czarna i nie ma jej w legendzie, a czwarta – jako czerwona i nie ma jej w legendzie:
series: [
{color: 'black', visibleInLegend: false}, {}, {},
{color: 'red', visibleInLegend: false}
]
series: {
0:{color: 'black', visibleInLegend: false},
3:{color: 'red', visibleInLegend: false}
}
Typ: tablica obiektów lub obiektów z zagnieżdżonymi obiektami
Wartość domyślna: {}
|
| seriesType |
Domyślny typ linii dla każdej serii nieokreślonej we właściwości Typ: ciąg znaków
Domyślnie: „line”
|
| motyw |
Motyw to zestaw wstępnie zdefiniowanych wartości opcji, które współpracują ze sobą, aby uzyskać określony sposób działania wykresu lub efektu wizualnego. Obecnie dostępny jest tylko 1 motyw:
Typ: ciąg znaków
Wartość domyślna:null
|
| tytuł |
Tekst do wyświetlenia nad wykresem. Typ: ciąg znaków
Domyślnie bez tytułu.
|
| titlePosition |
Gdzie umieścić tytuł wykresu w porównaniu do obszaru wykresu. Obsługiwane wartości:
Typ: ciąg znaków
Domyślnie: „out”
|
| titleTextStyle |
Obiekt, który określa styl tekstu tytułu. Obiekt ma ten format:
{ color: <string>,
fontName: <string>,
fontSize: <number>,
bold: <boolean>,
italic: <boolean> }
Typ: obiekt
Domyślnie:
{color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
|
| etykietka |
Obiekt z elementami służącymi do konfigurowania różnych elementów etykietek. Aby określić właściwości tego obiektu, możesz użyć notacji literału obiektu, jak pokazano poniżej: {textStyle: {color: '#FF0000'}, showColorCode: true}
Typ: obiekt
Wartość domyślna:null
|
| tooltip.ignoreBounds |
Jeśli ustawisz wartość Uwaga: dotyczy to tylko etykiet HTML. Jeśli ta opcja jest włączona w etykietkach SVG, wszystkie nadmiarowe elementy poza granicami wykresu zostaną przycięte. Więcej informacji znajdziesz w sekcji Dostosowywanie treści etykietki. Typ: wartość logiczna
Wartość domyślna: fałsz.
|
| tooltip.isHtml |
Jeśli ma wartość Prawda, używaj etykietek renderowanych HTML (a nie renderowanych w formacie SVG). Więcej informacji znajdziesz w sekcji Dostosowywanie treści etykietki. Uwaga: wizualizacja wykresu bąbelkowego nie obsługuje dostosowywania zawartości etykietki HTML za pomocą roli danych kolumny etykietki. Typ: wartość logiczna
Wartość domyślna: fałsz.
|
| tooltip.showColorCode |
Jeśli ma wartość prawda, obok informacji o serii na etykietce wyświetlaj kolorowe kwadraty. Wartość domyślna to true, gdy Typ: wartość logiczna
Domyślne:automatyczne
|
| tooltip.textStyle |
Obiekt, który określa styl tekstu etykietki. Obiekt ma ten format:
{ color: <string>,
fontName: <string>,
fontSize: <number>,
bold: <boolean>,
italic: <boolean> }
Typ: obiekt
Domyślnie:
{color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
|
| tooltip.trigger |
Interakcja użytkownika, która powoduje wyświetlenie etykietki:
Typ: ciąg znaków
Domyślnie: „fokus”
|
| vAxes |
Określa właściwości poszczególnych osi pionowych, jeśli wykres ma wiele osi pionowych.
Każdy obiekt podrzędny jest obiektem
Aby określić wykres z wieloma osiami pionowymi, najpierw zdefiniuj nową oś za pomocą funkcji
{
series: {
2: {
targetAxisIndex:1
}
},
vAxes: {
1: {
title:'Losses',
textStyle: {color: 'red'}
}
}
}
Ta właściwość może być obiektem lub tablicą. Obiekt to zbiór obiektów, z których każda ma etykietę liczbową określającą definiowaną oś – jest to format pokazany powyżej. Tablica to tablica obiektów, po jednym na oś. Na przykład ten zapis formatu tablicy jest identyczny z pokazanym powyżej obiektem
vAxes: [
{}, // Nothing specified for axis 0
{
title:'Losses',
textStyle: {color: 'red'} // Axis 1
}
]
Typ: tablica obiektów lub obiektów podrzędnych
Wartość domyślna:null
|
| vAxis |
Obiekt ze elementami służącymi do konfigurowania różnych elementów osi pionowej. Aby określić właściwości tego obiektu, możesz użyć notacji literału obiektu, jak pokazano poniżej: {title: 'Hello', titleTextStyle: {color: '#FF0000'}}
Typ: obiekt
Wartość domyślna:null
|
| vAxis.baseline |
Właściwość Typ: liczba
Domyślne:automatyczne
|
| vAxis.baselineColor |
Określa kolor punktu odniesienia na osi pionowej. Może to być dowolny ciąg znaków HTML koloru, na przykład Typ: liczba
Domyślny: „black”
|
| vAxis.direction |
Kierunek, w którym rosną wartości na osi pionowej. Domyślnie niskie wartości znajdują się na dole wykresu. Określ Typ: 1 lub -1
Wartość domyślna: 1
|
| vAxis.format |
Ciąg formatowania etykiet osi liczbowej. To jest podzbiór
zestawu wzorców OIOM
.
Na przykład
Faktyczne formatowanie zastosowane do etykiety jest pobierane z języka, w którym załadowano interfejs API. Więcej informacji znajdziesz w artykule o wczytywaniu wykresów w określonym języku .
Przy obliczaniu wartości znaczników i linii siatki branych jest pod uwagę kilka alternatywnych kombinacji wszystkich odpowiednich opcji linii siatki, a te alternatywne zostaną odrzucone, jeśli sformatowane etykiety znacznika będą się powtarzać lub się nakładać.
Możesz więc określić Typ: ciąg znaków
Domyślnie automatycznie
|
| vAxis.gridlines |
Obiekt ze elementami służącymi do konfigurowania linii siatki na osi pionowej. Pamiętaj, że linie siatki na osi pionowej są rysowane poziomo. Aby określić właściwości tego obiektu, możesz użyć notacji literału obiektu, jak pokazano poniżej: {color: '#333', minSpacing: 20}
Typ: obiekt
Wartość domyślna:null
|
| vAxis.gridlines.color |
Kolor pionowych linii siatki w obszarze wykresu. Podaj prawidłowy ciąg znaków HTML koloru. Typ: ciąg znaków
Domyślnie: „#CCC”.
|
| vAxis.gridlines.count |
Przybliżona liczba poziomych linii siatki w obszarze wykresu.
Jeśli podasz liczbę dodatnią dla elementu Typ: liczba
Wartość domyślna: -1
|
| vAxis.gridlines.interval |
Tablica rozmiarów (jako wartości danych, a nie pikseli) między sąsiednimi liniami siatki. Ta opcja jest obecnie dostępna tylko w przypadku osi liczbowych, ale jest ona podobna do opcji Typ: liczba od 1 do 10 (bez 10).
Wartość domyślna: obliczone.
|
| vAxis.gridlines.minSpacing |
Minimalna przestrzeń ekranu (w pikselach) między głównymi liniami siatki na osi HAx.
Wartość domyślna głównych linii siatki to Typ: liczba
Wartość domyślna: obliczone.
|
| vAxis.gridlines.multiple |
Wszystkie wartości linii siatki i znaczników muszą być wielokrotnościami wartości tej opcji. Pamiętaj, że w przeciwieństwie do interwałów potęga dziesięciokrotnej wielokrotności nie jest uwzględniana.
Możesz więc wymuszać, aby znaczniki były liczbami całkowitymi, określając wartość Typ: liczba
Wartość domyślna: 1
|
| vAxis.gridlines.units |
Zastępuje domyślny format różnych aspektów typów danych daty, daty, godziny i godziny, gdy są używane z liniami siatki obliczonymi na wykresie. Umożliwia formatowanie lat, miesięcy, dni, godzin, minut, sekund i milisekund. Ogólny format to:
gridlines: {
units: {
years: {format: [/*format strings here*/]},
months: {format: [/*format strings here*/]},
days: {format: [/*format strings here*/]},
hours: {format: [/*format strings here*/]},
minutes: {format: [/*format strings here*/]},
seconds: {format: [/*format strings here*/]},
milliseconds: {format: [/*format strings here*/]}
}
}
Więcej informacji znajdziesz w sekcji Daty i godziny. Typ: obiekt
Wartość domyślna:null
|
| vAxis.minorGridlines |
Obiekt z elementami umożliwiającymi konfigurowanie podrzędnych linii siatki na osi pionowej, podobnie jak w przypadku opcji vAxis.gridlines. Typ: obiekt
Wartość domyślna:null
|
| vAxis.minorGridlines.color |
Kolor pionowych podrzędnych linii siatki w obszarze wykresu. Podaj prawidłowy ciąg znaków HTML koloru. Typ: ciąg znaków
Domyślny: połączenie koloru linii siatki i koloru tła.
|
| vAxis.minorGridlines.count |
Opcja MinGridlines.count jest obecnie głównie wycofywana. Wyjątkiem jest wyłączanie podrzędnych linii siatki przez ustawienie wartości licznika na 0. Liczba mniejszych linii siatki zależy od odstępu między głównymi liniami siatki (patrz: vAxis.gridlines.interval) i minimalnej wymaganej przestrzeni (patrz vAxis.minorGridlines.minSpacing). Typ: liczba
Wartość domyślna: 1
|
| vAxis.minorGridlines.interval |
Opcja MinGridlines.interval jest podobna do opcji interwału większych linii siatki, ale wybrany przedział będzie zawsze równy dzielnikowi większej linii siatki.
Domyślny interwał dla skal liniowych to Typ: liczba
Wartość domyślna: 1
|
| vAxis.minorGridlines.minSpacing |
Minimalna wymagana ilość miejsca (w pikselach) między sąsiednimi mniejszymi liniami siatki oraz między mniejszymi i głównymi liniami siatki. Wartość domyślna to 1/2 minSpacing głównych linii siatki dla skal liniowych i 1/5 minSpacing dla skal logicznych. Typ: liczba
Default (wartość domyślna): obliczone
|
| vAxis.minorGridlines.multiple |
Tak samo jak w przypadku głównych Typ: liczba
Wartość domyślna: 1
|
| vAxis.minorGridlines.units |
Zastępuje domyślny format różnych aspektów danych typu data, godzina i godzina w przypadku używania z wykresami podrzędnymi obliczonymi na wykresie. Umożliwia formatowanie lat, miesięcy, dni, godzin, minut, sekund i milisekund. Ogólny format to:
gridlines: {
units: {
years: {format: [/*format strings here*/]},
months: {format: [/*format strings here*/]},
days: {format: [/*format strings here*/]}
hours: {format: [/*format strings here*/]}
minutes: {format: [/*format strings here*/]}
seconds: {format: [/*format strings here*/]},
milliseconds: {format: [/*format strings here*/]},
}
}
Więcej informacji znajdziesz w sekcji Daty i godziny. Typ: obiekt
Wartość domyślna:null
|
| vAxis.logScale |
Jeśli ma wartość prawda, oś pionowa jest skalą logarytmiczną. Uwaga: wszystkie wartości muszą być dodatnie. Typ: wartość logiczna
Wartość domyślna: fałsz.
|
| vAxis.scaleType |
Właściwość
Ta opcja jest obsługiwana tylko w przypadku osi Typ: ciąg znaków
Wartość domyślna:null
|
| vAxis.textPosition |
Położenie tekstu na osi pionowej względem obszaru wykresu. Obsługiwane wartości: „out”, „in”, „none”. Typ: ciąg znaków
Domyślnie: „out”
|
| vAxis.textStyle |
Obiekt określający styl tekstu osi pionowej. Obiekt ma ten format:
{ color: <string>,
fontName: <string>,
fontSize: <number>,
bold: <boolean>,
italic: <boolean> }
Typ: obiekt
Domyślnie:
{color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
|
| vAxis.ticks |
Zastępuje automatycznie wygenerowane znaczniki osi Y określoną tablicą. Każdy element tablicy powinien być prawidłową wartością znacznika (np. liczba, data, data i godzina lub godzina) albo obiektem. Jeśli jest to obiekt, powinien mieć właściwość
Pole viewWindow zostanie automatycznie rozwinięte i będzie zawierać minimalną i maksymalną liczbę taktów, chyba że określisz Przykłady:
Typ: tablica elementów.
Domyślnie automatycznie
|
| vAxis.title |
Właściwość Typ: ciąg znaków
Domyślnie bez tytułu.
|
| vAxis.titleTextStyle |
Obiekt określający styl tekstu tytułu osi pionowej. Obiekt ma ten format:
{ color: <string>,
fontName: <string>,
fontSize: <number>,
bold: <boolean>,
italic: <boolean> }
Typ: obiekt
Domyślnie:
{color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
|
| vAxis.maxValue |
Przenosi maksymalną wartość osi pionowej do określonej wartości. Na większości wykresów wartość ta będzie wyższa. Ignorowana, jeśli ustawiona jest wartość mniejsza niż maksymalna wartość „y” danych.
Typ: liczba
Domyślne:automatyczne
|
| vAxis.minValue |
Przenosi minimalną wartość osi pionowej do określonej wartości. Na większości wykresów będzie to zmiana w dół. Ignorowana, jeśli ustawiona jest wartość większa niż minimalna wartość y danych.
Typ: liczba
Wartość domyślna:null
|
| vAxis.viewWindowMode |
Określa, jak skalować oś pionową, by renderować wartości na obszarze wykresu. Obsługiwane są te wartości ciągów:
Typ: ciąg znaków
Domyślnie: odpowiednik „ładne”. Jednak jeśli są używane, pierwszeństwo mają
vaxis.viewWindow.min i vaxis.viewWindow.max.
|
| vAxis.viewWindow |
Określa zakres przycięcia osi pionowej. Typ: obiekt
Wartość domyślna:null
|
| vAxis.viewWindow.max |
Maksymalna wartość danych pionowych do renderowania. Ignorowana, gdy atrybut Typ: liczba
Domyślnie automatycznie
|
| vAxis.viewWindow.min |
Minimalna wartość danych pionowych do renderowania. Ignorowana, gdy atrybut Typ: liczba
Domyślnie automatycznie
|
| szerokość |
Szerokość wykresu w pikselach. Typ: liczba
Domyślna: szerokość elementu nadrzędnego.
|
Metody
| Metoda | |
|---|---|
draw(data, options) |
Rysuje wykres. Wykres akceptuje kolejne wywołania metod dopiero po wywołaniu zdarzenia Return Type: brak
|
getAction(actionID) |
Zwraca obiekt działania etykietki z żądanym obiektem Return Type: (Typ zwracania): obiekt
|
getBoundingBox(id) |
Zwraca obiekt zawierający lewo, górę, szerokość i wysokość elementu wykresu
Wartości odnoszą się do kontenera wykresu. Wywołuj je po narysowaniu wykresu. Return Type: (Typ zwracania): obiekt
|
getChartAreaBoundingBox() |
Zwraca obiekt zawierający lewo, górę, szerokość i wysokość zawartości wykresu (tj. bez etykiet i legendy):
Wartości odnoszą się do kontenera wykresu. Wywołuj je po narysowaniu wykresu. Return Type: (Typ zwracania): obiekt
|
getChartLayoutInterface() |
Zwraca obiekt zawierający informacje o pozycji na ekranie wykresu i jego elementów. W przypadku zwróconego obiektu można wywołać te metody:
Wywołuj je po narysowaniu wykresu. Return Type: (Typ zwracania): obiekt
|
getHAxisValue(xPosition, optional_axis_index) |
Zwraca poziomą wartość danych w punkcie Przykład: Wywołuj je po narysowaniu wykresu. Return Type: (Typ zwrotu): liczba
|
getImageURI() |
Zwraca wykres zserializowany jako identyfikator URI obrazu. Wywołuj je po narysowaniu wykresu. Zobacz Drukowanie wykresów PNG. Return Type: (Typ zwracania): ciąg znaków
|
getSelection() |
Zwraca tablicę wybranych elementów wykresu.
Elementy, które można wybrać, to punkty, paski, kroki, adnotacje, wpisy z legendy i kategorie.
Punkt, słupek, krok lub adnotacja odpowiada komórce w tabeli danych, wpisowi legendy w kolumnie (indeks wiersza ma wartość null) i kategorii wiersza (indeks kolumny ma wartość null).
Na tym wykresie w danym momencie można wybrać tylko 1 element.
Return Type: tablica elementów zaznaczenia.
|
getVAxisValue(yPosition, optional_axis_index) |
Zwraca pionową wartość danych przy Przykład: Wywołuj je po narysowaniu wykresu. Return Type: (Typ zwrotu): liczba
|
getXLocation(dataValue, optional_axis_index) |
Zwraca współrzędną X piksela dla elementu Przykład: Wywołuj je po narysowaniu wykresu. Return Type: (Typ zwrotu): liczba
|
getYLocation(dataValue, optional_axis_index) |
Zwraca współrzędną Y piksela ( Przykład: Wywołuj je po narysowaniu wykresu. Return Type: (Typ zwrotu): liczba
|
removeAction(actionID) |
Usuwa z wykresu działanie etykietki z żądanym elementem Typ zwrotu:
none |
setAction(action) |
Ustawia działanie etykietki, które ma być wykonywane po kliknięciu tekstu działania przez użytkownika.
Metoda
Przed wywołaniem metody Typ zwrotu:
none |
setSelection() |
Wybiera określone elementy wykresu. Anuluje wcześniejszy wybór.
Elementy, które można wybrać, to punkty, paski, kroki, adnotacje, wpisy z legendy i kategorie.
Punkt, słupek, krok lub adnotacja odpowiada komórce w tabeli danych, wpisowi legendy w kolumnie (indeks wiersza ma wartość null) i kategorii wiersza (indeks kolumny ma wartość null).
Na tym wykresie można wybrać tylko 1 element naraz.
Return Type: brak
|
clearChart() |
Czyści wykres i zwalnia wszystkie przydzielone Ci zasoby. Return Type: brak
|
Zdarzenia
Więcej informacji o korzystaniu z tych zdarzeń znajdziesz w artykułach Podstawowa interaktywność, Obsługa zdarzeń i Uruchamianie zdarzeń.
| Nazwa | |
|---|---|
animationfinish |
Uruchamiane po zakończeniu animacji przejścia. Właściwości: brak
|
click |
Uruchamiane, gdy użytkownik kliknie wykres. Pozwala określić, kiedy klikane są tytuł, elementy danych, wpisy legendy, osie, linie siatki lub etykiety. Właściwości: targetID
|
error |
Uruchamiane, gdy podczas próby wyrenderowania wykresu wystąpi błąd. Właściwości: identyfikator, komunikat
|
legendpagination |
Uruchamiane, gdy użytkownik kliknie strzałki podziału na strony w legendzie. Zwraca bieżący indeks stron legendy liczony od zera oraz łączną liczbę stron. Właściwości: currentPageIndex, totalPages
|
onmouseover |
Uruchamiane, gdy użytkownik najedzie kursorem na element wizualny. Przekazuje z powrotem indeksy wierszy i kolumn odpowiedniego elementu tabeli danych. Właściwości: wiersz, kolumna
|
onmouseout |
Uruchamiane, gdy użytkownik najedzie kursorem poza obiekt wizualny. Przekazuje z powrotem indeksy wierszy i kolumn odpowiedniego elementu tabeli danych. Właściwości: wiersz, kolumna
|
ready |
Wykres jest gotowy do obsługi wywołań metod zewnętrznych. Jeśli chcesz korzystać z wykresu i metod wywołań po jego narysowaniu, skonfiguruj detektor tego zdarzenia przed wywołaniem metody Właściwości: brak
|
select |
Uruchamiane, gdy użytkownik kliknie element wizualny. Aby dowiedzieć się, co zostało wybrane, zadzwoń pod numer Właściwości: brak
|
Zasady dotyczące danych
Cały kod i dane są przetwarzane i renderowane w przeglądarce. Żadne dane nie są wysyłane na żaden serwer.