luigi.byun edited this page Apr 8, 2015 · 242 revisions

D3.js는 데이터 기반으로 문서수정을 하기 위한 Javascript 라이브러리다. D3.js는 HTML, SVG, CSS를 사용해서 데이터에 활기를 부어준다. 웹 표준상에서 D3의 주안점은 개발자가 강력한 비주얼라이제이션 컴포넌트들을 결합한 자체 프로임워크로 작업하지 않아도 최신 브라우저의 호환성을 보장하는 것이다. 그리고 DOM 수정에 대해서 데이터 관점에서 접근한다.

Resources

Browser Support

D3는 소위 '모던 브라우저'를 지원한다. 이 말은 일반적으로 IE8 이전 버전을 제외한 브라우저들을 말한다. D3는 파이어폭스, 크롬(크로미엄), 사파리(WebKit), 오페라, IE9에서 테스트했다. 하지만 D3의 일부는 오래된 브라우저에서 작동할 지도 모른다. D3의 코어 라이브러리는 Javascript와 W3C DOM API만 필수 사항으로 전재하기 때문이다. IE8을 위한 호환성 라이브러리로 Aight를 추천한다. D3는 Selectors API Level 1를 사용하지만 호환성을 위해서 Sizzle를 D3를 로드하기 전에 로드할 수도 있다. 여러분은 SVGCSS3 Transitions를 사용하는 모던 브라우저가 필요하다. D3는 이를 위한 호환성 계층이 없으므로 여러분의 브라우저가 이 표준을 지원하지 않으면 안타깝지만. 안녕~

Installing

최신 버전은 여기서 다운 받는다.

최신 버전을 바로 링크 걸고 싶다면 다음 코드를 복사한다.

<script src="http://d3js.org/d3.v3.min.js"></script>

테스트가 포함된 저장소 전체를 원하는 경우.

https://github.com/mbostock/d3/zipball/master

아니면 커맨드 명령어.

git clone git://github.com/mbostock/d3.git

로컬에서 개발을 할 때, 로컬 파일시스템 밖의 파일에 접근하면 브라우저가 엄격한 권한으로 막을 수도 있다. 예를 들어, 로컬에서 d3.xhr를 사용한다면 반드시 로컬 웹서버가 있어야 한다. 이 경우, 파이썬의 빌트인 서버를 돌리 수도 있다.

python -m SimpleHTTPServer 8888 &

파이썬3에서는

python -m http.server 8888 &

이 명령을 실행한 후에 http://localhost:8888/examples/를 브라우저에 띄운다.

D3를 사용한 비주얼라이제이션을 새로 만들 목적이라면, D3 레파지토리로 족하지만 그게 아니고, D3에 새로운 기능을 추가하거나 버그를 고치거나 유닛테스트를 실행하는 경우라면 D3 레파지토리를 포크 받고 Node.js를 설치 한다. D3 레파지토리 루트폴더에서 D3의 의존성 라이브러리를 설치 할 수 있다.

npm install

테스트를 실행하려면 다음처럼 한다.

make test
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.