2020-06-22 07:00:45 +02:00
|
|
|
// Copyright: Ankitects Pty Ltd and contributors
|
|
|
|
// License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|
|
|
|
|
|
|
/* eslint
|
|
|
|
@typescript-eslint/no-non-null-assertion: "off",
|
|
|
|
@typescript-eslint/no-explicit-any: "off",
|
2020-06-23 05:43:23 +02:00
|
|
|
*/
|
2020-06-22 07:00:45 +02:00
|
|
|
|
2020-06-23 05:43:23 +02:00
|
|
|
import pb from "../backend/proto";
|
2020-07-06 06:01:49 +02:00
|
|
|
import { extent, histogram, quantile, sum } from "d3-array";
|
2020-06-23 12:43:19 +02:00
|
|
|
import { scaleLinear, scaleSequential } from "d3-scale";
|
2020-06-22 07:00:45 +02:00
|
|
|
import { CardQueue } from "../cards";
|
2020-06-23 11:07:47 +02:00
|
|
|
import { HistogramData } from "./histogram-graph";
|
2020-06-23 12:43:19 +02:00
|
|
|
import { interpolateBlues } from "d3-scale-chromatic";
|
2020-06-28 12:52:38 +02:00
|
|
|
import { I18n } from "../i18n";
|
2020-06-22 07:00:45 +02:00
|
|
|
|
|
|
|
export interface IntervalGraphData {
|
|
|
|
intervals: number[];
|
|
|
|
}
|
|
|
|
|
|
|
|
export enum IntervalRange {
|
|
|
|
Month = 0,
|
|
|
|
Percentile50 = 1,
|
|
|
|
Percentile95 = 2,
|
|
|
|
Percentile999 = 3,
|
|
|
|
All = 4,
|
|
|
|
}
|
|
|
|
|
2020-06-22 11:11:50 +02:00
|
|
|
export function gatherIntervalData(data: pb.BackendProto.GraphsOut): IntervalGraphData {
|
2020-06-24 01:41:07 +02:00
|
|
|
const intervals = (data.cards as pb.BackendProto.Card[])
|
2020-06-22 07:00:45 +02:00
|
|
|
.filter((c) => c.queue == CardQueue.Review)
|
|
|
|
.map((c) => c.ivl);
|
|
|
|
return { intervals };
|
|
|
|
}
|
|
|
|
|
2020-06-28 12:52:38 +02:00
|
|
|
export function intervalLabel(
|
|
|
|
i18n: I18n,
|
|
|
|
daysStart: number,
|
|
|
|
daysEnd: number,
|
|
|
|
cards: number
|
2020-06-24 01:41:07 +02:00
|
|
|
): string {
|
2020-06-28 12:52:38 +02:00
|
|
|
if (daysEnd - daysStart <= 1) {
|
|
|
|
// singular
|
|
|
|
return i18n.tr(i18n.TR.STATISTICS_INTERVALS_DAY_SINGLE, {
|
|
|
|
day: daysStart,
|
|
|
|
cards,
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
// range
|
|
|
|
return i18n.tr(i18n.TR.STATISTICS_INTERVALS_DAY_RANGE, {
|
|
|
|
daysStart,
|
2020-07-08 06:01:09 +02:00
|
|
|
daysEnd: daysEnd - 1,
|
2020-06-28 12:52:38 +02:00
|
|
|
cards,
|
|
|
|
});
|
|
|
|
}
|
2020-06-23 10:40:53 +02:00
|
|
|
}
|
|
|
|
|
2020-06-23 11:07:47 +02:00
|
|
|
export function prepareIntervalData(
|
2020-06-23 09:25:28 +02:00
|
|
|
data: IntervalGraphData,
|
2020-06-28 12:52:38 +02:00
|
|
|
range: IntervalRange,
|
|
|
|
i18n: I18n
|
2020-06-23 12:43:19 +02:00
|
|
|
): HistogramData | null {
|
2020-06-23 09:25:28 +02:00
|
|
|
// get min/max
|
|
|
|
const allIntervals = data.intervals;
|
2020-06-23 12:43:19 +02:00
|
|
|
if (!allIntervals.length) {
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
|
2020-06-23 09:25:28 +02:00
|
|
|
const total = allIntervals.length;
|
2020-06-28 12:52:38 +02:00
|
|
|
const [_xMinOrig, origXMax] = extent(allIntervals);
|
2020-06-23 05:43:23 +02:00
|
|
|
let xMax = origXMax;
|
2020-06-23 09:25:28 +02:00
|
|
|
|
|
|
|
// cap max to selected range
|
|
|
|
switch (range) {
|
2020-06-23 05:43:23 +02:00
|
|
|
case IntervalRange.Month:
|
|
|
|
xMax = Math.min(xMax!, 31);
|
|
|
|
break;
|
|
|
|
case IntervalRange.Percentile50:
|
|
|
|
xMax = quantile(allIntervals, 0.5);
|
|
|
|
break;
|
|
|
|
case IntervalRange.Percentile95:
|
|
|
|
xMax = quantile(allIntervals, 0.95);
|
|
|
|
break;
|
|
|
|
case IntervalRange.Percentile999:
|
|
|
|
xMax = quantile(allIntervals, 0.999);
|
|
|
|
break;
|
|
|
|
case IntervalRange.All:
|
|
|
|
break;
|
|
|
|
}
|
2020-06-28 12:52:38 +02:00
|
|
|
const xMin = 0;
|
2020-06-23 10:40:53 +02:00
|
|
|
xMax = xMax! + 1;
|
2020-06-23 05:43:23 +02:00
|
|
|
|
2020-06-23 09:25:28 +02:00
|
|
|
// cap bars to available range
|
|
|
|
const desiredBars = Math.min(70, xMax! - xMin!);
|
2020-06-23 05:43:23 +02:00
|
|
|
|
2020-06-23 10:40:53 +02:00
|
|
|
const scale = scaleLinear().domain([xMin!, xMax!]).nice();
|
2020-06-23 09:25:28 +02:00
|
|
|
const bins = histogram()
|
|
|
|
.domain(scale.domain() as any)
|
|
|
|
.thresholds(scale.ticks(desiredBars))(allIntervals);
|
2020-06-23 05:43:23 +02:00
|
|
|
|
2020-07-06 06:01:49 +02:00
|
|
|
// empty graph?
|
|
|
|
if (!sum(bins, (bin) => bin.length)) {
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
|
2020-06-23 12:43:19 +02:00
|
|
|
// start slightly darker
|
|
|
|
const shiftedMin = xMin! - Math.round((xMax - xMin!) / 10);
|
|
|
|
const colourScale = scaleSequential(interpolateBlues).domain([shiftedMin, xMax]);
|
|
|
|
|
2020-06-28 12:52:38 +02:00
|
|
|
function hoverText(
|
|
|
|
data: HistogramData,
|
|
|
|
binIdx: number,
|
|
|
|
_cumulative: number,
|
|
|
|
percent: number
|
|
|
|
): string {
|
|
|
|
const bin = data.bins[binIdx];
|
|
|
|
// const day = dayLabel(i18n, bin.x0!, bin.x1!);
|
|
|
|
const interval = intervalLabel(i18n, bin.x0!, bin.x1!, bin.length);
|
|
|
|
const total = i18n.tr(i18n.TR.STATISTICS_RUNNING_TOTAL);
|
|
|
|
return `${interval}<br>${total}: ${percent.toFixed(1)}%`;
|
|
|
|
}
|
|
|
|
|
2020-06-23 12:43:19 +02:00
|
|
|
return { scale, bins, total, hoverText, colourScale, showArea: true };
|
2020-06-23 09:25:28 +02:00
|
|
|
}
|