散点图的构建器。如需了解详情,请参阅 Google 图表文档。
以下示例展示了如何构建散点图。数据是从 Google 电子表格导入的。
// Get sample data from a spreadsheet. const dataSourceUrl = 'https://docs.google.com/spreadsheet/tq?range=C1%3AD' + '&key=0Aq4s9w_HxMs7dHpfX05JdmVSb1FpT21sbXd4NVE3UEE&gid=4&headers=-1'; const chartBuilder = Charts.newScatterChart() .setTitle('Adjusted GDP & U.S. Population') .setXAxisTitle('U.S. Population (millions)') .setYAxisTitle('Adjusted GDP ($ billions)') .setDimensions(600, 500) .setLegendPosition(Charts.Position.NONE) .setDataSourceUrl(dataSourceUrl); const chart = chartBuilder.build();
方法
详细文档
build()
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" )。 |
返回
Scatter
- 此构建器适用于链接。
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 条线的颜色。 |
返回
Scatter
- 此构建器适用于链接。
set Data Source Url(url)
设置用于从外部来源(例如 Google 表格)提取数据的数据源网址。如果同时提供了数据源网址和 DataTable,系统会忽略数据源网址。
如需详细了解如何查询数据源,请参阅 Google 图表文档。
参数
名称 | 类型 | 说明 |
---|---|---|
url | String | 数据源网址,包括所有查询参数。 |
返回
Scatter
- 此构建器适用于链接。
set Data Table(tableBuilder)
使用 DataTableBuilder 设置要用于图表的数据表。这是一个便捷方法,可用于设置数据表,而无需调用 build()
。
参数
名称 | 类型 | 说明 |
---|---|---|
table | Data | 数据表构建器。在此调用过程中,系统会立即创建一个新的数据表格,因此对构建器的任何进一步更新都不会反映在图表中。 |
返回
Scatter
- 此构建器适用于链接。
set Data Table(table)
设置包含图表线条和 X 轴标签的数据表。第一列应为字符串,并包含水平轴标签。后面可以跟任意数量的列,所有列都必须是数字。每个列都会显示为单独的一行。
参数
名称 | 类型 | 说明 |
---|---|---|
table | Data | 要用于图表的数据表。 |
返回
Scatter
- 此构建器适用于链接。
set Data View Definition(dataViewDefinition)
设置要用于图表的数据视图定义。
参数
名称 | 类型 | 说明 |
---|---|---|
data | Data | 数据视图定义对象,用于定义应从给定数据源派生以用于图表绘制的视图。 |
返回
Scatter
- 此构建器适用于链接。
set Dimensions(width, height)
设置图表的尺寸。
参数
名称 | 类型 | 说明 |
---|---|---|
width | Integer | 图表的宽度(以像素为单位)。 |
height | Integer | 图表的高度(以像素为单位)。 |
返回
Scatter
- 此构建器适用于链接。
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 | 图例的位置。 |
返回
Scatter
- 此构建器适用于链接。
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 | 要为图表图例使用的文本样式。 |
返回
Scatter
- 此构建器适用于链接。
set Option(option, value)
设置此图表的高级选项。请参阅此图表的可用选项。如果指定的选项无效,此方法将不会产生任何影响。
// Build a scatter chart with a 1-second animation duration. const builder = Charts.newScatterChart(); builder.setOption('animation.duration', 1000); const chart = builder.build();
参数
名称 | 类型 | 说明 |
---|---|---|
option | String | 要设置的选项。 |
value | Object | 要设置的值。 |
返回
Scatter
- 此构建器适用于链接。
set Point Style(style)
设置线条中点的样式。默认情况下,数据点没有特定样式,并且只有线条可见。
// Creates a line chart builder and sets large point style. const builder = Charts.newLineChart(); builder.setPointStyle(Charts.PointStyle.LARGE);
参数
名称 | 类型 | 说明 |
---|---|---|
style | Point | 用于线条中点的样式。 |
返回
Scatter
- 此构建器适用于链接。
另请参阅
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 | 图表标题。 |
返回
Scatter
- 此构建器适用于链接。
set TitleTextStyle(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 | 要为图表标题使用的文本样式。您可以通过调用 Charts.newTextStyle() 来创建 Text 对象。 |
返回
Scatter
- 此构建器适用于链接。
set XAxis Log Scale()
set XAxis Range(start, end)
设置图表横轴的范围。
如果有任何数据点超出范围,系统会扩大范围以涵盖这些数据点。
// Creates a scatter chart builder and sets the X-axis range to be 0 to 100. const builder = Charts.newTableChart(); builder.setXAxisRange(0, 100);
参数
名称 | 类型 | 说明 |
---|---|---|
start | Number | 水平轴最下方网格线的值。 |
end | Number | 水平轴上最高网格线的值。 |
返回
Scatter
- 此构建器适用于链接。
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 | 要为横轴标题使用的文本样式。您可以通过调用 Charts.newTextStyle() 来创建 Text 对象。 |
返回
Scatter
- 此构建器适用于链接。
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 轴的标题。 |
返回
Scatter
- 此构建器适用于链接。
set XAxis TitleTextStyle(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 | 要为横轴标题使用的文本样式。您可以通过调用 Charts.newTextStyle() 来创建 Text 对象。 |
返回
Scatter
- 此构建器适用于链接。
set YAxis Log Scale()
set YAxis Range(start, end)
设置图表的纵轴范围。如果有任何数据点超出范围,系统会扩大范围以涵盖这些数据点。
// Creates a scatter chart builder and sets the Y-axis range to be 0 to 100. const builder = Charts.newTableChart(); builder.setYAxisRange(0, 100);
参数
名称 | 类型 | 说明 |
---|---|---|
start | Number | 垂直轴最下方网格的值。 |
end | Number | 垂直轴上最高网格线的值。 |
返回
Scatter
- 此构建器适用于链接。
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 | 要为横轴标题使用的文本样式。您可以通过调用 Charts.newTextStyle() 来创建 Text 对象。 |
返回
Scatter
- 此构建器适用于链接。
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 轴的标题。 |
返回
Scatter
- 此构建器适用于链接。
set YAxis TitleTextStyle(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 | 要为横轴标题使用的文本样式。您可以通过调用 Charts.newTextStyle() 来创建 Text 对象。 |
返回
Scatter
- 此构建器适用于链接。