아카이브: 2017/3

D3.js Scale 집중탐구

D3.js Scale 집중탐구 - 1기본적으로 scale을 그리는 이미지의 크기와 컬러를 자동으로 조정하느 기능을 담당한다. 읽어온 데이터값을 건들지 않고 그 데이터값에 맞는 크기와 컬러 범위를 시각화 할때 자동으로 맞춰준다. d3.scaleLinear() d3.scalePow() d3.scaleLog() 12345678910111213141516171

D3.js Scale

D3.js Scaled3.js 의 scale은 어떤 범위를 숫자를 다른 범위로 숫자로 변경해서 그릴려고 하는 영역 공간에 그 크기를 자동으로 조절하여 시각화 하는데 사용하는 함수가 바로 scale 메소드 이다. scale API d3.scaleTime() d3.scaleLinear() d3.scalePow() d3.scaleLog() d3.scaleIde

D3.js Functions

D3.js 배열의 유용한 함수d3,js의 배열의 유용한 함수들 이다. 12345678910111213var data = [1, 2, 3, 4, 5];d3.min(data); // 최소값d3.max(data); // 최대값d3.extent(data); // [최소, 최대]d3.extent(data); // 합d3.mean(data); // 산술 평균치d3.m

D3.js Axis API

D3.js axis API차트에서 축은 너무나 자주 사용되므로 축을 생성하는 기능을 d3.js안에 내장 되어있다. 축에서는 눈금을 표현해야하고 적당한 값을 넣어줘야하는 등 복잡한 일이 많다만, 이러한 복잡성을 d3.js가 간단히 처리해준다.2차원의 차트에서 축이 올 수 있는 자리는 상하좌우이므로 다음과 같은 함수가 제공된다. axis API d3.axis

D3.js

D3.js 란D3.js (Data-Driven Documents)는 데이터 기반으로 문서를 처리하는 자바스크립트 라이브러리 이다. HTML5, CSS, SVG(Scalable Vector Graphic) 문서 객체를 데이터 기반으로 접근하여 인터렉티브한 정보시각화(그래프 차트)를 구현할 수 있다. 현재 d3.js는 2016년 6월 새롭게 런칭된 v4.x버전