2015-02-01 6 views
0

웹 페이지에 꺾은 선형 차트를 만들 때 c3 + d3 + javascript를 사용하고 있습니다. 로컬로 잘 작동하는 코드를 만들었지 만 서버에 업로드하면 코드가 작동하지 않습니다. 나는 아래의 문제를 설명 :c3.generate 오류가 발생하지 않음

문제 : (에 코드 : http://jsfiddle.net/xq6wmyvp/10/

var chart; 
function initialize(path) { 
    try { 
     c3.generate({ 
      bindto: '#chart', 
      data: { 
       x: 'label', 
       url: path, 
       type: 'line', 
      }, 
      axis: { 
       x: { 
        type: 'categories', 
        label: { 
         text: 'days', 
        }, 
       }, 
       y: { 
        label: { 
         text: 'yield', 
        }, 
        tick: { 
         format: d3.format(".2%") 
        } 
       } 
      }, 
     }); 
    } catch (err) { 
     return false; 
    } 
    return true; 
} 
var path1 = 'https://gist.githubusercontent.com/SamMorrowDrums/f571240047c0344a4af8/raw/433eae455570b64edcdc7ece39416b468b612f49/test.csv'; 
alert(initialize('blabla')); 

코드 설명 : 서버에

JSFiddle을 업로드 할 때 c3.generate 오류를 던지고되지 않는다 바이올린)에는 일부 데이터를 사용하여 선 그래프로 차트를 초기화하는 기능이 있습니다. 데이터에 대한 경로는 해당 함수에 대한 변수로 주어집니다 (이를 '초기화 (경로)'라고 함). 이 함수는 c3.generate를 사용하여 그래프를 만듭니다. 데이터를 사용할 수 없거나 존재하지 않는 경우 c3.generate는 오류를 발생시킵니다 (이 문제는 로컬에서 발생하지만 서버에 업로드 할 때 발생하지는 않습니다).이 함수는 false를 반환합니다. 데이터가 있으면 그래프가로드되고 '초기화'가 true를 반환합니다.

문제가 다시 : 코드를 서버에 업로드 한 후 '초기화 (경로)'함수는 데이터가 사용 가능/사용하지 않아도 'true'만 반환합니다.

이 문제를 해결하는 방법을 모르겠습니다. 너 나 좀 도와 줄 수있어? 읽어 주셔서 감사합니다.

(문제 Github에서 링크 : https://github.com/masayuki0812/c3/issues/960)

+1

c3에서는 데이터를 검색하기 위해'd3.xhr'을 사용하고 있습니다. 이것은 비동기 호출로서'try' 블록 외부에 있다는 것을 의미합니다. – Mark

+0

try 블록에 '포함'할 수있는 방법이 있습니까? 또는 데이터를로드 할 수없는 경우 오류가 발생합니까? 로컬로 작동하는 이유는 무엇입니까? 도와 줘서 고맙다! –

+0

@ 마크이 문제를 해결하는 방법에 대한 아이디어가 있습니까? 당신은 나에게 몇 가지 조언을 줄 수 있습니까 (나는 죄송합니다). –

답변

1

나는 후드 C3에서, 내 댓글에 명시된 바와 같이 데이터를 검색하기 위해 d3.xhr을 사용하고 있습니다. 이것은 try 블록 외부에있는 비동기 호출입니다.

가능한 해결 방법은 다음과 같습니다 :

1.), 라인 1903에서, c3 source code에 고정하면 오류가 감소되고 참조하십시오.

2 )는 global error handler

3.) C3의 URL 옵션을 사용하지 마십시오 만듭니다. 자신의 d3 xhr 요청을 보내고 (적절한 방법으로 오류 처리) 성공하면 columns 옵션으로 c3.generate를 호출하십시오. 이것이 내가하는 방식이다.

d3.csv("path/to/file.csv", function(error, json) { 
    if (error){ 
     // handle error properly 
     return; 
    } 
    c3.generate({ 
    ... 
    }); 
}); 
+0

나는 당신을 사랑합니다. 답변 해 주셔서 감사합니다. 내가 지금 문제를 해결할 수 있는지 보자! –