LookML 대시보드의 버튼 매개변수

버튼은 다음 설정이 적용된 LookML 대시보드에서만 지원됩니다.

이 페이지에서는 dashboard.lkml 파일에서 LookML 대시보드 매개변수를 사용하여 type: button의 LookML 대시보드 요소를 추가하고 맞춤설정하는 방법을 보여줍니다. 버튼은 대시보드 내에 링크를 배치하는 데 유용합니다. Look 및 대시보드와 같은 Looker 콘텐츠 또는 다른 웹사이트로 연결할 수 있습니다.

Looker UI를 통해 대시보드에 버튼을 추가하는 방법은 사용자 정의 대시보드 만들기 문서 페이지를 참고하세요.

사용 예시


## BASIC PARAMETERS
type: button
name: text
height: N
width: N
row: N
col: N

## BUTTON PARAMETER
rich_content_json: '{
 "text": "button text",
 "description": "description",
 "newTab": true | false,
 "alignment": "left" | "right" | "center",
 "size": "small" | "medium" | "large",
 "style": "OUTLINED" | "FILLED" | "TRANSPARENT",
 "color": "hex string or css color",
 "href": "link"
 }'

매개변수 정의

파라미터 이름 설명
기본 매개변수
type (요소용) 요소에 사용할 시각화 유형을 결정합니다.
name (요소용) 요소를 만듭니다.
height (요소용) 버튼 요소의 타일 상자 높이를 정의합니다. 높이는 layout: newspaper 대시보드의 행 단위입니다.
width (요소용) 버튼 요소의 타일 상자 너비를 정의합니다. 너비는 layout: newspaper 대시보드의 열 단위입니다.
row layout: newspaper 대시보드의 행 단위로 버튼 요소의 타일 상자의 위에서 아래로의 위치를 정의합니다.
col layout: newspaper 대시보드의 열 단위로 버튼 요소의 타일 상자의 왼쪽에서 오른쪽으로의 위치를 정의합니다.
버튼 매개변수
rich_content_json 버튼에 관한 정보가 포함된 키/값 쌍이 있는 JSON 객체

기본 매개변수

type: button의 LookML 대시보드 요소를 정의할 때는 nametype 매개변수의 값을 하나 이상 지정해야 합니다.

height, width, row, col 매개변수는 버튼 자체가 아닌 버튼 요소의 타일 상자에 적용됩니다.

name

이 섹션에서는 대시보드 요소의 일부인 name 매개변수를 참조합니다.

name대시보드 매개변수 문서 페이지에 설명된 대로 대시보드 필터의 일부로도 사용할 수 있습니다.

name 선언은 새 대시보드 요소를 만들고 이름을 할당합니다. 요소 이름은 고유해야 합니다.

버튼에 부여된 name는 대시보드 UI에 표시되지 않습니다.

- name: orders_by_date

type

이 섹션에서는 대시보드 요소의 일부인 type 매개변수를 참조합니다.

type대시보드 매개변수 문서 페이지에 설명된 대로 대시보드 필터의 일부로도 사용할 수 있습니다.

typetype (조인용) 매개변수 문서 페이지에 설명된 대로 조인의 일부로도 사용할 수 있습니다.

type측정기준, 필터, 파라미터 유형 문서 페이지에 설명된 대로 측정기준의 일부로도 사용할 수 있습니다.

type측정 유형 문서 페이지에 설명된 측정의 일부로도 사용할 수 있습니다.

type 매개변수는 요소에 사용될 시각화 유형을 결정합니다.

- name: element_name
  type: text | looker_grid | table | single_value | looker_single_record |
        looker_column | looker_bar | looker_scatter | looker_line | looker_area |
        looker_pie | looker_donut_multiples | looker_funnel | looker_timeline |
        looker_map | looker_geo_coordinates | looker_geo_choropleth | looker_waterfall |
        looker_wordcloud | looker_boxplot | button

다양한 유형의 LookML 대시보드 요소에 대한 개요는 type (LookML 대시보드용) 문서 페이지를 참고하세요.

height

이 섹션에서는 대시보드 요소의 일부인 height 매개변수를 참조합니다.

height대시보드 매개변수 문서 페이지에 설명된 대로 대시보드 행의 일부로도 사용할 수 있습니다.

height 매개변수는 버튼 요소의 타일 상자 높이를 단위로 정의합니다.

버튼 요소 타일 상자의 기본 높이는 6개 행입니다. 최소 높이는 1행입니다. 버튼 요소 높이를 변경하면 대시보드의 다른 요소에 영향을 줄 수 있지만 버튼 자체의 높이에는 영향을 주지 않습니다.

예를 들어 다음 코드는 버튼의 타일 상자를 높이 12행으로 설정합니다.

- dashboard: sales_overview
  layout: newspaper
  ...

  elements:
  - name: orders_by_date
    height: 12
    ...

width

이 섹션에서는 대시보드 요소의 일부인 width 매개변수를 참조합니다.

width대시보드 매개변수 문서 페이지에 설명된 대로 대시보드의 일부로도 사용할 수 있습니다.

width 매개변수는 버튼 요소의 타일 상자의 너비를 열 단위로 정의합니다.

버튼 요소의 타일 상자 너비는 기본적으로 8개 열로 설정되며, 이는 대시보드 전체 너비의 1/3입니다. 버튼의 타일 상자의 최소 너비는 2입니다.

예를 들어 다음 코드는 버튼의 타일 상자를 대시보드 너비의 절반으로 설정합니다.

- dashboard: sales_overview
  layout: newspaper
  ...

  elements:
  - name: orders_by_date
    width: 12
    ...

버튼의 타일 상자 내에 공간이 있으면 text에 정의된 긴 텍스트 문자열을 수용하도록 버튼의 너비가 증가합니다. 하지만 버튼의 너비는 width 매개변수에 설정된 값을 초과하지 않으며, 필요한 경우 text에 정의된 문자열이 버튼에서 잘립니다.

row

row 매개변수는 버튼 요소의 타일 상자 상단 가장자리가 배치되는 행을 정의합니다.

대시보드는 대시보드 상단의 0번 행부터 시작합니다. 대시보드 버튼 요소는 기본적으로 요소 높이가 6개 행으로 설정됩니다. 즉, 대시보드 상단의 대시보드 요소 (row: 0)는 기본적으로 0~5행을 차지합니다.

다음 예에서 코드는 요소가 기본 높이로 설정되어 있다고 가정하고 대시보드의 두 번째 요소 행에 배치되도록 버튼의 타일 상자를 설정합니다.

- dashboard: sales_overview
  layout: newspaper
  ...

  elements:
  - name: orders_by_date
    row: 6
    ...

col

col 매개변수는 버튼 요소의 타일 상자의 왼쪽 가장자리가 배치되는 열을 정의합니다.

대시보드는 24개의 열로 나뉩니다. 대시보드는 대시보드의 왼쪽에서 열 0으로 시작합니다. 신문 레이아웃이 있는 대시보드는 기본적으로 요소 너비가 8개 열로 설정됩니다. 즉, 대시보드의 왼쪽 (col: 0)에 있는 대시보드 요소는 기본적으로 0~7번 열을 차지합니다.

예를 들어 다음 코드는 대시보드의 요소 중 세 번째 열에 설정할 요소를 설정합니다.

- dashboard: sales_overview
  layout: newspaper
  ...

  elements:
  - name: orders_by_date
    col: 16
    ...

버튼 매개변수

이 섹션에 설명된 매개변수를 사용하여 type: button의 LookML 대시보드 요소에 콘텐츠를 추가할 수 있습니다.

rich_content_json

rich_content_json는 대시보드 버튼의 특성을 정의하는 여러 키/값 쌍이 있는 JSON 객체입니다.

rich_content_json: '{
 "text": "Go to Sales Dashboard",
 "description": "View sales from the last 18 months.",
 "newTab": true,
 "alignment": "center",
 "size": "medium",
 "style": "FILLED",
 "color": "forestgreen",
 "href":"https://instance_name.looker.com/dashboards/152?State=California&Created+Fiscal+Quarter=2022"
 }'

text

text는 대시보드 UI의 버튼에 표시될 텍스트를 정의합니다. 버튼은 width 매개변수로 설정된 한도에 도달할 때까지 텍스트를 수용하도록 너비가 확장되며, 이 지점에서 텍스트가 잘립니다.

description

description는 버튼 위로 마우스를 가져갈 때 팝업 도움말로 표시되는 텍스트를 정의합니다. 설명이 제공되지 않으면 기본적으로 href에 제공된 링크가 표시됩니다.

newTab

newTab는 버튼 링크가 새 탭 (true)에서 열리는지 아니면 현재 탭 (false)에서 열리는지를 정의하는 불리언입니다. newTab의 기본값은 true입니다.

alignment

alignment는 버튼 요소의 타일 상자 내에서 버튼의 정렬을 설정합니다. alignment 기본값은 center입니다.

크기

size은 버튼과 텍스트의 크기를 small, medium 또는 large로 설정합니다. size 값은 버튼 요소의 타일 상자 또는 height 매개변수의 크기에 영향을 주지 않습니다.

style

style는 버튼의 스타일을 다음 값 중 하나로 설정합니다.

  • FILLED: 버튼의 본문이 color에 설정된 색상으로 채워집니다. 버튼의 텍스트는 흰색입니다. 기본값입니다.
  • OUTLINED: 버튼의 가장자리에 윤곽선이 있지만 본문은 투명합니다. 버튼 텍스트의 색상은 color에 의해 설정됩니다.
  • TRANSPARENT: 버튼 본문이 투명합니다. 버튼 텍스트의 색상은 color에 의해 설정됩니다.

color

colorstyle 설정에 따라 버튼 또는 버튼의 텍스트 색상을 설정합니다. color는 Looker 인스턴스의 기본 범주형 색상 컬렉션의 첫 번째 색상으로 기본 설정됩니다.

색상 값 형식을 #2ca6cd와 같은 16진수 문자열이나 mediumblue와 같은 CSS 색상 이름으로 지정할 수 있습니다.

href

href는 버튼이 사용자를 연결할 URL을 설정합니다. 다른 Looker 대시보드로 연결되는 링크에는 대시보드 필터를 특정 값으로 설정하는 필터 매개변수가 포함될 수 있습니다.

삽입된 환경에서 대시보드 링크는 링크 URL에 embed/가 있어야 합니다.