juijs / jui-chart

SVG-based JUI chart that can be used in the browser and Node.js. Support many types of charts. (Dashboard, Map, Topology, Full 3D, Realtime)
https://codepen.io/collection/nLydod/
57 stars 25 forks source link

라인 차트 관련 질문하나더 드리겠습니다. #127

Closed ytechinfo closed 7 years ago

ytechinfo commented 7 years ago

질문하나더 드리겠습니다. 라인차트에서 차트를 그리고난뒤 데이타를 아래와 같이 업데이트 하였습니다

var chartObj = chart.axis(0);
chartObj.updateGrid("x", { domain : [ "2011", "2012", "2013" ] }); chartObj.update(data);

업데이트하고 나서 차트는 정상으로 나오긴 하는데 .
콘솔창에 아래와 같은 에러가 발생하고 있습니다. 확인 부탁드리겠습니다.

테스트 브라우저 : chrome url : http://chartplay.jui.io/?p=active_line

--에러 내용.

VM2089:2 Error: <path> attribute d: Expected number, "…47951171875002 Lnull,41.07451171…".attr @ core.min.js:2join @ core.min.js:2h @ core.min.js:2h @ core.min.js:2h @ core.min.js:2render @ core.min.js:2render @ chart.min.js:1set @ chart.min.js:1(anonymous function) @ VM2089:2
VM2089:2 Error: <path> attribute d: Expected number, "…375,326.265625 Lnull,318.1672460…".attr @ core.min.js:2join @ core.min.js:2h @ core.min.js:2h @ core.min.js:2h @ core.min.js:2render @ core.min.js:2render @ chart.min.js:1set @ chart.min.js:1(anonymous function) @ VM2089:2
VM2089:2 Error: <path> attribute d: Expected number, "…22453124999998 Lnull,275.1118359…".attr @ core.min.js:2join @ core.min.js:2h @ core.min.js:2h @ core.min.js:2h @ core.min.js:2render @ core.min.js:2render @ chart.min.js:1set @ chart.min.js:1(anonymous function) @ VM2089:2
VM2089:3 Error: <path> attribute d: Expected number, "…47951171875002 Lnull,41.07451171…".attr @ core.min.js:2join @ core.min.js:2h @ core.min.js:2h @ core.min.js:2h @ core.min.js:2render @ core.min.js:2render @ chart.min.js:1screen @ chart.min.js:1update @ chart.min.js:1(anonymous function) @ VM2089:3
VM2089:3 Error: <path> attribute d: Expected number, "…375,326.265625 Lnull,318.1672460…".attr @ core.min.js:2join @ core.min.js:2h @ core.min.js:2h @ core.min.js:2h @ core.min.js:2render @ core.min.js:2render @ chart.min.js:1screen @ chart.min.js:1update @ chart.min.js:1(anonymous function) @ VM2089:3
VM2089:3 Error: <path> attribute d: Expected number, "…22453124999998 Lnull,275.1118359…".

var chart = jui.include("chart.builder");
var data = [
    { apple : 26.1, microsoft : 24.86, oracle : 22.08 },
    { apple : 43.83, microsoft : 27.14, oracle : 30.15 },
    { apple : 55.03, microsoft : 24, oracle : 36.88 },
    { apple : 72.95, microsoft : 25.39, oracle : 32.78 }
];

chart=chart("#result", {
    axis : {
        x : {
            type : "fullblock",
            domain : [ "2010", "2011", "2012", "2013" ],
            line : true
        },
        y : {
            type : "range",
            domain : function(d) {
                return Math.max(d.apple, d.microsoft, d.oracle);
            },
            step : 10
        },
        data : data
    },
    brush :  [{
         type : "line",
      display:'max',
      clip : false , 
      animate :true
    }],
    widget : [
        { type : "title", text : "Line Sample" },
        { type : "legend" }
    ]
});
easylogic commented 7 years ago

답변이 늦어서 죄송합니다. data 에서 사용되는 개수랑 domain 에서 사용되는 개수랑 달라서 생기는 문제 같습니다.

좀 더 확인해보고 말씀 드릴게요.