d3 줌 동작. 작은 단위로 눈금 늘리기

d3 줌 동작에서 선형 눈금의 경우 어떻게 점차 확대를 증가시킬 수 있습니까? 나는 이것을 (를) 사용합니다.d3 줌 동작. 작은 단위로 눈금 늘리기

var zoom = d3.behavior.zoom() 
    .x(x) 
    .y(y) 
    .scaleExtent([1, 10]) 
    .on("zoom", zoomed);

정확하게 이해하면 차트가 최대 10 배까지 확대됩니다. 그것은, 두 번 클릭하면 10 배에 도달 할 때까지 1 배로 확대됩니다. 1, 1.2x, 1.4x 등과 같이 더 미세한 단계로 만들 수있는 방법은 무엇입니까?

감사합니다.

출처

2014-02-15 bsr

첫 번째 생각은 바닐라 전환을 적용하는 방향 이었지만 재미있는 옵션 인 [d3.interpolateZoom] (https://github.com/mbostock/d3/wiki/Transitions)과 같은 것이 있습니다. . – FernOfTheAndes

줌 레벨은 geometric series으로 증가합니다. 즉, 클릭 할 때마다 1, 2, 4 등이 배가됩니다. 기본 상호 작용을 통해 미세한 단계를 수행 할 수는 없지만 핸들러 코드에서 쉽게 수행 할 수 있습니다. 확대/축소 동작의 눈금 값과 정확히 같은 단계로 확대/축소합니다. 즉, 확대/축소 수준을 2로 설정하면 확대/축소 비율을 4에서 1.4 등으로 1.2로 설정할 수 있습니다.

더 세밀한 제어를 위해 페이지에 다른 입력 요소가있을 수도 있습니다 (예 : 줌 레벨 또는 슬라이더의 입력 상자).

출처

2014-02-15 16:07:12

d3 줌 동작. 작은 단위로 눈금 늘리기

답변

관련 문제