맨위로가기
 

SBCHART

닫기

SBChart 객체 생성 및 렌더링 - render()

#2.0.0

SBChart 객체를 생성하는 방식은
  1. static 함수인 sb.chart.render() 를 사용하는 방식과
  2. 인스턴스를 직접 생성하는 new sb.chart() 방식
2가지로 나누어지며 첫 번째 방식 sb.chart.render() 함수는 SBChart 객체 생성과 렌더링이 동시에 수행됩니다.

sb.chart.render()

#2.0.0

SBChart 객체를 생성하고 렌더링 합니다.
static 함수이며 리턴 값은 SBChart Object입니다.

  • Parameters
    • 차트를 그려줄 엘리먼트 (bind element), Mandatory
    • 차트 옵션 (데이터 포함), Mandatory
  • Return
    • SBChart 객체
  • Example 
    var chart = sb.chart.render("#chartWrap", {
  data: {
      columns: [
          ["2015",3.51,4.6,3.43,7.96,3.37,5.83,0.35,3.23,-0.09,4.47,2.21,1.13,0.77,0.35,0.92,2.65,1.64,8.08]
      ]
  }
});

[SBCHART].render()

#2.0.0

이미 생성된 SBChart 객체에 차트를 (다시) 그려주기 위한 함수입니다.

  • Parameters
    • 차트를 그려줄 엘리먼트 (bind element), Optional
    • 차트 옵션 (데이터 포함), Optional
  • Example #1 
    var chart = new sb.chart("#chartWrap", {
  data: {
      columns: [
          ["2015",3.51,4.6,3.43,7.96,3.37,5.83,0.35,3.23,-0.09,4.47,2.21,1.13,0.77,0.35,0.92,2.65,1.64,8.08]
      ]
  }
});
//렌더링-파라미터 없음
chart.render();
  • Example #2 
    var chart = new sb.chart("#chartWrap");
//렌더링-파라미터 1개
chart.render({
  data: {
      columns: [
          ["2015",3.51,4.6,3.43,7.96,3.37,5.83,0.35,3.23,-0.09,4.47,2.21,1.13,0.77,0.35,0.92,2.65,1.64,8.08]
      ]
  }
});
  • Example #3 
    var chart = new sb.chart();
//렌더링-파라미터 2개
chart.render("#chartWrap", {
  data: {
      columns: [
          ["2015",3.51,4.6,3.43,7.96,3.37,5.83,0.35,3.23,-0.09,4.47,2.21,1.13,0.77,0.35,0.92,2.65,1.64,8.08]
      ]
  }
});