Line chart 관련 질문

[yimchang]

안녕하세요 Line Chart 관련 질문이 있어 이렇게 글을 올립니다.

jui chart를 통해 단가표를 만드는 상황입니다.

현재 data변수에 날짜가 들어간 상태이며 data변수에 있는 날짜 데이털르 통해 x축의 최소값, 최대값 지정을 해주는 상태입니다. ( 최초 날짜 ~ 현재 날짜)

이 상황에서 interval 값을 하루가 아닌 그 이상의 값으로 설정하면 x축의 날짜가 최초 날짜(0,0) 이외에 보이지 않는 상황입니다. 이 상황을 고치려면 어떻게 해야할까요?

해결 방안 중 생각하는 방법 하나는 예를들면 7/1 ~ 7/15 일까지의 데이터를 보여줄 때 x축 (일 수 )기준으로 7/1~부터 15일까지의 그래프를 그리려는 상황입니다. 이 상황에서 7/1일 부터 데이터를 그리는게 아닌 7/15일을 기준으로 거꾸로 데이터를 그리는 방법이 있나요?

interval 값은

var oneDay = 24 * 3600 * 1000;
            var interval = 0;
            if (range == '7d') {   //1주일
                interval = oneDay;
            } else if (range == '1m') {  //1개월
                interval = oneDay * 3;
            } else if (range == '3m') { //3개원
                interval = oneDay * 7;
            } else if (range == '6m') { //6개월
                interval = oneDay * 15;
            } else if (range == '1y') { //1년
                interval = oneDay * 30;
            } else {
                interval = oneDay;
            }

입니다

제가 사용하는 jui chart 코드는 아래와 같습니다.

function drawGraph(data, interval, minPrc, maxPrc) { graph.ready([ "chart.builder" ], function(builder) { builder("#chart", { width: $("body").width()-32, height: 400, axis : { x : { type : "date" , domain : [data[0].date, data[data.length - 1].date] , interval : interval , format : "MM.dd" , key : "date" , line : true }, y : { type : "range" , domain : [minPrc, maxPrc] , step : 5 , format : function(value) { return format.num(value); } }, data : data }, brush : [{ type : "line" , target : ["salePrc"] , display :"min" , colors : function(data, i) { return "#F26A21"; } }, { type : "area" , target : ["salePrc"] , colors : function(data, i) { return "#FEF0E8"; } }, { type : "scatter" , size : 9 , target : ["salePrc"] , colors : function(data, i) { return "#F26A21"; } }], widget : [ { type : "tooltip", orient : "top", format : function(data, key) { return format.num(data["salePrc"]); }, brush : 2 }], style : { tooltipBorderColor : "#F26A21" , tooltipBackgroundColor : "#F26A21" , tooltipFontColor : "#FFFF" } }); }); }