이 서비스를 사용하면 사용자가 Google 차트 도구를 사용하여 차트를 만들고 서버 측에서 렌더링할 수 있습니다. 웹브라우저에서 차트를 렌더링하려면 Google Charts API를 대신 사용하세요.
이 예에서는 기본 데이터 표를 만들고, 면적 차트에 데이터를 채우고, 웹페이지에 이미지로 추가합니다.
function doGet() {
var data = Charts.newDataTable()
.addColumn(Charts.ColumnType.STRING, 'Month')
.addColumn(Charts.ColumnType.NUMBER, 'In Store')
.addColumn(Charts.ColumnType.NUMBER, 'Online')
.addRow(['January', 10, 1])
.addRow(['February', 12, 1])
.addRow(['March', 20, 2])
.addRow(['April', 25, 3])
.addRow(['May', 30, 4])
.build();
var chart = Charts.newAreaChart()
.setDataTable(data)
.setStacked()
.setRange(0, 40)
.setTitle('Sales per Month')
.build();
var htmlOutput = HtmlService.createHtmlOutput().setTitle('My Chart');
var imageData = Utilities.base64Encode(chart.getAs('image/png').getBytes());
var imageUrl = "data:image/png;base64," + encodeURI(imageData);
htmlOutput.append("Render chart server side: <br/>");
htmlOutput.append("<img border=\"1\" src=\"" + imageUrl + "\">");
return htmlOutput;
}
클래스
이름 | 간략한 설명 |
---|---|
Area | 영역 차트의 빌더입니다. |
Bar | 막대 그래프 빌더입니다. |
Chart | 정적 이미지로 변환할 수 있는 차트 객체입니다. |
Chart | 소스의 숨겨진 측정기준이 차트에 표현되는 방식을 열거합니다. |
Chart | 소스의 여러 범위가 차트에 표현되는 방식을 열거합니다. |
Chart | 높이, 색상 등 Chart 에 현재 구성된 옵션을 노출합니다. |
Chart | 차트 서비스에서 지원하는 차트 유형입니다. |
Charts | 스크립트에서 차트를 만드는 진입점입니다. |
Column | 열 차트의 빌더입니다. |
Column | Data 의 열에 유효한 데이터 유형의 열거형입니다. |
Curve | 차트의 곡선 스타일의 열거입니다. |
Data | 차트에 사용할 데이터 표입니다. |
Data | DataTable 객체의 빌더입니다. |
Data | 데이터를 Data 로 나타낼 수 있는 객체의 인터페이스입니다. |
Data | 차트 데이터를 시각화하기 위한 데이터 뷰 정의입니다. |
Data | Data 객체의 빌더입니다. |
Line | 선 차트의 빌더입니다. |
Match | 문자열 값을 일치시킬 방법을 열거한 값입니다. |
Number | 숫자 범위 필터 컨트롤의 빌더입니다. |
Orientation | 객체의 방향을 나타내는 열거형입니다. |
Picker | 선택한 값을 선택 도구 위젯에 표시하는 방법을 열거합니다. |
Pie | 원형 차트의 빌더입니다. |
Point | 선의 점 스타일의 열거형입니다. |
Position | 차트 내 범례 위치의 열거형입니다. |
Scatter | 분산형 차트의 빌더입니다. |
String | 문자열 필터 컨트롤의 빌더입니다. |
Table | 테이블 차트의 빌더입니다. |
Text | 텍스트 스타일 구성 객체입니다. |
Text | Text 객체를 만드는 데 사용되는 빌더입니다. |
Area Chart Builder
메서드
Bar Chart Builder
메서드
Chart
메서드
메서드 | 반환 유형 | 간략한 설명 |
---|---|---|
get | Blob | 이 객체 내의 데이터를 지정된 콘텐츠 유형으로 변환된 blob으로 반환합니다. |
get | Blob | 이 객체 내의 데이터를 blob으로 반환합니다. |
get | Chart | 높이, 색상, 축과 같은 이 차트의 옵션을 반환합니다. |
Chart Hidden Dimension Strategy
속성
속성 | 유형 | 설명 |
---|---|---|
IGNORE_BOTH | Enum | 기본값입니다. 차트에서 숨겨진 열과 숨겨진 행을 건너뜁니다. |
IGNORE_ROWS | Enum | 차트는 숨겨진 행만 건너뜁니다. |
IGNORE_COLUMNS | Enum | 차트는 숨겨진 열만 건너뜁니다. |
SHOW_BOTH | Enum | 차트는 숨겨진 열이나 숨겨진 행을 건너뛰지 않습니다. |
Chart Merge Strategy
속성
속성 | 유형 | 설명 |
---|---|---|
MERGE_COLUMNS | Enum | 기본값입니다. |
MERGE_ROWS | Enum | 차트는 여러 범위의 행을 병합합니다. |
Chart Options
메서드
메서드 | 반환 유형 | 간략한 설명 |
---|---|---|
get(option) | Object | 이 차트에 구성된 옵션을 반환합니다. |
get | Object | 이 차트에 구성된 옵션을 반환합니다. |
Chart Type
속성
속성 | 유형 | 설명 |
---|---|---|
TIMELINE | Enum | 타임라인 차트 |
AREA | Enum | 영역 차트 |
BAR | Enum | 막대 그래프 |
BUBBLE | Enum | 풍선형 차트 |
CANDLESTICK | Enum | 원통형 차트 |
COLUMN | Enum | 열 차트 |
COMBO | Enum | 콤보 차트 |
GAUGE | Enum | 게이지 차트 |
GEO | Enum | 지역 차트 |
HISTOGRAM | Enum | 히스토그램 |
RADAR | Enum | 방사형 차트 |
LINE | Enum | 선 차트 |
ORG | Enum | 조직도 |
PIE | Enum | 원형 차트 |
SCATTER | Enum | 분산형 차트 |
SPARKLINE | Enum | 스파크라인 차트 |
STEPPED_AREA | Enum | 계단식 영역 차트 |
TABLE | Enum | 표 차트 |
TREEMAP | Enum | 트리맵 차트 |
WATERFALL | Enum | 폭포식 차트 |
Charts
속성
속성 | 유형 | 설명 |
---|---|---|
Chart | Chart | 소스의 숨겨진 측정기준이 차트에 표현되는 방식을 열거합니다. |
Chart | Chart | 소스의 여러 범위가 차트에 표현되는 방식을 열거합니다. |
Chart | Chart | 차트 서비스에서 지원하는 차트 유형의 열거형입니다. |
Column | Column | Data 의 열에 유효한 데이터 유형의 열거형입니다. |
Curve | Curve | 차트의 곡선 스타일의 열거입니다. |
Point | Point | 선의 점 스타일의 열거형입니다. |
Position | Position | 차트 내 범례 위치의 열거형입니다. |
메서드
메서드 | 반환 유형 | 간략한 설명 |
---|---|---|
new | Area | Google 차트 도구 문서에 설명된 대로 면적 차트 빌드를 시작합니다. |
new | Bar | Google 차트 도구 문서에 설명된 대로 막대 그래프 빌드를 시작합니다. |
new | Column | Google 차트 도구 문서에 설명된 대로 열 차트 빌드를 시작합니다. |
new | Data | 값을 수동으로 설정할 수 있는 빈 데이터 표를 만듭니다. |
new | Data | 새 데이터 뷰 정의를 만듭니다. |
new | Line | Google 차트 도구 문서에 설명된 대로 선 차트 빌드를 시작합니다. |
new | Pie | Google 차트 도구 문서에 설명된 대로 원형 차트 빌드를 시작합니다. |
new | Scatter | Google 차트 도구 문서에 설명된 대로 산점 차트 빌드를 시작합니다. |
new | Table | Google 차트 도구 문서에 설명된 대로 표 차트 빌드를 시작합니다. |
new | Text | 새 텍스트 스타일 빌더를 만듭니다. |
Column Chart Builder
메서드
Column Type
속성
속성 | 유형 | 설명 |
---|---|---|
DATE | Enum | 날짜 값에 해당합니다. |
NUMBER | Enum | 숫자 값에 해당합니다. |
STRING | Enum | 문자열 값에 해당합니다. |
Curve Style
속성
속성 | 유형 | 설명 |
---|---|---|
NORMAL | Enum | 곡선이 없는 직선 |
SMOOTH | Enum | 선의 각도가 부드럽게 처리됩니다. |
Data Table
Data Table Builder
메서드
메서드 | 반환 유형 | 간략한 설명 |
---|---|---|
add | Data | 데이터 표에 열을 추가합니다. |
add | Data | 데이터 표에 행을 추가합니다. |
build() | Data | 데이터 표를 빌드하고 반환합니다. |
set | Data | 표에 특정 값을 설정합니다. |
Data Table Source
메서드
메서드 | 반환 유형 | 간략한 설명 |
---|---|---|
get | Data | 이 객체 내의 데이터를 DataTable으로 반환합니다. |
Data View Definition
Data View Definition Builder
메서드
메서드 | 반환 유형 | 간략한 설명 |
---|---|---|
build() | Data | 이 빌더를 사용하여 빌드된 데이터 뷰 정의 객체를 빌드하고 반환합니다. |
set | Data | 데이터 뷰에 포함할 열의 색인을 설정하고 역할-열 정보를 지정합니다. |
Line Chart Builder
메서드
Match Type
속성
속성 | 유형 | 설명 |
---|---|---|
EXACT | Enum | 정확한 값만 일치 |
PREFIX | Enum | 값의 시작 부분부터 접두사 일치 |
ANY | Enum | 모든 하위 문자열 일치 |
메서드
메서드 | 반환 유형 | 간략한 설명 |
---|---|---|
get | String | 옵션 JSON에 사용할 일치 유형의 이름을 반환합니다. |
Number Range Filter Builder
메서드
메서드 | 반환 유형 | 간략한 설명 |
---|---|---|
set | Number | 범위 하한 값에 허용되는 최대 값을 설정합니다. |
set | Number | 범위 하한 값에 허용되는 최솟값을 설정합니다. |
set | Number | 슬라이더 방향을 설정합니다. |
set | Number | 선택한 범위의 범위를 표시하는 슬라이더 옆에 라벨을 표시할지 설정합니다. |
set | Number | 숫자 범위 필터 슬라이더 썸네일이 포함될 수 있는 눈금 (범위 막대의 고정된 위치) 수를 설정합니다. |
Orientation
속성
속성 | 유형 | 설명 |
---|---|---|
HORIZONTAL | Enum | 가로 방향입니다. |
VERTICAL | Enum | 세로 방향입니다. |
Picker Values Layout
속성
속성 | 유형 | 설명 |
---|---|---|
ASIDE | Enum | 선택한 값은 값 선택기 위젯 옆에 단일 텍스트 줄로 표시됩니다. |
BELOW | Enum | 선택한 값은 위젯 아래의 단일 텍스트 줄에 표시됩니다. |
BELOW_WRAPPING | Enum | 아래와 비슷하지만 선택 도구에 들어맞지 않는 항목은 새 줄로 줄바꿈됩니다. |
BELOW_STACKED | Enum | 선택한 값이 위젯 아래 열에 표시됩니다. |
Pie Chart Builder
메서드
메서드 | 반환 유형 | 간략한 설명 |
---|---|---|
build() | Chart | 차트를 빌드합니다. |
reverse | Pie | 도메인 축에서 계열의 그리기를 반대로 합니다. |
set3D() | Pie | 차트를 3차원으로 설정합니다. |
set | Pie | 차트의 배경 색상을 설정합니다. |
set | Pie | 차트의 선 색상을 설정합니다. |
set | Pie | Google Sheets와 같은 외부 소스에서 데이터를 가져오는 데 사용되는 데이터 소스 URL을 설정합니다. |
set | Pie | DataTableBuilder를 사용하여 차트에 사용할 데이터 테이블을 설정합니다. |
set | Pie | 차트의 선과 X축 라벨이 포함된 데이터 표를 설정합니다. |
set | Pie | 차트에 사용할 데이터 보기 정의를 설정합니다. |
set | Pie | 차트의 측정기준을 설정합니다. |
set | Pie | 차트를 기준으로 범례의 위치를 설정합니다. |
set | Pie | 차트 범례의 텍스트 스타일을 설정합니다. |
set | Pie | 이 차트의 고급 옵션을 설정합니다. |
set | Pie | 차트 제목을 설정합니다. |
set | Pie | 차트 제목의 텍스트 스타일을 설정합니다. |
Point Style
속성
속성 | 유형 | 설명 |
---|---|---|
NONE | Enum | 선 포인트를 표시하지 않습니다. |
TINY | Enum | 작은 선 점을 사용합니다. |
MEDIUM | Enum | 중간 크기의 선 포인트를 사용합니다. |
LARGE | Enum | 큰 크기의 선 지점을 사용합니다. |
HUGE | Enum | 가장 큰 크기의 선 지점을 사용합니다. |
Position
속성
속성 | 유형 | 설명 |
---|---|---|
TOP | Enum | 차트 위 |
RIGHT | Enum | 차트 오른쪽에 있습니다. |
BOTTOM | Enum | 차트 아래에 있습니다. |
NONE | Enum | 범례가 표시되지 않습니다. |
Scatter Chart Builder
메서드
String Filter Builder
메서드
메서드 | 반환 유형 | 간략한 설명 |
---|---|---|
set | String | 일치 시 대소문자를 구분할지 여부를 설정합니다. |
set | String | 컨트롤이 정확한 값만 일치시킬지 (Match ), 값의 시작 부분부터 시작하는 접두사 (Match ) 또는 하위 문자열(Match )과 일치시킬지 설정합니다. |
set | String | 키를 누를 때마다 컨트롤이 일치해야 하는지 아니면 입력란이 '변경'될 때만(포커스가 사라지거나 Enter 키를 누를 때) 일치해야 하는지 설정합니다. |
Table Chart Builder
메서드
Text Style
메서드
메서드 | 반환 유형 | 간략한 설명 |
---|---|---|
get | String | 텍스트 스타일의 색상을 가져옵니다. |
get | String | 텍스트 스타일의 글꼴 이름을 가져옵니다. |
get | Number | 텍스트 스타일의 글꼴 크기를 가져옵니다. |
Text Style Builder
메서드
메서드 | 반환 유형 | 간략한 설명 |
---|---|---|
build() | Text | 이 빌더를 사용하여 빌드된 텍스트 스타일 구성 객체를 빌드하고 반환합니다. |
set | Text | 텍스트 스타일의 색상을 설정합니다. |
set | Text | 텍스트 스타일의 글꼴 이름을 설정합니다. |
set | Text | 텍스트 스타일의 글꼴 크기를 설정합니다. |