Class AreaChartBuilder

AreaChartBuilder

Trình tạo biểu đồ vùng. Để biết thêm chi tiết, hãy xem tài liệu về Google Biểu đồ.

Dưới đây là ví dụ minh hoạ cách tạo biểu đồ vùng.

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

Phương thức

Phương thứcLoại dữ liệu trả vềMô tả ngắn
build()ChartTạo biểu đồ.
reverseCategories()AreaChartBuilderĐảo ngược bản vẽ của chuỗi dữ liệu trên trục miền.
setBackgroundColor(cssValue)AreaChartBuilderĐặt màu nền cho biểu đồ.
setColors(cssValues)AreaChartBuilderĐặt màu cho các đường trong biểu đồ.
setDataSourceUrl(url)AreaChartBuilderĐặt URL nguồn dữ liệu dùng để lấy dữ liệu từ một nguồn bên ngoài, chẳng hạn như Google Trang tính.
setDataTable(tableBuilder)AreaChartBuilderĐặt bảng dữ liệu để sử dụng cho biểu đồ bằng cách sử dụng DataTableBuilder.
setDataTable(table)AreaChartBuilderThiết lập bảng dữ liệu chứa các đường cho biểu đồ, cũng như các nhãn trục X.
setDataViewDefinition(dataViewDefinition)AreaChartBuilderĐặt định nghĩa chế độ xem dữ liệu để sử dụng cho biểu đồ.
setDimensions(width, height)AreaChartBuilderĐặt phương diện cho biểu đồ.
setLegendPosition(position)AreaChartBuilderĐặt vị trí của chú giải tương ứng với biểu đồ.
setLegendTextStyle(textStyle)AreaChartBuilderĐặt kiểu văn bản của phần chú thích biểu đồ.
setOption(option, value)AreaChartBuilderĐặt các tuỳ chọn nâng cao cho biểu đồ này.
setPointStyle(style)AreaChartBuilderĐặt kiểu cho các điểm trong đường kẻ.
setRange(start, end)AreaChartBuilderĐặt dải ô cho biểu đồ.
setStacked()AreaChartBuilderSử dụng các đường xếp chồng, nghĩa là các giá trị đường và thanh được xếp chồng (tích luỹ).
setTitle(chartTitle)AreaChartBuilderĐặt tiêu đề của biểu đồ.
setTitleTextStyle(textStyle)AreaChartBuilderĐặt kiểu văn bản cho tiêu đề biểu đồ.
setXAxisTextStyle(textStyle)AreaChartBuilderĐặt kiểu văn bản trục hoành.
setXAxisTitle(title)AreaChartBuilderThêm tiêu đề vào trục hoành.
setXAxisTitleTextStyle(textStyle)AreaChartBuilderĐặt kiểu văn bản tiêu đề trục hoành.
setYAxisTextStyle(textStyle)AreaChartBuilderĐặt kiểu văn bản trục tung.
setYAxisTitle(title)AreaChartBuilderThêm tiêu đề vào trục tung.
setYAxisTitleTextStyle(textStyle)AreaChartBuilderĐặt kiểu văn bản tiêu đề trục tung.
useLogScale()AreaChartBuilderChuyển trục phạm vi thành thang logarit (yêu cầu tất cả các giá trị phải là số dương).

Tài liệu chi tiết

build()

Tạo biểu đồ.

Cầu thủ trả bóng

Chart – Một đối tượng Biểu đồ có thể được nhúng vào tài liệu, thành phần trên giao diện người dùng hoặc dùng làm đối tượng tĩnh hình ảnh.


reverseCategories()

Đảo ngược bản vẽ của chuỗi dữ liệu trên trục miền. Đối với biểu đồ theo phạm vi dọc (chẳng hạn như biểu đồ đường, biểu đồ vùng hoặc biểu đồ cột), tức là trục hoành được vẽ từ phải sang trái. Cho biểu đồ có phạm vi ngang (chẳng hạn như biểu đồ thanh), điều này có nghĩa là trục tung được vẽ từ trên xuống dưới cùng. Đối với biểu đồ hình tròn, điều này có nghĩa là các lát được vẽ ngược chiều kim đồng hồ.

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

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setBackgroundColor(cssValue)

Đặt màu nền cho biểu đồ.

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

Tham số

TênLoạiMô tả
cssValueStringGiá trị CSS cho màu sắc (chẳng hạn như "blue" hoặc "#00f").

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setColors(cssValues)

Đặt màu cho các đường trong biểu đồ.

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

Tham số

TênLoạiMô tả
cssValuesString[]Một mảng giá trị CSS màu, chẳng hạn như ["red", "#acf"]. Phần tử thứ n trong mảng biểu thị màu của dòng thứ n trong biểu đồ.

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setDataSourceUrl(url)

Đặt URL nguồn dữ liệu dùng để lấy dữ liệu từ một nguồn bên ngoài, chẳng hạn như Google Trang tính. Nếu cung cấp URL nguồn dữ liệu và DataTable, thì URL nguồn dữ liệu sẽ bị bỏ qua.

Để biết thêm thông tin về cách truy vấn nguồn dữ liệu, hãy xem tài liệu về Google Biểu đồ.

Tham số

TênLoạiMô tả
urlStringURL nguồn dữ liệu, bao gồm mọi tham số truy vấn.

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setDataTable(tableBuilder)

Đặt bảng dữ liệu để sử dụng cho biểu đồ bằng cách sử dụng DataTableBuilder. Đây là một phương thức thuận tiện để thiết lập bảng dữ liệu mà không cần gọi build().

Tham số

TênLoạiMô tả
tableBuilderDataTableBuilderTrình tạo bảng dữ liệu. Một bảng dữ liệu mới được tạo ngay lập tức trong quá trình này nên mọi thông tin cập nhật khác đối với trình tạo sẽ không được phản ánh trong biểu đồ.

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setDataTable(table)

Thiết lập bảng dữ liệu chứa các đường cho biểu đồ, cũng như các nhãn trục X. Chiến lược phát hành đĩa đơn cột đầu tiên phải là một chuỗi và chứa các nhãn trục hoành. Số lượng cột bất kỳ có thể theo, tất cả đều phải là số. Mỗi cột được hiển thị dưới dạng một dòng riêng biệt.

Tham số

TênLoạiMô tả
tableDataTableSourceBảng dữ liệu để sử dụng cho biểu đồ.

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setDataViewDefinition(dataViewDefinition)

Đặt định nghĩa chế độ xem dữ liệu để sử dụng cho biểu đồ.

Tham số

TênLoạiMô tả
dataViewDefinitionDataViewDefinitionĐối tượng định nghĩa khung hiển thị dữ liệu xác định khung hiển thị cần được bắt nguồn từ nguồn dữ liệu đã cho cho bản vẽ biểu đồ.

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setDimensions(width, height)

Đặt phương diện cho biểu đồ.

Tham số

TênLoạiMô tả
widthIntegerChiều rộng của biểu đồ, tính bằng pixel.
heightIntegerChiều cao của biểu đồ, tính bằng pixel.

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setLegendPosition(position)

Đặt vị trí của chú giải tương ứng với biểu đồ. Theo mặc định, không có chú giải.

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

Tham số

TênLoạiMô tả
positionPositionVị trí của chú giải.

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setLegendTextStyle(textStyle)

Đặt kiểu văn bản của phần chú thích biểu đồ.

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

Tham số

TênLoạiMô tả
textStyleTextStyleKiểu văn bản sử dụng cho chú thích biểu đồ.

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setOption(option, value)

Đặt các tuỳ chọn nâng cao cho biểu đồ này. Xem các lựa chọn có sẵn cho biểu đồ này. Phương thức này không có hiệu lực nếu tuỳ chọn đã cho không hợp lệ.

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

Tham số

TênLoạiMô tả
optionStringTuỳ chọn để đặt.
valueObjectGiá trị cần đặt.

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setPointStyle(style)

Đặt kiểu cho các điểm trong đường kẻ. Theo mặc định, các điểm không có kiểu cụ thể và chỉ dòng có thể nhìn thấy.

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

Tham số

TênLoạiMô tả
stylePointStyleKiểu sử dụng cho các điểm trong đường kẻ.

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.

Xem thêm


setRange(start, end)

Đặt dải ô cho biểu đồ.

Nếu có bất kỳ điểm dữ liệu nào nằm ngoài phạm vi, phạm vi sẽ được mở rộng để bao gồm các điểm dữ liệu đó .

Tham số

TênLoạiMô tả
startNumberGiá trị cho đường lưới thấp nhất của trục phạm vi.
endNumberGiá trị cho đường lưới cao nhất của trục phạm vi.

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setStacked()

Sử dụng các đường xếp chồng, nghĩa là các giá trị đường và thanh được xếp chồng (tích luỹ). Theo mặc định, sẽ không có hiện tượng xếp chồng.

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setTitle(chartTitle)

Đặt tiêu đề của biểu đồ. Tiêu đề được hiển thị ở chính giữa phía trên biểu đồ.

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

Tham số

TênLoạiMô tả
chartTitleStringtiêu đề biểu đồ.

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setTitleTextStyle(textStyle)

Đặt kiểu văn bản cho tiêu đề biểu đồ.

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

Tham số

TênLoạiMô tả
textStyleTextStyleKiểu văn bản sử dụng cho tiêu đề biểu đồ. Bạn có thể tạo đối tượng TextStyleBuilder bằng cách gọi Charts.newTextStyle().

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setXAxisTextStyle(textStyle)

Đặt kiểu văn bản trục hoành.

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

Tham số

TênLoạiMô tả
textStyleTextStyleKiểu văn bản sử dụng cho tiêu đề trục hoành. Bạn có thể tạo đối tượng TextStyleBuilder bằng cách gọi Charts.newTextStyle().

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setXAxisTitle(title)

Thêm tiêu đề vào trục hoành. Tiêu đề được căn giữa và xuất hiện bên dưới giá trị trục .

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

Tham số

TênLoạiMô tả
titleStringTiêu đề cho trục X.

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setXAxisTitleTextStyle(textStyle)

Đặt kiểu văn bản tiêu đề trục hoành.

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

Tham số

TênLoạiMô tả
textStyleTextStyleKiểu văn bản sử dụng cho tiêu đề trục hoành. Bạn có thể tạo đối tượng TextStyleBuilder bằng cách gọi Charts.newTextStyle().

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setYAxisTextStyle(textStyle)

Đặt kiểu văn bản trục tung.

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

Tham số

TênLoạiMô tả
textStyleTextStyleKiểu văn bản sử dụng cho tiêu đề trục hoành. Bạn có thể tạo đối tượng TextStyleBuilder bằng cách gọi Charts.newTextStyle().

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setYAxisTitle(title)

Thêm tiêu đề vào trục tung. Tiêu đề được căn giữa và xuất hiện ở bên trái của giá trị .

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

Tham số

TênLoạiMô tả
titleStringTiêu đề cho trục Y.

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


setYAxisTitleTextStyle(textStyle)

Đặt kiểu văn bản tiêu đề trục tung.

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

Tham số

TênLoạiMô tả
textStyleTextStyleKiểu văn bản sử dụng cho tiêu đề trục hoành. Bạn có thể tạo đối tượng TextStyleBuilder bằng cách gọi Charts.newTextStyle().

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.


useLogScale()

Chuyển trục phạm vi thành thang logarit (yêu cầu tất cả các giá trị phải là số dương). Phạm vi là trục tung của biểu đồ dọc (chẳng hạn như đường, diện tích hoặc cột) và trục hoành cho biểu đồ ngang (chẳng hạn như thanh).

Cầu thủ trả bóng

AreaChartBuilder – Trình tạo này, hữu ích cho việc tạo chuỗi.