맨위로가기
 

SBCHART

닫기

CSS Class

#latest  #options

차트의 최상위 엘리먼트에 CSS 클래스명을 지정합니다. Class명을 통하여 스타일 변경이 가능합니다.

Options

  • global.svg.classname

    차트에 classname을 적용합니다.

    sbchart1, sbchart2를 각각 입력해보세요.

Example

사용 가능 차트 :

Code

.sbchart1 { background-color: lightcyan; }
.sbchart1 .sbchart-axis-x { font-size: 20px; }
.sbchart2 { background-color: yellow; }
var chart = sb.chart.render("#chartWrap", {
    global: {
        svg: {
            classname: document.getElementById("txtClassname").value
        }
    },
    data: {
        type: "bar",
        columns: [
            ["2016", 7707750, 7573752, 7914913, 7386713, 8708523, 8624841, 8785755, 8048044, 9083890],
            ["2017", 7958450, 8392392, 9011231, 8092838, 8829832, 7029282, 8103392, 7403013, 7182900]
        ]
    }
});
//classname
document.getElementById("txtClassname").onchange = function() {
    chart.global().svg.classname = this.value;
    chart.render();
};