mirror of
https://github.com/ankitects/anki.git
synced 2025-09-18 22:12:21 -04:00
right axis for reviews graph
This commit is contained in:
parent
6592fd0da9
commit
32612fc84c
1 changed files with 26 additions and 14 deletions
|
@ -16,7 +16,7 @@ import {
|
||||||
import "d3-transition";
|
import "d3-transition";
|
||||||
import { select, mouse } from "d3-selection";
|
import { select, mouse } from "d3-selection";
|
||||||
import { scaleLinear, scaleSequential } from "d3-scale";
|
import { scaleLinear, scaleSequential } from "d3-scale";
|
||||||
import { axisBottom, axisLeft } from "d3-axis";
|
import { axisBottom, axisLeft, axisRight } from "d3-axis";
|
||||||
import { showTooltip, hideTooltip } from "./tooltip";
|
import { showTooltip, hideTooltip } from "./tooltip";
|
||||||
import { GraphBounds, setDataAvailable, GraphRange, TableDatum } from "./graphs";
|
import { GraphBounds, setDataAvailable, GraphRange, TableDatum } from "./graphs";
|
||||||
import { area, curveBasis } from "d3-shape";
|
import { area, curveBasis } from "d3-shape";
|
||||||
|
@ -158,17 +158,7 @@ export function renderReviews(
|
||||||
|
|
||||||
// y scale
|
// y scale
|
||||||
|
|
||||||
const yMax = max(bins, (b: Bin<any, any>) => cumulativeBinValue(b, 4))!;
|
const yTickFormat = (n: number): string => {
|
||||||
const y = scaleLinear()
|
|
||||||
.range([bounds.height - bounds.marginBottom, bounds.marginTop])
|
|
||||||
.domain([0, yMax]);
|
|
||||||
svg.select<SVGGElement>(".y-ticks")
|
|
||||||
.transition(trans)
|
|
||||||
.call(
|
|
||||||
axisLeft(y)
|
|
||||||
.ticks(bounds.height / 50)
|
|
||||||
.tickSizeOuter(0)
|
|
||||||
.tickFormat(((n: number): string => {
|
|
||||||
if (showTime) {
|
if (showTime) {
|
||||||
return timeSpan(i18n, n / 1000, true);
|
return timeSpan(i18n, n / 1000, true);
|
||||||
} else {
|
} else {
|
||||||
|
@ -178,7 +168,20 @@ export function renderReviews(
|
||||||
return n.toString();
|
return n.toString();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}) as any)
|
};
|
||||||
|
|
||||||
|
const yMax = max(bins, (b: Bin<any, any>) => cumulativeBinValue(b, 4))!;
|
||||||
|
const y = scaleLinear()
|
||||||
|
.range([bounds.height - bounds.marginBottom, bounds.marginTop])
|
||||||
|
.domain([0, yMax])
|
||||||
|
.nice();
|
||||||
|
svg.select<SVGGElement>(".y-ticks")
|
||||||
|
.transition(trans)
|
||||||
|
.call(
|
||||||
|
axisLeft(y)
|
||||||
|
.ticks(bounds.height / 50)
|
||||||
|
.tickSizeOuter(0)
|
||||||
|
.tickFormat(yTickFormat as any)
|
||||||
);
|
);
|
||||||
|
|
||||||
// x bars
|
// x bars
|
||||||
|
@ -306,9 +309,18 @@ export function renderReviews(
|
||||||
areaCounts.unshift(0);
|
areaCounts.unshift(0);
|
||||||
const areaData = cumsum(areaCounts);
|
const areaData = cumsum(areaCounts);
|
||||||
const yCumMax = areaData.slice(-1)[0];
|
const yCumMax = areaData.slice(-1)[0];
|
||||||
const yAreaScale = y.copy().domain([0, yCumMax]);
|
const yAreaScale = y.copy().domain([0, yCumMax]).nice();
|
||||||
|
|
||||||
if (yCumMax) {
|
if (yCumMax) {
|
||||||
|
svg.select<SVGGElement>(".y2-ticks")
|
||||||
|
.transition(trans)
|
||||||
|
.call(
|
||||||
|
axisRight(yAreaScale)
|
||||||
|
.ticks(bounds.height / 50)
|
||||||
|
.tickFormat(yTickFormat as any)
|
||||||
|
.tickSizeOuter(0)
|
||||||
|
);
|
||||||
|
|
||||||
svg.select("path.area")
|
svg.select("path.area")
|
||||||
.datum(areaData as any)
|
.datum(areaData as any)
|
||||||
.attr(
|
.attr(
|
||||||
|
|
Loading…
Reference in a new issue