c3.js 예제

로드 및 언로드가 동시에 실행해야 하는 경우 load() API에서 언로드 매개 변수를 사용하십시오. 이 예제를 참조하십시오. 자세한 내용은 github의 예제 및 문제를 확인하십시오. 가난한 문서에 대 한 죄송합니다. 우리는 지금 작업하고 나에게 시간을 주세요. 감사합니다. 스타일을 변경하려면 각 요소에 대한 클래스를 확인하십시오. 웹 검사기는 유용할 것입니다. (곧 클래스 정의를 위한 문서를 추가할 예정입니다.) C3는 비동기 모듈 정의(AMD) API를 지원합니다. 요구JS를 사용하는 경우 다음과 같이 로드할 수 있습니다: data2에 대한 추가 축을 도입합니다. 다음과 같이 data.axes 및 axis.y2.show 추가: 차트를 사용자 지정하는 서버 옵션이 있으며 여기에서 볼 수 있습니다: 차트를 생성할 때 몇 가지 옵션을 제공하여 차트를 사용자 지정할 수 있습니다. 우리는 여기에 그들 중 일부를 소개합니다. 옵션에 대한 자세한 내용은 예제를 참조하십시오.

(곧 참조를 추가 하겠습니다) 데이터2를 막대 차트로 표시합니다. 다음과 같이 data.type 추가: API를 사용하여 차트가 렌더링된 후 차트를 업데이트할 수 있습니다. 여기에 API의 일부를 소개합니다. API는 생성()에서 반환된 개체를 통해 호출할 수 있습니다. 데이터는 URL에서 열 데이터 / 행 데이터 / CSV로로드 할 수 있습니다. C3는 인수 객체를 사용하여 generate()를 호출하여 차트를 생성하고 차트를 포함한 요소는 해당 인수의 선택기로 지정된 요소에 bindto로 삽입됩니다. Bower/구성 요소에 의한 설치는 이름 c3와 함께 사용할 수도 있습니다. 각 데이터의 값을 서식을 지정합니다. 다음과 같이 axis.y.tick.format 추가: API에 대한 설명서가 제대로 수행되지 않으므로 github에서 문제를 확인하십시오. 수행하려는 내용에 대한 힌트가 있을 수 있습니다. (곧 문서를 추가할 예정입니다.) 아래 “로드” 버튼을 누르면 이 코드가 실행되고 차트가 업데이트됩니다.

이 가이드에서는 C3를 시작하는 방법을 보여 드리겠습니다. show() 및 hide() API를 사용하여 다음과 같이 데이터를 동적으로 표시/숨길 수 있습니다. 다음과 같이 축.y.label 및 축.y2.label을 추가합니다. . 줄에는 c3 line-[id] 클래스가 있으므로 이 클래스를 사용하여 다음과 같이 css의 스타일을 정의할 수 있습니다.