C3JS - 정의되지 않은 'category10'속성을 읽을 수 없습니다.

jsfiddle (https://jsfiddle.net/varunoberoi/mcd6ucge)에서이 c3.js 코드를 시도했지만 로컬 호스트에서 작동하지 않습니다.C3JS - 정의되지 않은 'category10'속성을 읽을 수 없습니다.

내 서버로 uniserver를 사용하고 있습니다. 나는 복사 - 붙여 넣기 모든 것을하지만 작동하지 않습니다. 내가 개발자 도구 '콘솔을 확인할 때 내가 가진 무엇

는

<html> 
    <head> 
     <!-- CSS --> 
     <link href="css/c3.css" rel="stylesheet" type="text/css" /> 

     <!-- JAVASCRIPT --> 
     <script src="js/d3.min.js" type="text/javascript"></script> 
     <script src="js/c3.js" type="text/javascript"></script> 

     <script type="text/javascript"> 
      window.onload=function(){ 
       var chart = c3.generate({ 
        data: { 
         columns: [ 
          ['data1', 300, 350, 300, 0, 0, 0], 
          ['data2', 130, 100, 140, 200, 150, 50] 
         ], 
         types: { 
          data1: 'area', 
          data2: 'area-spline' 
         } 
        }, 
        axis: { 
         y: { 
          padding: {bottom: 0}, 
          min: 0 
         }, 
         x: { 
          padding: {left: 0}, 
          min: 0, 
          show: false 
         } 
        } 

       }); 
      } 
     </script> 
    </head> 
    <body> 
     <div id="chart"></div> 
    </body> 
</html>

이것이다 :

c3.js:5783 Uncaught TypeError: Cannot read property 'category10' of undefined

나는 c3.js하지만 아무것도의 다른 버전을 시도했다. 그것은 jsfiddle에서 일하고 내 지역에서는 작동하지 않기 때문에 이상합니다.

출처

2016-07-13 JJC

두 라이브러리의 전체 절대 경로를 제공하도록하십시오. 코드를 몸체의 끝으로 옮기는 것도 좋은 생각입니다. –

일부 조합을 수행 한 후에 작동하지 않는 d3.js 경로가 나타납니다. 전체 localhost 경로와 C : 드라이브 경로를 제공하려했지만 여전히 작동하지 않습니다. 내가 가진 해결책은 외부 URL (http://d3js.org/d3.v3.js)을 사용하는 것입니다. 어떻게 작동하는지는 모르겠지만 그래, 지금은 효과가있다. 당신의 아이디어에 감사드립니다. :) – JJC

가치가있는 것을 위해 D3.js v4 (4.1.1)에서 v3 (3.5.17)으로 다운 그레이드하여 다른 프로젝트에서 똑같은 JS 오류를 해결했습니다. –

D3.js v4 (4.1.1)에서 v3 (3.5.17)으로 다운 그레이드하여 다른 프로젝트에서 동일한 JavaScript 오류를 해결했습니다.

그것은 C3.js 년 7 월 2016 does not support D3.js v4의로 밝혀 :

그것은 확실히 작동하지 않습니다 것은 [D3.js] 4.0로-입니다. D3 v4는 전혀 다른 네임 스페이스를 가지며 역 호환되지 않습니다. v4로 업데이트하는 것은 아주 간단한 작업입니다.

출처

2016-07-16 12:17:48

여기에서 버전을 얻을 수 있습니다. https://github.com/d3/d3/releases/tag/v3.5.17? 답변 해 주셔서 감사합니다. – agoldev

npm을 사용하지 않고 D3의 레일스 젬을 사용하고 있다면이 파일을 gem 파일에 추가하면 문제가 해결 될 것입니다. 'gem'd3-rails ','~> 3.5.17'' – Brandt

https://rubygems.org/ gems/d3-rails/versions/3.5.17 Oh 또한 위의 주석에서 참조하고있는 gem 버전에 대한 링크입니다. – Brandt

C3.js는 D3 v3을 기반으로하며 D3 v4와 함께 실행하려고하면 오류가 발생하기 때문입니다.

오류 코드의 라인 아래에 발생합니다

pattern = notEmpty(config.color_pattern) ? 
    config.color_pattern : d3.scale.category10().range()

D3의 V4에 https://github.com/c3js/c3/blob/master/src/color.js#L7

, d3.scale.category10().range()이 d3.scaleOrdinal(d3.schemeCategory10) 표기하고 있지만, C3.js는 실행되지 않을 수 D3 v4에서 코드의이 부분 만 변경하는 것은 의미가 없습니다. 사람이 D3의 V4의 + 작업이 필요한 경우

, https://naver.github.io/billboard.js/을 시도합니다.

billboard.js은 D3 v4 + 지원과 동일한 인터페이스를 가진 C3.js의 분기 프로젝트입니다.

출처

2017-06-08 06:34:49

이 링크는 질문에 대답 할 수 있지만 답변의 핵심 부분을 여기에 포함시키고 참조 용 링크를 제공하는 것이 좋습니다. 링크 된 페이지가 변경되면 링크 전용 답변이 유효하지 않게 될 수 있습니다. - [From Review] (리뷰/저품절 게시물/18821943) –

C3JS - 정의되지 않은 'category10'속성을 읽을 수 없습니다.

답변

관련 문제