계단식 차트

추가 데이터 세트의 드릴 다운 트리를 추가하기 위한 옵션으로 데이터 세트의 계단식 차트를 생성합니다. 서비스를 사용하여 데이터 세트를 채워야 합니다.

구성 특성

구성에서 보기의 모양 및 동작 특성을 설정하거나 수정하십시오.

화면 크기
특성 이름 옆에 화면 크기 아이콘 화면 크기 아이콘 이 있는 구성 특성은 각 화면 크기에 대해 다른 값을 가질 수 있습니다. 값을 설정하지 않을 경우 화면 크기는 다음으로 큰 화면 크기 값을 기본값으로 상속합니다.
테마 정의
테마 정의는 보기를 위해 색상 및 스타일을 지정하고 보기의 모양을 결정합니다. 테마 편집기에서 보기의 룩앤필을 미리볼 수 있습니다. 테마를 참조하십시오.
제한사항: 접을 수 있는 패널에 차트를 표시할 때 크기 조정 문제점이 발생하는 경우, 접을 수 있는 패널의 On expand 이벤트에서 다음 코드를 사용하여 차트 크기를 사용 가능한 공간으로 조정하십시오. ${CHART_CONTROL_ID}.refresh();
계단식 차트의 모양 구성 특성은 다음 표에 나와 있습니다.
표 1. 계단식 차트의 모양 구성 특성
모양 구성 특성 설명 데이터 유형
단계 아래 영역 표시 영역 차트 보기의 렌더링과 비슷하게 계단식 차트 아래 영역이 채워집니다. Boolean
배경색 스타일 배경색의 색상 스타일입니다. String
데이터 시리즈 색상 스타일 데이터 시리즈의 색상 스타일입니다. String
데이터 시리즈 사용자 정의 색상 스타일 데이터 시리즈의 색상 스타일을 사용자 정의하십시오.
NameValuePair에서 Name은(는) 시리즈 이름이고 Value은(는) 이름, 16진 코드 또는 RGB 코드로 지정된 색상입니다. 예를 들어, red, #ff0000, rgb(255, 0, 0).
특성은 데이터 시리즈 색상 스타일보다 우선합니다.
NameValuePair
값 레이블 표시 차트의 각 점 위에 데이터 점 값을 표시합니다. Boolean
이동 경로 표시 이 옵션이 사용되는 경우 제목은 사용자가 드릴다운할 수 있는 트리의 현재 위치를 표시합니다(메뉴 선택사항에 따라). Boolean
XY축 색상 스타일 X 및 Y축의 색상 스타일입니다. String
눈금선 스타일 가로 눈금선의 스타일입니다. String
X 레이블 회전 X축 레이블의 회전 각도입니다. Decimal
X축 높이 X축의 높이입니다. Integer
테두리 반경 차트의 반지름입니다. String
채우기 차트의 오른쪽, 위, 왼쪽 및 아래에 대한 채우기(픽셀)입니다. String
높이화면 크기 아이콘 차트의 높이입니다. Integer
계단식 차트의 동작 구성 특성은 다음 표에 나와 있습니다.
표 2. 계단식 차트의 동작 구성 특성
동작 구성 특성 설명 데이터 유형
차트 데이터 모드 서비스 또는 구성 옵션에서 차트 데이터를 채울지 여부를 선택하십시오. 사용자가 드릴다운할 수 있는 트리는 적절한 Ajax 액세스를 사용한 서비스 플로우를 통해 채워야만 사용 가능합니다. String
데이터 서비스 데이터 시리즈를 채우는 서비스입니다. Service Flow
데이터 시리즈 seriesName은 데이터 시리즈의 이름이고 dataPoints는 데이터 시리즈에 포함할 데이터 점의 목록입니다. seriesName 의 경우 String 이고 dataPoints목록의 경우 DataPoint[] 입니다.
메뉴 사용 메뉴의 가시성을 사용 가능하게 합니다. 사용자가 드릴다운할 수 있는 트리가 있거나 메뉴를 추가한 경우 메뉴는 필수입니다. Boolean
Y축 눈금 수 Y축의 눈금 수. 지정한 값은 정확한 숫자로 해석되지 않지만 최적의 표시를 제공하는 데 가장 적합한 눈금 수로 조정됩니다. Integer
Y축 눈금 정밀도 Y축 값 레이블에 대해 표시할 소수 자릿수입니다. 기본 소수 자릿수는 0입니다. Integer
최소 Y축 값 Y축의 최소값입니다. Decimal
최대 Y축 값 Y축의 최대값입니다. Decimal
X축 선택 사용 최대 X 눈금 수 특성의 값으로 결정되는 X축 데이터 눈금 수만 표시합니다. Boolean
X축 틱 수 X축에 있는 눈금 수. 지정한 값은 정확한 숫자로 해석되지 않지만 최적의 표시를 제공하는 데 가장 적합한 눈금 수로 조정됩니다. Integer
도구 팁 표시 이 옵션이 사용 가능하면 마우스를 사용하여 차트의 데이터 점 위에 마우스를 놓으면 도구 팁이 표시됩니다. 도구 팁은 점의 이름과 해당 값을 모두 표시합니다. Boolean
차트에서 사용할 수 있는 드릴 다운 트리에 대한 정보는 드릴 다운 트리를 참조하십시오.

이벤트

이벤트 특성에서 보기에 대한 이벤트 핸들러를 설정하거나 수정하십시오. 사용자가 보기로 상호작용할 때 또는 프로그래밍 방식으로 트리거되도록 이벤트를 설정할 수 있습니다. 이벤트를 정의하고 코딩하는 방법에 대한 정보는 사용자 정의 이벤트를 참조하십시오.
계단식 차트에는 다음 유형의 이벤트 핸들러가 있습니다.
  • On load: 차트가 로드될 때 활성화됩니다. 예를 들어, 다음과 같습니다.

    me.defocusSeries("Brand1")

  • On refreshed: 차트를 새로 고칠 때 활성화됩니다. 예를 들어, 다음과 같습니다.

    me.focusSeries("Brand1")

  • On click: 차트를 클릭하면 활성화됩니다. 예를 들어, 다음과 같습니다.

    me.transform("donut", ["Brand1","Brand2"])

  • On menu action: 메뉴 조치가 발견되면 활성화됩니다. 예를 들어, 다음과 같습니다.

    console.log("Running menu action '" + action.name + "' on " + me.getSelectedDataPoint().label + " with value of " + me.getSelectedDataPoint().value)

메소드

계단식 차트의 사용 가능한 메소드에 대한 자세한 정보는 계단식 차트 JavaScript API 를 참조하십시오.

키보드 탐색

키보드를 사용하여 차트를 탐색하려면 다음을 수행하십시오.
  • 원하는 차트가 강조표시될 때까지 Tab 를 누르십시오.
  • Tab 를 눌러 차트 내에서 초점을 가져오십시오.
  • 차트 내에서 탐색하려면 오른쪽, 왼쪽, 위로 또는 아래로 화살표 키를 사용하십시오.
    참고: 설명된 대로 차트를 탐색하려면 JAWS 스크린 리더를 사용해야 합니다.

추가 자원

Coach 또는 페이지를 작성하는 방법에 대한 정보는 Coach 빌드를 참조하십시오.
표준 특성 (일반, 구성, 위치 지정, 가시성HTML 속성) 에 대한 정보는 특성 보기를 참조하십시오.