Namespace: IBChart

Namespaces

export

lang

search

series

Methods

addSeries(prop, opt)

차트에 시리즈를 추가한다.

제공버전:

버전	변경사항
v7.3.0.0

차트가 searchEnd 된 이후 동적으로 시리즈를 추가할 수 있다.

Name	Type	Description
prop	object	시리즈 속성 및 데이터
opt	object	optional 시리즈 추가 옵션 Name Type Default Description redraw boolean true optional 시리즈 추가 후 다시그릴지 여부

Example

myChart.addSeries({
    data:[10,20,30]
});

draw(callback)

설정된 속성과 데이터로 차트를 그린다.

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
callback	function	optional 콜백 함수

Example

myChart.draw(function(){
  console.log("drawEnd");
});

getContainer(){string}

차트의 Dom 객체를 반환한다.

제공버전:

버전	변경사항
v7.3.1.8

Returns:

Type	Description
string	차트 Dom 객체

Example

var chartCont = myChart.getContainer();

getData(){array}

차트의 데이터를 반환한다.

제공버전:

버전	변경사항
v7.3.0.0

Returns:

Type	Description
array	차트의 데이터

Example

var chartData = myChart.getData();

getId(){string}

차트의 ID값을 반환한다.

제공버전:

버전	변경사항
v7.3.0.0

Returns:

Type	Description
string	차트 객체의 ID값

Example

var chartID = myChart.getId();

getOptions(){object}

차트의 설정을 반환한다.

제공버전:

버전	변경사항
v7.3.0.0

Returns:

Type	Description
object	차트의 속성

Example

var chartProp = myChart.getOptions();

getSeries(){object}

시리즈를 반환한다.

제공버전:

버전	변경사항
v7.3.0.0

차트가 searchEnd 된 이후 동적으로 시리즈를 컨트롤 할 수 있다.

Returns:

Type	Description
object	차트의 시리즈 객체정보

Example

var myChartSeries = myChart.getSeries();

parseText(text, ignore, max){object}

문장에서 단어를 추출하고 단어의 빈도수를 계산한다. (빈도수 기준 내림차순 정렬)

제공버전:

버전	변경사항
v7.3.1.0

Name	Type	Description
text	string	분석할 문장
ignore	string | array.<string>	optional 입력된 문장에서 단어의 빈도수 계산에서 제외할 단어 (RegExpress Style String)
max	number	optional 입력된 문장에서 상위 n번째까지의 기준

See:

• setOptions()
• draw()

Returns:

Type	Description
object	입력된 문장에서 추출된 단어와 단어의 빈도수를 내림차순으로 반환

Example

// 차트를 다시 그리기
myChart.setOptions({
    title: {
        text: "윤동주 <별 헤는 밤,1946>"
    },
    series: [{
        name:"단어 사용 빈도",
        // 윤동주 <별 헤는 밤,1946> 발췌
        data:myChart.parseText("계절이 지나가는 하늘에는 가을로 가득 차 있습니다. 나는 아무 걱정도 없이 가을 속의 별들을 다 헬 듯합니다. 가슴속에 하나 둘 새겨지는 별을 이제 다 못 헤는 것은 쉬이 아침이 오는 까닭이요, 내일 밤이 남은 까닭이요, 아직 나의 청춘이 다하지 않은 까닭입니다. 별 하나에 추억과 별 하나에 사랑과 별 하나에 쓸쓸함과 별 하나에 동경과 별 하나에 시와 별 하나에 어머니, 어머니, 어머님, 나는 별 하나에 아름다운 말 한마디씩 불러 봅니다. 소학교 때 책상을 같이 했던 아이들의 이름과, 패, 경, 옥, 이런 이국 소녀들의 이름과, 벌써 아기 어머니 된 계집애들의 이름과, 가난한 이웃 사람들의 이름과, 비둘기, 강아지, 토끼, 노새, 노루, '프랑시스 잠', '라이너 마리아 릴케' 이런 시인의 이름을 불러 봅니다. 이네들은 너무나 멀리 있습니다. 별이 아스라이 멀듯이. 어머님, 그리고 당신은 멀리 북간도에 계십니다. 나는 무엇인지 그리워 이 많은 별빛이 내린 언덕 위에 내 이름자를 써 보고 흙으로 덮어 버리었습니다. 딴은 밤을 새워 우는 벌레는 부끄러운 이름을 슬퍼하는 까닭입니다. 그러나 겨울이 지나고 나의 별에도 봄이 오면 무덤 위에 파란 잔디가 피어나듯이 내 이름자 묻힌 언덕 위에도 자랑처럼 풀이 무성할 게외다.",["이런","다","하나","둘","하나에"],20)
    }]
}, {
    append: true,  // 이미 설정된 차트 속성은 유지
    redraw: true  // 차트를 다시 그린다.
});

// myChart.draw();  // 차트를 다시 그린다.(메소드 별도 호출)

product(){string}

제품 정보를 반환한다.

제공버전:

버전	변경사항
v7.3.0.0

Returns:

Type	Description
string	IBChart 제품정보

removeAll(redraw){boolean}

차트를 초기화한다.

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Default	Description
redraw	boolean	true	optional 차트 초기화후 다시 그리는지 여부

Returns:

Type	Description
boolean	초기화 성공 여부

Example

myChart.removeAll(false);  // 차트 데이터와 속성만 초기화되고 dom 객체는 다시 그리지 않음.

removeSeries(idx)

차트에서 시리즈를 제거한다.

제공버전:

버전	변경사항
v7.3.0.0

차트가 searchEnd 된 이후 동적으로 시리즈를 제거할 수 있다.

Name	Type	Description
idx	number	시리즈 인덱스

Example

myChart.removeSeries(0);

setEventListener(eventType, func)

이벤트를 추가한다.

Name	Type	Description
eventType	string	이벤트 종류
func	function	이벤트 핸들러

See:

• setEvents()

Example

myChart.setEventListener("searchEnd",function(event){
    if(event.code === -1 || event.msg !== "OK") {
        return -1;
    }
    console.log("데이터 " + event.type + " 완료!");
});
myChart.setEventListener("click",function(event){
    console.log("Chart Click!");
});
myChart.draw();

setEvents(opt)

이벤트 종류와 핸들러를 JSON 형식으로 설정한다.

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
opt	object	optional 이벤트 종류와 핸들러(JSON 형식) Name Type Description searchEnd function optional 데이터 조회 완료 이벤트 상세보기 addSeries function optional 시리즈 추가 이벤트 상세보기 afterPrint function optional 프린트 직후 이벤트 상세보기 beforePrint function optional 프린트 직전 이벤트 상세보기 click function optional 차트영역 클릭 이벤트 상세보기 drilldown function optional 드릴다운 이벤트 상세보기 drillup function optional 드릴업 이벤트 상세보기 drillupAll function optional 최상단 드릴업 이벤트 상세보기 redraw function optional redraw 이벤트 상세보기 selection function optional 선택 이벤트 상세보기 seriesAfterAnimate function optional 시리즈 에니메이션 이후 이벤트 상세보기 seriesCheckBoxClick function optional 시리즈 체크박스 클릭 이벤트 상세보기 seriesClick function optional 시리즈 클릭 이벤트 상세보기 seriesHide function optional 시리즈 숨김 이벤트 상세보기 seriesLegendItemClick function optional 시리즈 범례 클릭 이벤트 상세보기 seriesMouseOut function optional 시리즈 마우스 Out 이벤트 상세보기 seriesMouseOver function optional 시리즈 마우스 Over 이벤트 상세보기 seriesShow function optional 시리즈 보여짐 이벤트 상세보기 pointClick function optional 포인트 클릭 이벤트 상세보기 pointMouseOut function optional 포인트 마우스 Out 이벤트 상세보기 pointMouseOver function optional 포인트 마우스 Over 이벤트 상세보기 pointRemove function optional 포인트 지움 이벤트 상세보기 pointSelect function optional 포인트 선택 이벤트 상세보기 pointUnselect function optional 포인트 선택해제 이벤트 상세보기 pointUpdate function optional 포인트 업데이트 이벤트 상세보기

See:

• setEventListener()

Example

myChart.setEvents({
    searchEnd : function(event) {
        if(event.code === -1 || event.msg !== "OK") {
            return -1;
        }
        console.log("데이터 " + event.type + " 완료!");
    },
    click : function(event) {
        console.log("Chart Click!");
    }
});
myChart.draw();

setOptions(prop, opt)

차트의 속성을 설정 한다.

제공버전:

버전	변경사항
v7.3.0.0
v7.3.1.4	resetData, mergeData 옵션 추가
v7.3.1.12	resetColors, mergeColors 옵션 추가

Name	Type	Description
prop	object	속성 Name Type Description chart object optional 기본 속성 Name Type Default Description type string optional 차트 유형 Enum Description area 영역 차트 arearange 영역 범위 차트 bar 바 차트 boxplot 박스플롯 차트 bubble 버블 차트 column 컬럼 차트 columnrange 컬럼 범위 차트 errorbar errorBar 차트 funnel 깔대기형 차트 gauge 게이지 차트 heatmap 히트맵 차트 line 라인 차트 pie 파이 차트 pyramid 피라미드 차트 scatter 산점 차트 spline 부드러운 라인 차트 waterfall 폭포형 차트 wordcloud 워드클라우드 차트는 단어의 가중치(값)에 따라 단어의 크기, 위치, 색을 지정하고 단어를 시각적으로 표현하는 차트, 단일 시리즈이며 그 한 개의 시리즈에 단어와 가중치 데이터로 구성되어있다. plotBackgroundColor color optional 차트 영역의 배경색상 plotBorderColor color "#cccccc" optional 차트 영역의 border 색상 plotBorderWidth number 0 optional 차트 영역의 border 너비 plotShadow boolean false optional 차트 영영에 대한 그림자 표시 여부 inverted boolean false optional X축과 Y축 반전 여부 polar boolean false optional polar 차트 구성 여부 zoomType string 'none' optional 마우스 드래그시 zoom 적용 방법 설정 Enum Description none 사용안함 x X축으로만 zoom 처리 y Y축으로만 zoom 처리 xy X축, Y축 양방향 zoom 처리 backgroundColor color optional 차트 컨테이너 영역의 배경색상 borderColor color optional 차트 컨테이너 영역의 border 색상 borderWidth number 0 optional 차트 컨테이너 영역의 border 너비 borderRadius number 0 optional 차트 컨테이너 영역에 대한 radius 적용 값 shadow boolean optional 차트 컨테이너 영영에 대한 그림자 표시 여부 title object optional 제목 속성 Name Type Default Description text string '' optional 제목 문자열 align string 'center' optional 좌우 정렬 값 Enum Description center 중앙 정렬 left 좌측 정렬 right 우측 정렬 verticalAlign string '' optional 상하 정렬 값 Enum Description top 상단 정렬 middle 중앙 정렬 bottom 하단 정렬 floating boolean false optional 차트 위에 겹칠지 여부 margin number 15 optional 여백 값을 지정 x number 0 optional 좌우 포지션 이동 값 (정렬 기준으로 기본값은 0 이다) y number optional 상하 포지션 이동 값 (정렬 기준으로 기본값은 0 이다) style object optional 스타일 설정 Name Type Default Description color color '#274b6d' optional 폰트 색상 fontSize string '18px' optional 폰트 크기 fontWeight string optional 폰트 두께 fontFamily string optional 폰트 종류 useHTML boolean false optional html 사용 여부 subtitle object optional 부제목 속성 Name Type Default Description text string '' optional 부제목 문자열 align string 'center' optional 좌우 정렬 값 Enum Description center 중앙 정렬 left 좌측 정렬 right 우측 정렬 verticalAlign string '' optional 상하 정렬 값 Enum Description top 상단 정렬 middle 중앙 정렬 bottom 하단 정렬 floating boolean false optional 차트 위에 겹칠지 여부 margin number 15 optional 여백 값을 지정 x number 0 optional 좌우 포지션 이동 값 (정렬 기준으로 기본값은 0 이다) y number optional 상하 포지션 이동 값 (정렬 기준으로 기본값은 0 이다) style object optional 스타일 설정 Name Type Default Description color color '#4d759e' optional 폰트 색상 fontSize string optional 폰트 크기 fontFamily string optional 폰트 종류 fontWeight string optional 폰트 두께 useHTML boolean false optional html 사용 여부 colors array optional 시리즈별 적용할 색상의 배열 집합 배열의 길이보다 시리즈가 더 많은 경우는 다시 첫번째 부터 반복 적용 된다. xAxis object | array.<object> optional X축 속성 Name Type Default Description title object optional 제목 속성 Name Type Default Description text string "" optional 제목 문자열 align string "middle" optional 정렬 방법 Enum Description low 좌측 정렬 middle 중앙 정렬 high 우측 정렬 style object optional 제목 스타일 Name Type Default Description color color '#4d759e' optional 폰트 색상 fontSize string optional 폰트 크기 fontWeight string "bold" optional 폰트 두께 categories array optional 인덱스 대신 사용할 축의 name 배열집합 crosshair boolean false optional 포인트에 마우스 오버시 가이드라인 표시 여부 reversed boolean false optional 축 반전 여부 showFirstLabel boolean true optional 첫번째 축 라벨 표시 여부 showLastLabel boolean true optional 마지막 축 라벨 표시 여부 lineWidth number 1 optional 축 라인의 너비 lineColor color '#ccd6eb' optional 축 라인의 색상 startOnTick boolean false optional 축의 시작점을 강제로 표시할지 여부 endOnTick boolean false optional 축의 마지막점을 강제로 표시할지 여부 labels object optional 라벨 속성 Name Type Default Description align string 'center' optional 좌우 정렬 방법 Enum Description center 중앙 정렬 left 좌측 정렬 right 우측 정렬 format string '{value}' optional 축 라벨의 포맷 문자열 (값은 {value} 문자열을 이용 한다.) formatter function optional 축 라벨의 포맷을 정의하는 callback 함수 style object optional 라벨 스타일 속성 Name Type Default Description color string '#666666' optional 폰트 색상 fontSize color '11px' optional 폰트 크기 fontWeight string optional 폰트 두께 useHTML boolean false optional html 사용 여부 rotation number 0 optional 기울기 (0 ~ 360) step number optional 표시 단계 opposite boolean false optional 상단에 표시 여부 min number optional 축의 최소값 max number optional 축의 최대값 tickInterval number optional 축에 표시할 점의 간격 gridLineWidth number 0 optional 그리드 라인의 너비 gridLineColor color '#262626' optional 그리드 라인의 색상 gridLineDashStyle string 'solid' optional 그리드 라인의 종류 Enum Description solid 실선 dash 대쉬선 longdash 긴 대쉬선 dot 점선 plotBands object optional 플롯밴드 속성 (특정영역 하일라이팅) Name Type Description from number optional 시작점 to number optional 종료점 color color optional 색상 label string optional 라벨 속성 Name Type Default Description text string optional 라벨 문자열 textAlign string optional 라벨 문자열 정렬 방법 Enum Description center 중앙 정렬 left 좌측 정렬 right 우측 정렬 align string 'center' optional 좌우 정렬 방법 Enum Description center 중앙 정렬 left 좌측 정렬 right 우측 정렬 rotation number 0 optional 기울기 useHTML boolean false optional html 사용 여부 style object optional 스타일 속성 Name Type Default Description color color '#666666' optional 폰트 색상 fontSize string '11px' optional 폰트 크기 offset number 0 optional 기본 위치 기준으로 표시할 offset 값 minorTickInterval number optional 축에 표시할 보조 점의 간격 minorGridLineWidth string 1 optional 보조 그리드 라인의 너비 minorGridLineColor color '#f2f2f2' optional 보조 그리드 라인의 색상 minorGridLineDashStyle string 'solid' optional 보조 그리드 라인의 종류 Enum Description solid 실선 dash 대쉬선 longdash 긴 대쉬선 dot 점선 alternateGridColor color optional 그리드 라인의 교차 색상 yAxis object | array.<object> optional Y축 속성 Name Type Default Description title object optional 제목 속성 Name Type Description text string optional 제목 문자열 align string optional 정렬 방법 Enum Description low 좌측 정렬 middle 중앙 정렬 high 우측 정렬 style object optional 제목 스타일 Name Type Default Description color color '#4d759e' optional 폰트 색상 fontSize string optional 폰트 크기 fontWeight string "bold" optional 폰트 두께 categories array optional 인덱스 대신 사용할 축의 name 배열집합 crosshair boolean false optional 포인트에 마우스 오버시 가이드라인 표시 여부 reversed boolean false optional 축 반전 여부 showFirstLabel boolean true optional 첫번째 축 라벨 표시 여부 showLastLabel boolean true optional 마지막 축 라벨 표시 여부 lineWidth number 1 optional 축 라인의 너비 lineColor color '#ccd6eb' optional 축 라인의 색상 startOnTick boolean false optional 축의 시작점을 강제로 표시할지 여부 endOnTick boolean false optional 축의 마지막점을 강제로 표시할지 여부 labels object optional 라벨 속성 Name Type Default Description align object 'center' optional 좌우 정렬 방법 Enum Description center 중앙 정렬 left 좌측 정렬 right 우측 정렬 format string '{value}' optional 축 라벨의 포맷 문자열 (값은 {value} 문자열을 이용 한다.) formatter function optional 축 라벨의 포맷을 정의하는 callback 함수 style object optional 라벨 스타일 Name Type Default Description color color '#666666' optional 폰트 색상 fontSize string '11px' optional 폰트 크기 fontWeight string optional 폰트 두께 useHTML boolean false optional html 사용 여부 rotation number 0 optional 기울기 (0 ~ 360) step number optional 표시 단계 opposite boolean false optional 상단에 표시 여부 min number optional 축의 최소값 max number optional 축의 최대값 tickInterval number optional 축에 표시할 점의 간격 gridLineWidth number 0 optional 그리드 라인의 너비 gridLineColor color '#262626' optional 그리드 라인의 색상 gridLineDashStyle string 'solid' optional 그리드 라인의 종류 Enum Description solid 실선 dash 대쉬선 longdash 긴 대쉬선 dot 점선 plotBands object optional 플롯밴드 속성 (특정영역 하일라이팅) Name Type Description from number optional 시작점 to number optional 종료점 color color optional 색상 label string optional 라벨 속성 Name Type Default Description text string optional 라벨 문자열 textAlign string optional 라벨 문자열 정렬 방법 Enum Description center 중앙 정렬 left 좌측 정렬 right 우측 정렬 align string 'center' optional 좌우 정렬 방법 Enum Description center 중앙 정렬 left 좌측 정렬 right 우측 정렬 rotation number 0 optional 기울기 useHTML boolean false optional html 사용 여부 style object optional 스타일 속성 Name Type Default Description color color '#666666' optional 폰트 색상 fontSize string '11px' optional 폰트 크기 gridLineInterpolation string optional offset string optional minorTickInterval number optional 축에 표시할 보조 점의 간격 minorGridLineWidth string 1 optional 보조 그리드 라인의 너비 minorGridLineColor color '#f2f2f2' optional 보조 그리드 라인의 색상 minorGridLineDashStyle string 'solid' optional 보조 그리드 라인의 종류 Enum Description solid 실선 dash 대쉬선 longdash 긴 대쉬선 dot 점선 alternateGridColor color optional 그리드 라인의 교차 색상 plotOptions object optional 구성 옵션 속성 series 하위로 설정하면 모든 시리즈에 적용 되고, 차트유형 하위로 설정하면 해당 차트 유형에 구성옵션이 적용 된다. Name Type Description series object optional series 공통 구성 옵션 속성 Name Type Default Description animation boolean true optional 애니메이션 효과 사용 여부 borderColor color '#ffffff' optional border 색상 borderRadius number 0 optional radius 적용 값 borderWidth number 1 optional border의 너비 center array optional 차트의 중심 위치 (숫자 또는 퍼센트 설정) cursor string optional 마우스의 커서 모양 Enum Description default 기본 모양 pointer 포인터 모양 dashStyle string 'solid' optional 차트 선의 종류 Enum Description solid 실선 dash 대쉬선 longdash 긴 대쉬선 dot 점선 dataLabels object optional 데이터 라벨 속성 Name Type Default Description align string 'center' optional 정렬 방법 Enum Description center 중앙 정렬 left 좌측 정렬 right 우측 정렬 enbaled boolean false optional 표시 여부 distance number 30 optional 끝지점 부터의 표시 위치 style object optional 스타일 속성 Name Type Default Description color color optional 폰트 색상 fontSize string optional 폰트 크기 fontWeight string 'bold' optional 폰트 bold 여부 color color optional 색상 format string '{y}' optional 출력 포맷 formatter function optional 출력 포맷을 정의하는 callback 함수 rotation number 0 optional 기울기 useHtml boolean optional html 사용 여부 x number optional 좌우 포지션 이동 값 (정렬 기준으로 기본값은 0 이다) y number optional 상하 포지션 이동 값 (정렬 기준으로 기본값은 0 이다) endAngle number optional 앵글의 마지막 점 fillColor color optional 시리즈 영역의 배경색 groupPadding number 0.3 optional 그룹 간 padding 적용 값 innerSize number | string 0 optional pie 차트의 내부 원의 크기 lineColor color optional 시리즈 선의 색상 lineWidth number 2 optional 시리즈 선의 너비 marker object optional 포인트 마커 속성 Name Type Default Description enabled boolean optional 사용 여부 radius number 4 optional radius 적용 값 states object optional 상태 속성 Name Type Description hover object optional 마우스가 위치할때의 상태 속성 Name Type Default Description enabled boolean true optional 사용 여부 lineColor color '#ffffff' optional 마커의 라인 색상 lineWidth number 0 optional 마커의 라인 너비 fillColor color optional 마커 색상 select object optional 선택일때의 상태 속성 Name Type Default Description enabled boolean true optional 사용 여부 lineColor color '#000000' optional 마커의 라인 색상 lineWidth number 0 optional 마커의 라인 너비 fillColor color optional 마커 색상 negativeColor color optional 임계값 아래의 점 색상 negativeFillColor color optional 임계값 아래의 점 배경 색상 pointStart number 0 optional 포인트 시작 점 pointPadding number 0.1 optional 포인트간 padding 적용 값 pointPlacement string optional 포인트 위치 Enum Description on 축의 점 위치 between 축의 점간 사이 위치 pointWidth number optional 포인트의 너비 showInLegend boolean true optional 범례에 포함 여부 step string optional 포인트간 선에 대한 단계 표현 방법 Enum Description null 사용 안함 left 좌측 단계 표현 center 중앙 단계 표현 right 우측 단계 표현 stacking string optional 시리즈 데이터 stack 방법 Enum Description null 사용 안함 normal 일반 stack percent 비율 stack states object optional 시리즈 선의 상태 속성 Name Type Description hover object optional 마우스가 위치할때의 상태 속성 Name Type Default Description enabled boolean true optional 사용 여부 lineWidth number 2 optional 선의 너비 startAngle number optional 앵글의 시작 점 shadow boolean false optional 시리즈 선의 그림자 표시 여부 visible boolean true optional 시리즈 선의 visible 여부 area object optional area 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) arearange object optional arearange 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) bar object optional bar 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) boxplot object optional boxplot 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) bubble object optional bubble 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) column object optional column 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) columnrange object optional columnrange 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) errorbar object optional errorbar 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) funnel object optional funnel 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) gauge object optional gauge 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) heatmap object optional heatmap 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) line object optional line 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) pie object optional pie 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) pyramid object optional pyramid 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) scatter object optional scatter 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) spline object optional spline 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) waterfall object optional waterfall 차트 유형 구성 옵션 속성 (세부 속성은 series 와 동일) wordcloud object optional wordcloud 차트 유형 구성 옵션 속성 Name Type Default Description animation boolean true optional 애니메이션 효과 사용 여부 colorIterate boolean true optional colors에 등록된 가지수를 가지고 반복할지 유무 (false이면 차트를 그릴때와 파일 다운로드할때도 매번 바뀜) colorSort string "none" optional 색상 지정 방식 지정 Enum Description none 사용안함 rank 가중치(값)의 내림차순 기준으로 색상 지정 orientation number 1 optional 회전 방향의 수 지정 rotation array [0,90] optional 회전 범위 지정 scaleType string "linear" optional 가중치(값)를 입력된 데이터의 min, max 값 기준으로 정규화 계산 방식 지정 Enum Description none 사용안함 log 로그형 sqrt 제곱형 linear 선형 spiralType string "archimedean" optional 단어 배치 종류 지정 Enum Description archimedean 원형 이동 rectangular 사각형 이동 placeType string "linear" optional 단어 위치 지정 Enum Description linear 선형 random 무작위형 (차트를 그릴때와 파일 다운로드할때도 매번 바뀜) valueRange array.<number> | string [15,60] optional 단어 최소/최대 크기 지정 Enum Description [#,#] 고정형 ([최소 크기, 최대 크기]를 숫자로 지정, ※ 차트의 크기에 따라 최소값과 최대값을 바꿔줘야함 - 최소값과 최대값이 차트의 크기에 비례해 큰 값이 설정될 경우나 최소값과 최대값의 차이가 단어의 갯수에 비해 작을 경우 성능이 저하될 수 있음) responsive 반응형 (차트의 크기에 따라 글자 크기를 변경하고 줌인/줌아웃) style object optional 글꼴 스타일 지정 Name Type Default Description fontFamily object "Lucida Grande" optional 글꼴 지정 (※ 클라이언트 사용자에 있는 폰트만 유효함(웹폰트 포함), ※ Export할때 서버에 해당 폰트가 있어야 동일하게 출력이 가능함) fontWeight object "bold" optional 글꼴 두께 지정 fontPadding object 1 optional 글꼴 여백 지정 tooltip object optional 툴팁 속성 Name Type Default Description formatter funtion optional 사용자 정의 포맷 메소드 pointFormat object optional 포인트 값 출력 포맷 (아래의 값을 이용하여 html 형태로 구성할 수 있다) Enum Description {series.name} 시리즈명 {series.color} 시리즈 색상 {point.x} X축 값 {point.y} y축 값 headerFormat object optional 헤더 출력 포맷 (아래의 값을 이용하여 html 형태로 구성할 수 있다) Enum Description {series.name} 시리즈명 {series.color} 시리즈 색상 {point.x} X축 값 {point.y} y축 값 useHTML boolean false optional html 사용 여부 hideDelay boolean 500 optional 툴팁 fadeOut 시간(ms) padding boolean 8 optional 툴팁 내부 여백 valueDecimals number optional 소수점 개수 valuePrefix string optional 값의 머리 글 문자열 valueSuffix string optional 값의 꼬리 글 문자열 enabled boolean true optional 툴팁 사용 여부 animation boolean true optional 출력시 애니메이션 효과 사용 여부 backgroundColor color optional 배경색 borderColor color optional border 색상 borderWidth number 1 optional border의 너비 borderRadius number 3 optional radius 적용 값 shadow boolean true optional 툴팁 그림자 여부 shared boolean false optional 모든 시리즈의 값을 출력할지 여부 shape string 'callout' optional 툴팁 모양 Enum Description callout 말풍선 모양 square 사각형 style object optional 스타일 속성 Name Type Default Description color color '#333333' optional 폰트 색상 cursor string 'default' optional 마우스 커서 모양 fontFamily string '"Lucida Grande","Lucida Sans Unicode",Arial,Helvetica,sans-serif' optional 글꼴 종류 pane object optional pane 속성 (gauge, polar 차트 유형에서만 사용) Name Type Description startAngle number optional 앵글의 시작 점 endAngle number optional 앵글의 마지막 점 background object optional 배경 속성 Name Type Default Description backgroundColor color optional 배경 색상 borderColor color '#cccccc' optional border 색상 borderWidth number 1 optional border의 너비 innerRadius number | string 0 optional pane 안쪽의 radius 적용 값 (숫자 또는 퍼센트 값으로 설정) outerRadius number | string '105%' optional pane 바깥쪽의 radius 적용 값 (숫자 또는 퍼센트 값으로 설정) legend object optional 범례 속성 Name Type Default Description enabled boolean true optional 범례 표시 여부 align string 'center' optional 정렬 방법 Enum Description center 중앙 정렬 left 좌측 정렬 right 우측 정렬 verticalAlign string 'bottom' optional 상하 정렬 값 Enum Description top 상단 정렬 middle 중앙 정렬 bottom 하단 정렬 backgroundColor color optional 배경색 borderColor color '#999999' optional border 색상 borderWidth number 1 optional border의 너비 borderRadius number 0 optional radius 적용 값 layout string 'horizontal' optional 배치 방법 Enum Description horizontal 가로 나열 배치 vertical 세로 나열 배치 title object optional 제목 속성 Name Type Description text string optional 제목 문자열 style object optional 스타일 속성 Name Type Default Description color color optional 폰트 색상 fontSize string optional 폰트 크기 fontWeight string 'bold' optional 폰트 bold 여부 x number 0 optional 좌우 포지션 이동 값 (정렬 기준으로 기본값은 0 이다) y number 0 optional 상하 포지션 이동 값 (정렬 기준으로 기본값은 0 이다) events object optional 이벤트 핸들러 지정 event
opt	object	optional 옵션 Name Type Default Description append boolean false optional 속성 병합 여부 redraw boolean false optional 속성 적용 후 다시 그릴지 여부 resetData boolean false optional 데이터 병합 여부 (속성을 유지하면서 데이터 초기화 여부, ※ opt.append값과 opt.mergeData값이 false이면 데이터 초기화) mergeData boolean true optional 데이터를 기존 데이터에 덮어씌울지 여부(opt.resetData값이 false일때만 적용됨) resetColors boolean false optional 시리즈 색상값(colors) 병합 여부 (속성을 유지하면서 데이터 초기화 여부, ※ opt.append값과 opt.mergeColors값이 false이면 데이터 초기화) mergeColors boolean true optional 시리즈 색상값(colors)을 기존 시리즈 색상값에 덮어씌울지 여부(opt.resetColors값이 false일때만 적용됨) deepCopy boolean fasle optional 깊은 복사

See:

• loadSearchData()
• setEventListener()
• setEvents()

Example

myChart.setOptions({
    chart : {
        backgroundColor : "#EDEDED",
        type : "column",
        style : {
            fontSize : "20px"
        }
    },
    legend : {
        layout : "vertical",
        align : "right",
        verticalAlign : "top"
    },
    plotOptions : {
        series : {
            shadow : false,
            dataLabels : {
                enabled : true,
                align : "center"
            }
        },
        column : {
            pointPadding : 0.02
        }
    },
    xAxis : {
        tickInterval : 1,
        labels : {
            enabled : true
        }
    },
    yAxis : {
        tickInterval : 100,
        title : {
            text : ""
        }
    },
    events : {
        searchEnd : function(event) {
            if(event.code === -1 || event.msg !== "OK") {
                return -1;
            }
            console.log("데이터 " + event.type + " 완료!");
        },
        click : function(event) {
            console.log("Chart Click!");
        }
    }
});

setSize(width, height)

설정된 너비와 높이로 차트를 다시 그린다.

제공버전:

버전	변경사항
v7.3.1.10

Name	Type	Description
width	number	optional 차트의 너비 (px)
height	number	optional 차트의 높이 (px)

Example

myChart.setSize(500, 300); // 너비 500px, 높이 300px로 차트의 크기를 변경한다.

updateWords()

wordcloud에 사용되는 단어를 업데이트한다.

제공버전:

버전	변경사항
v7.3.1.0

See:

• setOptions()
• draw()

Example

myChart.setOptions({
    plotOptions: {
        wordcloud: {
            rotation: [-45,90], // default : [0,90]
            orientation: 3, // default : 1
            colorIterate: false, // default : true
            colorSort: "rank", // "rank", "none" default: "none"
            scaleType: "log", // "log", "sqrt", "linear" default: "none"
            placeType: "random", // "random", "linear" default: "linear"
            spiralType: "rectangular", // "rectangular", "archimedean" default : "archimedean"
            valueRange: "responsive", // "responsive", [#,#] default: [15,60]
            style: {
                fontFamily: "나눔고딕", // default: "Lucida Grande"
                fontWeight: "bold", // default: "bold"
                fontPadding: 0.2 // default: 1
            }
        }
    }
}, {
    append: true  // 이미 설정된 차트 속성은 유지
});

myChart.updateWords();  // plotOptions와 series(단어 데이터)만 업데이트

version(){string}

제품의 버전을 반환한다.

제공버전:

버전	변경사항
v7.3.0.0

Returns:

Type	Description
string	IBChart의 버전

Events

setEventListener(), setEvents(), setOptions()을 통해 이벤트를 등록할 수 있다.

addSeries

시리즈 추가 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

afterPrint

프린트 직후 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

beforePrint

프린트 직전 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

click

차트영역 클릭 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입 x number optional 클릭 위치 (컨테이너 크기 기준 X 좌표) y number optional 클릭 위치 (컨테이너 크기 기준 Y 좌표)

drilldown

드릴다운 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

Properties:

Name	Type	Description
this	object	차트 객체 Properties Name Type Description category string | number 지점의 카테고리(axisLabel) x number 지점의 x값 y number 지점의 y값

drillup

드릴업 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

drillupAll

최상단 드릴업 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

pointClick

포인트 클릭 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입 x number optional 클릭 위치 (컨테이너 크기 기준 X 좌표) y number optional 클릭 위치 (컨테이너 크기 기준 Y 좌표) point array optional 클릭 지점 정보 Name Type Description x number optional 클릭 위치 (x축 기준 X 좌표) y number optional 클릭 위치 (y축 기준 Y 좌표) name number optional 클릭 지점 이름

Properties:

Name	Type	Description
this	object	차트 객체 Properties Name Type Description category string | number 지점의 카테고리(axisLabel) x number 지점의 x값 y number 지점의 y값

pointMouseOut

포인트 마우스 Out 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

Properties:

Name	Type	Description
this	object	차트 객체 Properties Name Type Description category string | number 지점의 카테고리(axisLabel) x number 지점의 x값 y number 지점의 y값

pointMouseOver

포인트 마우스 Over 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

Properties:

Name	Type	Description
this	object	차트 객체 Properties Name Type Description category string | number 지점의 카테고리(axisLabel) x number 지점의 x값 y number 지점의 y값

pointSelect

포인트 선택 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입 x number optional 클릭 위치 (컨테이너 크기 기준 X 좌표) y number optional 클릭 위치 (컨테이너 크기 기준 Y 좌표) point array optional 클릭 지점 정보 Name Type Description x number optional 클릭 위치 (x축 기준 X 좌표) y number optional 클릭 위치 (y축 기준 Y 좌표) name number optional 클릭 지점 이름

Properties:

Name	Type	Description
this	object	차트 객체 Properties Name Type Description category string | number 지점의 카테고리(axisLabel) x number 지점의 x값 y number 지점의 y값

pointUnselect

포인트 선택해제 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입 x number optional 클릭 위치 (컨테이너 크기 기준 X 좌표) y number optional 클릭 위치 (컨테이너 크기 기준 Y 좌표) point array optional 클릭 지점 정보 Name Type Description x number optional 클릭 위치 (x축 기준 X 좌표) y number optional 클릭 위치 (y축 기준 Y 좌표) name number optional 클릭 지점 이름

Properties:

Name	Type	Description
this	object	차트 객체 Properties Name Type Description category string | number 지점의 카테고리(axisLabel) x number 지점의 x값 y number 지점의 y값

pointUpdate

포인트 업데이트 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

redraw

redraw 이벤트 (#draw와 다름)

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

searchEnd

데이터 조회 완료 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description code string optional 에러 코드 msg string optional 메시지 type string optional 이벤트 타입

selection

선택 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

seriesAfterAnimate

시리즈 에니메이션 이후 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

Properties:

Name	Type	Description
this	object	차트 객체 Properties Name Type Description name string 시리즈 명 index number 시리즈 인덱스 data array 시리즈의 데이터 xData array 시리즈의 x축 데이터 yData array 시리즈의 y축 데이터 dataMax number 시리즈의 데이터에서 최대 값 dataMin number 시리즈의 데이터에서 최소 값

seriesCheckBoxClick

시리즈 체크박스 클릭 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

Properties:

Name	Type	Description
this	object	차트 객체 Properties Name Type Description name string 시리즈 명 index number 시리즈 인덱스 data array 시리즈의 데이터 xData array 시리즈의 x축 데이터 yData array 시리즈의 y축 데이터 dataMax number 시리즈의 데이터에서 최대 값 dataMin number 시리즈의 데이터에서 최소 값

seriesClick

시리즈 클릭 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

Properties:

Name	Type	Description
this	object	차트 객체 Properties Name Type Description name string 시리즈 명 index number 시리즈 인덱스 data array 시리즈의 데이터 xData array 시리즈의 x축 데이터 yData array 시리즈의 y축 데이터 dataMax number 시리즈의 데이터에서 최대 값 dataMin number 시리즈의 데이터에서 최소 값

seriesHide

시리즈 숨김 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

Properties:

Name	Type	Description
this	object	차트 객체 Properties Name Type Description name string 시리즈 명 index number 시리즈 인덱스 data array 시리즈의 데이터 xData array 시리즈의 x축 데이터 yData array 시리즈의 y축 데이터 dataMax number 시리즈의 데이터에서 최대 값 dataMin number 시리즈의 데이터에서 최소 값

seriesLegendItemClick

시리즈 범례 클릭 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

Properties:

Name	Type	Description
this	object	차트 객체 Properties Name Type Description name string 시리즈 명 index number 시리즈 인덱스 data array 시리즈의 데이터 xData array 시리즈의 x축 데이터 yData array 시리즈의 y축 데이터 dataMax number 시리즈의 데이터에서 최대 값 dataMin number 시리즈의 데이터에서 최소 값

seriesMouseOut

시리즈 마우스 Out 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

Properties:

Name	Type	Description
this	object	차트 객체 Properties Name Type Description name string 시리즈 명 index number 시리즈 인덱스 data array 시리즈의 데이터 xData array 시리즈의 x축 데이터 yData array 시리즈의 y축 데이터 dataMax number 시리즈의 데이터에서 최대 값 dataMin number 시리즈의 데이터에서 최소 값

seriesMouseOver

시리즈 마우스 Over 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

Properties:

Name	Type	Description
this	object	차트 객체 Properties Name Type Description name string 시리즈 명 index number 시리즈 인덱스 data array 시리즈의 데이터 xData array 시리즈의 x축 데이터 yData array 시리즈의 y축 데이터 dataMax number 시리즈의 데이터에서 최대 값 dataMin number 시리즈의 데이터에서 최소 값

seriesShow

시리즈 보여짐 이벤트

제공버전:

버전	변경사항
v7.3.0.0

Name	Type	Description
event	object	optional 이벤트 param Name Type Description type string optional 이벤트 타입

Properties:

Name	Type	Description
this	object	차트 객체 Properties Name Type Description name string 시리즈 명 index number 시리즈 인덱스 data array 시리즈의 데이터 xData array 시리즈의 x축 데이터 yData array 시리즈의 y축 데이터 dataMax number 시리즈의 데이터에서 최대 값 dataMin number 시리즈의 데이터에서 최소 값