chart 질문..

[ohHyunJae]

안녕하세요 차트쓰다가 UI적으로 궁금한게 있어서....

var demandControllerCircleChart = juiChartInclude("#demandControllerCircleChart", { axis: { data: [{ title: "", value: 0, max: 900, min : 0 }] }, padding: { top: 40 }, brush: { type: "fullgauge", startAngle: 0, size: 35, format: function (value) { return ((value / 900) * 100).toFixed(0) + "%"; } } }); demandControllerCircleChart.setSize(110, 103);

이런식으로 차트를 만들었는데.. 이차트는

동그라미 안에 텍스트가 나오는 차트인데..

그 텍스트 안에 숫자 크기 어떻게 바꿀 수 있을까요...?

그리고 한가지 더...

Line chart같은거 그리고 나면 반응형이라서 창이 작아지면 그래프도 작아지고 창이 커지면 그래프도 커지는데..

혹시 반응형이 안되게 픽스시키는 방법이 있을까요..?

알려주시면 감사하겠습니다^^

[seogi1004]

차트 빌더의 width / height 기본 옵션이 100%입니다. 절대값으로 변경하시면 됩니다.

[ohHyunJae]

아 그냥 사이즈만 지정해주면 됐었군요... 그러면 아래 이미지 처럼 그래프 안에 숫자(74%임..)가 안보여서 .. 숫자를 작게해서 또는 색 등으로 변경해서.. 숫자도 보이게 하고 싶은데 방법이 없을가요..? 참고로 그래프 크기는 저렇게 픽스되어야 해요...

이 그래프는 제가 질문한 위 처럼 만들었고요

[easylogic]

@ohHyunJae 안녕하세요.

글자 크기를 줄이고 싶으시면 아래와 같이 해보세요.

style 속성으로 조절이 가능합니다.

        var c = chart("#chart", {
            width: 110,
            height : 103,
            theme : "jennifer",
            axis : {
                data : [
                    { title : '', value : 0, max : 900, min : 0 }
                ]
            },
            brush : {
                type : 'fullgauge',
                size : 35,
                startAngle : 0,
                format: function (value) {
                    return ((value / 900) * 100).toFixed(0) + "%";
                }
            },
            style : {
                gaugeFontSize: 12     // style 에 gaugeFontSize 속성을 조절하시면 됩니다. 
            }
        });

[ohHyunJae]

감사합니다!!