Class AreaChartBuilder

AreaChartBuilder

Alan grafikleri oluşturucu. Daha ayrıntılı bilgi için Google Grafikler dokümanlarına bakın.

Alan grafiğinin nasıl oluşturulacağını gösteren bir örneği aşağıda bulabilirsiniz.

  // Create a data table with some sample data.
  var sampleData = Charts.newDataTable()
      .addColumn(Charts.ColumnType.STRING, "Month")
      .addColumn(Charts.ColumnType.NUMBER, "Dining")
      .addColumn(Charts.ColumnType.NUMBER, "Total")
      .addRow(["Jan", 60, 520])
      .addRow(["Feb", 50, 430])
      .addRow(["Mar", 53, 440])
      .addRow(["Apr", 70, 410])
      .addRow(["May", 80, 390])
      .addRow(["Jun", 60, 500])
      .addRow(["Jul", 100, 450])
      .addRow(["Aug", 140, 431])
      .addRow(["Sep", 75, 488])
      .addRow(["Oct", 70, 521])
      .addRow(["Nov", 58, 388])
      .addRow(["Dec", 63, 400])
      .build();

  var chart = Charts.newAreaChart()
      .setTitle('Yearly Spending')
      .setXAxisTitle('Month')
      .setYAxisTitle('Spending (USD)')
      .setDimensions(600, 500)
      .setStacked()
      .setColors(['red', 'green'])
      .setDataTable(sampleData)
      .build();

Yöntemler

YöntemDönüş türüKısa açıklama
build()ChartGrafiği oluşturur.
reverseCategories()AreaChartBuilderAlan eksenindeki seri çizimini tersine çevirir.
setBackgroundColor(cssValue)AreaChartBuilderGrafiğin arka plan rengini ayarlar.
setColors(cssValues)AreaChartBuilderGrafikteki çizgilerin renklerini ayarlar.
setDataSourceUrl(url)AreaChartBuilderGoogle E-Tablolar gibi harici bir kaynaktan veri çekmek için kullanılan veri kaynağı URL'sini ayarlar.
setDataTable(tableBuilder)AreaChartBuilderDataTableBuilder kullanarak grafik için kullanılacak veri tablosunu ayarlar.
setDataTable(table)AreaChartBuilderGrafiğin çizgilerini ve X ekseni etiketlerini içeren veri tablosunu ayarlar.
setDataViewDefinition(dataViewDefinition)AreaChartBuilderGrafik için kullanılacak veri görünümü tanımını ayarlar.
setDimensions(width, height)AreaChartBuilderGrafiğin boyutlarını ayarlar.
setLegendPosition(position)AreaChartBuilderGöstergenin grafiğe göre konumunu ayarlar.
setLegendTextStyle(textStyle)AreaChartBuilderGrafik açıklamasının metin stilini ayarlar.
setOption(option, value)AreaChartBuilderBu grafik için gelişmiş seçenekleri belirler.
setPointStyle(style)AreaChartBuilderÇizgideki noktaların stilini ayarlar.
setRange(start, end)AreaChartBuilderGrafik için aralığı ayarlar.
setStacked()AreaChartBuilderYığılmış çizgiler kullanır, yani çizgi ve çubuk değerlerinin yığılması (toplandığı) anlamına gelir.
setTitle(chartTitle)AreaChartBuilderGrafiğin başlığını ayarlar.
setTitleTextStyle(textStyle)AreaChartBuilderGrafik başlığının metin stilini ayarlar.
setXAxisTextStyle(textStyle)AreaChartBuilderYatay eksen metin stilini ayarlar.
setXAxisTitle(title)AreaChartBuilderYatay eksene başlık ekler.
setXAxisTitleTextStyle(textStyle)AreaChartBuilderYatay eksen başlık metin stilini ayarlar.
setYAxisTextStyle(textStyle)AreaChartBuilderDikey eksen metin stilini ayarlar.
setYAxisTitle(title)AreaChartBuilderDikey eksene başlık ekler.
setYAxisTitleTextStyle(textStyle)AreaChartBuilderDikey eksen başlık metin stilini ayarlar.
useLogScale()AreaChartBuilderAralık eksenini logaritmik bir ölçek haline getirir (tüm değerlerin pozitif olması gerekir).

Ayrıntılı belgeler

build()

Grafiği oluşturur.

Return

Chart: Dokümanlara ve kullanıcı arayüzü öğelerine yerleştirilebilen veya statik resim olarak kullanılabilen bir Grafik nesnesidir.


reverseCategories()

Alan eksenindeki seri çizimini tersine çevirir. Dikey aralıklı grafiklerde (çizgi, alan veya sütun grafikler gibi) yatay eksen, sağdan sola doğru çizilir. Bu, yatay aralıklı grafiklerde (çubuk grafikler gibi) dikey eksenin yukarıdan aşağıya doğru çizildiği anlamına gelir. Pasta grafiklerde bu, dilimlerin saat yönünün tersine çizileceği anlamına gelir.

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

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setBackgroundColor(cssValue)

Grafiğin arka plan rengini ayarlar.

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

Parametreler

AdTürAçıklama
cssValueStringRengin CSS değeri ("blue" veya "#00f" gibi).

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setColors(cssValues)

Grafikteki çizgilerin renklerini ayarlar.

// Creates a line chart builder and sets the first two lines to be drawn in green and red,
// respectively.
var builder = Charts.newLineChart();
builder.setColors(["green", "red"]);

Parametreler

AdTürAçıklama
cssValuesString[]["red", "#acf"] gibi renk CSS değerleri dizisi. Dizideki n'inci öğe, grafikteki n'inci çizginin rengini temsil eder.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setDataSourceUrl(url)

Google E-Tablolar gibi harici bir kaynaktan veri çekmek için kullanılan veri kaynağı URL'sini ayarlar. Bir veri kaynağı URL'si ve bir DataTable sağlanırsa veri kaynağı URL'si yoksayılır.

Veri kaynaklarını sorgulama hakkında daha fazla bilgi için Google Grafikler dokümanlarına göz atın.

Parametreler

AdTürAçıklama
urlStringTüm sorgu parametreleri dahil veri kaynağı URL'si.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setDataTable(tableBuilder)

DataTableBuilder kullanarak grafik için kullanılacak veri tablosunu ayarlar. Bu, build() yöntemini çağırmaya gerek kalmadan veri tablosunu ayarlamak için kullanışlı bir yöntemdir.

Parametreler

AdTürAçıklama
tableBuilderDataTableBuilderVeri tablosu oluşturma aracı. Bu çağrı kapsamında anında yeni bir veri tablosu oluşturulur. Bu nedenle, oluşturucuda yapılacak başka güncellemeler grafiğe yansıtılmaz.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setDataTable(table)

Grafiğin çizgilerini ve X ekseni etiketlerini içeren veri tablosunu ayarlar. İlk sütun bir dize olmalı ve yatay eksen etiketlerini içermelidir. Ardından istediğiniz sayıda sütun gelebilir ve bunların tümü sayısal olmalıdır. Her sütun ayrı bir çizgi olarak gösterilir.

Parametreler

AdTürAçıklama
tableDataTableSourceGrafik için kullanılacak veri tablosu.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setDataViewDefinition(dataViewDefinition)

Grafik için kullanılacak veri görünümü tanımını ayarlar.

Parametreler

AdTürAçıklama
dataViewDefinitionDataViewDefinitionGrafik çizimi için belirtilen veri kaynağından türetilmesi gereken görünümü tanımlayan bir veri görünümü tanım nesnesi.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setDimensions(width, height)

Grafiğin boyutlarını ayarlar.

Parametreler

AdTürAçıklama
widthIntegerGrafiğin piksel cinsinden genişliği.
heightIntegerGrafiğin piksel cinsinden yüksekliği.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setLegendPosition(position)

Göstergenin grafiğe göre konumunu ayarlar. Varsayılan olarak gösterge yoktur.

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

Parametreler

AdTürAçıklama
positionPositionAçıklamaların konumu.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setLegendTextStyle(textStyle)

Grafik açıklamasının metin stilini ayarlar.

// Creates a line chart builder and sets it up for a  blue, 26-point legend.
var textStyleBuilder = Charts.newTextStyle().setColor('#0000FF').setFontSize(26);
var style = textStyleBuilder.build();
var builder = Charts.newLineChart();
builder.setLegendTextStyle(style);

Parametreler

AdTürAçıklama
textStyleTextStyleGrafik açıklaması için kullanılacak metin stili.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setOption(option, value)

Bu grafik için gelişmiş seçenekleri belirler. Bu grafik için kullanılabilir seçeneklere bakın. Verilen seçenek geçersizse bu yöntemin hiçbir etkisi olmaz.

// Build an area chart with a 1-second animation duration.
var builder = Charts.newAreaChart();
builder.setOption('animation.duration', 1000);
var chart = builder.build();

Parametreler

AdTürAçıklama
optionStringAyarlama seçeneği.
valueObjectAyarlanacak değer.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setPointStyle(style)

Çizgideki noktaların stilini ayarlar. Varsayılan olarak, noktaların belirli stilleri yoktur ve yalnızca çizgi görünür.

// Creates a line chart builder and sets large point style.
var builder = Charts.newLineChart();
builder.setPointStyle(Charts.PointStyle.LARGE);

Parametreler

AdTürAçıklama
stylePointStyleÇizgideki noktalar için kullanılacak stil.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.

Aşağıdaki kaynakları da incelemenizi öneririz:


setRange(start, end)

Grafik için aralığı ayarlar.

Aralığın dışında kalan veri noktaları varsa aralık, bu veri noktalarını içerecek şekilde genişletilir.

Parametreler

AdTürAçıklama
startNumberAralık ekseninin en düşük ızgara çizgisinin değeri.
endNumberAralık ekseninin en yüksek ızgara çizgisinin değeri.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setStacked()

Yığılmış çizgiler kullanır, yani çizgi ve çubuk değerlerinin yığılması (toplandığı) anlamına gelir. Varsayılan olarak herhangi bir yığma yoktur.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setTitle(chartTitle)

Grafiğin başlığını ayarlar. Başlık, grafiğin üstünde ortalanmış olarak görüntülenir.

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

Parametreler

AdTürAçıklama
chartTitleStringgrafik başlığı.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setTitleTextStyle(textStyle)

Grafik başlığının metin stilini ayarlar.

// Creates a line chart builder and sets it up for a  blue, 26-point title.
var textStyleBuilder = Charts.newTextStyle().setColor('#0000FF').setFontSize(26);
var style = textStyleBuilder.build();
var builder = Charts.newLineChart();
builder.setTitleTextStyle(style);

Parametreler

AdTürAçıklama
textStyleTextStyleGrafik başlığı için kullanılacak metin stili. Charts.newTextStyle() yöntemini çağırarak TextStyleBuilder nesnesi oluşturabilirsiniz.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setXAxisTextStyle(textStyle)

Yatay eksen metin stilini ayarlar.

// Creates a line chart builder and sets the X-axis text style to blue, 18-point font.
var textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build();
var builder = Charts.newLineChart();
builder.setXAxisTextStyle(textStyle);

Parametreler

AdTürAçıklama
textStyleTextStyleYatay eksen başlığı için kullanılacak metin stili. Charts.newTextStyle() yöntemini çağırarak TextStyleBuilder nesnesi oluşturabilirsiniz.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setXAxisTitle(title)

Yatay eksene başlık ekler. Başlık ortalanır ve eksen değeri etiketlerinin altında görünür.

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

Parametreler

AdTürAçıklama
titleStringX ekseninin başlığı.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setXAxisTitleTextStyle(textStyle)

Yatay eksen başlık metin stilini ayarlar.

// Creates a line chart builder and sets the X-axis title text style to blue, 18-point font.
var textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build();
var builder = Charts.newLineChart();
builder.setXAxisTitleTextStyle(textStyle);

Parametreler

AdTürAçıklama
textStyleTextStyleYatay eksen başlığı için kullanılacak metin stili. Charts.newTextStyle() yöntemini çağırarak TextStyleBuilder nesnesi oluşturabilirsiniz.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setYAxisTextStyle(textStyle)

Dikey eksen metin stilini ayarlar.

// Creates a line chart builder and sets the Y-axis text style to blue, 18-point font.
var textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build();
var builder = Charts.newLineChart();
builder.setYAxisTextStyle(textStyle);

Parametreler

AdTürAçıklama
textStyleTextStyleYatay eksen başlığı için kullanılacak metin stili. Charts.newTextStyle() yöntemini çağırarak TextStyleBuilder nesnesi oluşturabilirsiniz.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setYAxisTitle(title)

Dikey eksene başlık ekler. Başlık ortalanır ve değer etiketlerinin sol tarafında görünür.

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

Parametreler

AdTürAçıklama
titleStringY ekseninin başlığı.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


setYAxisTitleTextStyle(textStyle)

Dikey eksen başlık metin stilini ayarlar.

// Creates a line chart builder and sets the Y-axis title text style to blue, 18-point font.
var textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build();
var builder = Charts.newLineChart();
builder.setYAxisTitleTextStyle(textStyle);

Parametreler

AdTürAçıklama
textStyleTextStyleYatay eksen başlığı için kullanılacak metin stili. Charts.newTextStyle() yöntemini çağırarak TextStyleBuilder nesnesi oluşturabilirsiniz.

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.


useLogScale()

Aralık eksenini logaritmik bir ölçek haline getirir (tüm değerlerin pozitif olması gerekir). Aralık ekseni, dikey grafikler için dikey eksen (çizgi, alan veya sütun gibi), yatay grafikler içinse yatay eksendir (çubuk gibi).

Return

AreaChartBuilder: Bu oluşturucu, zincirleme bağlantı için kullanışlıdır.