Class ScatterChartBuilder

분산형 차트 빌더입니다. 자세한 내용은 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()`	`Chart`	차트를 빌드합니다.
`setBackgroundColor(cssValue)`	`ScatterChartBuilder`	차트의 배경 색상을 설정합니다.
`setColors(cssValues)`	`ScatterChartBuilder`	차트의 선 색상을 설정합니다.
`setDataSourceUrl(url)`	`ScatterChartBuilder`	Google Sheets와 같은 외부 소스에서 데이터를 가져오는 데 사용되는 데이터 소스 URL을 설정합니다.
`setDataTable(tableBuilder)`	`ScatterChartBuilder`	DataTableBuilder를 사용하여 차트에 사용할 데이터 테이블을 설정합니다.
`setDataTable(table)`	`ScatterChartBuilder`	차트의 선과 X축 라벨이 포함된 데이터 테이블을 설정합니다.
`setDataViewDefinition(dataViewDefinition)`	`ScatterChartBuilder`	차트에 사용할 데이터 뷰 정의를 설정합니다.
`setDimensions(width, height)`	`ScatterChartBuilder`	차트의 크기를 설정합니다.
`setLegendPosition(position)`	`ScatterChartBuilder`	차트를 기준으로 범례의 위치를 설정합니다.
`setLegendTextStyle(textStyle)`	`ScatterChartBuilder`	차트 범례의 텍스트 스타일을 설정합니다.
`setOption(option, value)`	`ScatterChartBuilder`	이 차트의 고급 옵션을 설정합니다.
`setPointStyle(style)`	`ScatterChartBuilder`	선에 있는 점의 스타일을 설정합니다.
`setTitle(chartTitle)`	`ScatterChartBuilder`	차트의 제목을 설정합니다.
`setTitleTextStyle(textStyle)`	`ScatterChartBuilder`	차트 제목의 텍스트 스타일을 설정합니다.
`setXAxisLogScale()`	`ScatterChartBuilder`	가로축을 로그 스케일로 만듭니다 (모든 값이 양수여야 함).
`setXAxisRange(start, end)`	`ScatterChartBuilder`	차트의 가로축 범위를 설정합니다.
`setXAxisTextStyle(textStyle)`	`ScatterChartBuilder`	가로축 텍스트 스타일을 설정합니다.
`setXAxisTitle(title)`	`ScatterChartBuilder`	가로축에 제목을 추가합니다.
`setXAxisTitleTextStyle(textStyle)`	`ScatterChartBuilder`	가로축 제목 텍스트 스타일을 설정합니다.
`setYAxisLogScale()`	`ScatterChartBuilder`	세로축을 로그 스케일로 만듭니다 (모든 값이 양수여야 함).
`setYAxisRange(start, end)`	`ScatterChartBuilder`	차트의 세로축 범위를 설정합니다.
`setYAxisTextStyle(textStyle)`	`ScatterChartBuilder`	세로축 텍스트 스타일을 설정합니다.
`setYAxisTitle(title)`	`ScatterChartBuilder`	세로축에 제목을 추가합니다.
`setYAxisTitleTextStyle(textStyle)`	`ScatterChartBuilder`	세로축 제목 텍스트 스타일을 설정합니다.

자세한 문서

`build()`

차트를 빌드합니다.

리턴

Chart - 문서나 UI 요소에 삽입하거나 정적 이미지로 사용할 수 있는 차트 객체입니다.

`setBackgroundColor(cssValue)`

차트의 배경 색상을 설정합니다.

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

매개변수

이름	유형	설명
`cssValue`	`String`	색상의 CSS 값 (예: `"blue"` 또는 `"#00f"`)

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setColors(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']);

매개변수

이름	유형	설명
`cssValues`	`String[]`	`["red", "#acf"]`와 같은 색상 CSS 값의 배열입니다. 배열의 n번째 요소는 차트의 n번째 선의 색상을 나타냅니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setDataSourceUrl(url)`

Google Sheets와 같은 외부 소스에서 데이터를 가져오는 데 사용되는 데이터 소스 URL을 설정합니다. 데이터 소스 URL과 DataTable이 제공되면 데이터 소스 URL은 무시됩니다.

데이터 소스 쿼리에 대한 자세한 내용은 Google 차트 문서를 참고하세요.

매개변수

이름	유형	설명
`url`	`String`	쿼리 매개변수를 포함한 데이터 소스 URL입니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setDataTable(tableBuilder)`

DataTableBuilder를 사용하여 차트에 사용할 데이터 테이블을 설정합니다. build()를 호출하지 않고 데이터 테이블을 설정하는 편리한 방법입니다.

매개변수

이름	유형	설명
`tableBuilder`	`DataTableBuilder`	데이터 테이블 빌더입니다. 이 호출의 일부로 새 데이터 테이블이 즉시 생성되므로 빌더에 대한 추가 업데이트는 차트에 반영되지 않습니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setDataTable(table)`

차트의 선과 X축 라벨이 포함된 데이터 테이블을 설정합니다. 첫 번째 열은 문자열이어야 하며 가로축 라벨을 포함해야 합니다. 숫자 열이 여러 개 올 수 있습니다. 각 열은 별도의 행으로 표시됩니다.

매개변수

이름	유형	설명
`table`	`DataTableSource`	차트에 사용할 데이터 테이블입니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setDataViewDefinition(dataViewDefinition)`

차트에 사용할 데이터 뷰 정의를 설정합니다.

매개변수

이름	유형	설명
`dataViewDefinition`	`DataViewDefinition`	차트 그리기를 위해 지정된 데이터 소스에서 파생되어야 하는 뷰를 정의하는 데이터 뷰 정의 객체입니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setDimensions(width, height)`

차트의 크기를 설정합니다.

매개변수

이름	유형	설명
`width`	`Integer`	차트의 너비(픽셀)입니다.
`height`	`Integer`	차트의 높이(픽셀)입니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setLegendPosition(position)`

차트를 기준으로 범례의 위치를 설정합니다. 기본적으로 범례는 없습니다.

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

매개변수

이름	유형	설명
`position`	`Position`	범례의 위치입니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setLegendTextStyle(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);

매개변수

이름	유형	설명
`textStyle`	`TextStyle`	차트 범례에 사용할 텍스트 스타일입니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setOption(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`	설정할 값입니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setPointStyle(style)`

선에 있는 점의 스타일을 설정합니다. 기본적으로 점에는 특별한 스타일이 없으며 선만 표시됩니다.

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

매개변수

이름	유형	설명
`style`	`PointStyle`	선에서 점에 사용할 스타일입니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

참고 항목

PointStyle

`setTitle(chartTitle)`

차트의 제목을 설정합니다. 제목은 차트 위 중앙에 표시됩니다.

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

매개변수

이름	유형	설명
`chartTitle`	`String`	차트 제목

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setTitleTextStyle(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);

매개변수

이름	유형	설명
`textStyle`	`TextStyle`	차트 제목에 사용할 텍스트 스타일입니다. `Charts.newTextStyle()`를 호출하여 `TextStyleBuilder` 객체를 만들 수 있습니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setXAxisLogScale()`

가로축을 로그 스케일로 만듭니다 (모든 값이 양수여야 함).

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setXAxisRange(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`	가로축의 가장 높은 그리드 선의 값입니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setXAxisTextStyle(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);

매개변수

이름	유형	설명
`textStyle`	`TextStyle`	가로축 제목에 사용할 텍스트 스타일입니다. `Charts.newTextStyle()`를 호출하여 `TextStyleBuilder` 객체를 만들 수 있습니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setXAxisTitle(title)`

가로축에 제목을 추가합니다. 제목은 가운데에 배치되며 축 값 라벨 아래에 표시됩니다.

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

매개변수

이름	유형	설명
`title`	`String`	X축의 제목입니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setXAxisTitleTextStyle(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);

매개변수

이름	유형	설명
`textStyle`	`TextStyle`	가로축 제목에 사용할 텍스트 스타일입니다. `Charts.newTextStyle()`를 호출하여 `TextStyleBuilder` 객체를 만들 수 있습니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setYAxisLogScale()`

세로축을 로그 스케일로 만듭니다 (모든 값이 양수여야 함).

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setYAxisRange(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`	세로축의 가장 높은 그리드 선의 값입니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setYAxisTextStyle(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);

매개변수

이름	유형	설명
`textStyle`	`TextStyle`	가로축 제목에 사용할 텍스트 스타일입니다. `Charts.newTextStyle()`를 호출하여 `TextStyleBuilder` 객체를 만들 수 있습니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setYAxisTitle(title)`

세로축에 제목을 추가합니다. 제목은 가운데에 표시되며 값 라벨 왼쪽에 표시됩니다.

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

매개변수

이름	유형	설명
`title`	`String`	Y축의 제목입니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

`setYAxisTitleTextStyle(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);

매개변수

이름	유형	설명
`textStyle`	`TextStyle`	가로축 제목에 사용할 텍스트 스타일입니다. `Charts.newTextStyle()`를 호출하여 `TextStyleBuilder` 객체를 만들 수 있습니다.

리턴

ScatterChartBuilder - 이 빌더(연결에 유용)

Class ScatterChartBuilder 컬렉션을 사용해 정리하기 내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요.

메서드

자세한 문서

build()

리턴

setBackgroundColor(cssValue)

매개변수

리턴

setColors(cssValues)

매개변수

리턴

setDataSourceUrl(url)

매개변수

리턴

setDataTable(tableBuilder)

매개변수

리턴

setDataTable(table)

매개변수

리턴

setDataViewDefinition(dataViewDefinition)

매개변수

리턴

setDimensions(width, height)

매개변수

리턴

setLegendPosition(position)

매개변수

리턴

setLegendTextStyle(textStyle)

매개변수

리턴

setOption(option, value)

매개변수

리턴

setPointStyle(style)

매개변수

리턴

참고 항목

setTitle(chartTitle)

매개변수

리턴

setTitleTextStyle(textStyle)

매개변수

리턴

setXAxisLogScale()

리턴

setXAxisRange(start, end)

매개변수

리턴

setXAxisTextStyle(textStyle)

매개변수

리턴

setXAxisTitle(title)

매개변수

리턴

setXAxisTitleTextStyle(textStyle)

매개변수

리턴

setYAxisLogScale()

리턴

setYAxisRange(start, end)

매개변수

리턴

setYAxisTextStyle(textStyle)

매개변수

리턴

setYAxisTitle(title)

매개변수

리턴

setYAxisTitleTextStyle(textStyle)

매개변수

리턴

Class ScatterChartBuilder

`build()`

`setBackgroundColor(cssValue)`

`setColors(cssValues)`

`setDataSourceUrl(url)`

`setDataTable(tableBuilder)`

`setDataTable(table)`

`setDataViewDefinition(dataViewDefinition)`

`setDimensions(width, height)`

`setLegendPosition(position)`

`setLegendTextStyle(textStyle)`

`setOption(option, value)`

`setPointStyle(style)`

`setTitle(chartTitle)`

`setTitleTextStyle(textStyle)`

`setXAxisLogScale()`

`setXAxisRange(start, end)`

`setXAxisTextStyle(textStyle)`

`setXAxisTitle(title)`

`setXAxisTitleTextStyle(textStyle)`

`setYAxisLogScale()`

`setYAxisRange(start, end)`

`setYAxisTextStyle(textStyle)`

`setYAxisTitle(title)`

`setYAxisTitleTextStyle(textStyle)`