64 lines
1.5 KiB
TypeScript
64 lines
1.5 KiB
TypeScript
import { path as d3 } from "d3-path";
|
|
|
|
import { ScaleBandType, ScaleLinearType } from "./graph-types";
|
|
|
|
type BarCalculationProps = {
|
|
scaleX: ScaleBandType;
|
|
scaleY: ScaleLinearType;
|
|
data: { value: number };
|
|
barNumber: number;
|
|
index: number;
|
|
barWidth: number;
|
|
gap: number;
|
|
};
|
|
|
|
export function calculateBarOrigin({
|
|
scaleX,
|
|
scaleY,
|
|
barWidth,
|
|
data,
|
|
index,
|
|
barNumber,
|
|
gap,
|
|
}: BarCalculationProps): { xOrigin: number; yOrigin: number; height: number } {
|
|
const firstBar = barNumber === 0;
|
|
const xOrigin =
|
|
scaleX(index) + (firstBar ? 0 : barWidth * barNumber + gap * barNumber);
|
|
const yOrigin = scaleY(data.value);
|
|
const height = scaleY(0) - yOrigin;
|
|
|
|
return { xOrigin, yOrigin, height };
|
|
}
|
|
|
|
export function drawBarPath(
|
|
xOrigin: number,
|
|
yOrigin: number,
|
|
barWidth: number,
|
|
height: number,
|
|
roundedRadius: number,
|
|
): string {
|
|
const path = d3();
|
|
path.moveTo(xOrigin, yOrigin + height);
|
|
path.lineTo(xOrigin, yOrigin + roundedRadius);
|
|
path.arcTo(xOrigin, yOrigin, xOrigin + roundedRadius, yOrigin, roundedRadius);
|
|
path.lineTo(xOrigin + barWidth - roundedRadius, yOrigin);
|
|
path.arcTo(
|
|
xOrigin + barWidth,
|
|
yOrigin,
|
|
xOrigin + barWidth,
|
|
yOrigin + roundedRadius,
|
|
roundedRadius,
|
|
);
|
|
path.lineTo(xOrigin + barWidth, yOrigin + height);
|
|
path.lineTo(xOrigin, yOrigin + height);
|
|
path.closePath();
|
|
|
|
return path.toString();
|
|
}
|
|
|
|
export const calculateBarWidth = (
|
|
bandwidth: number,
|
|
combinedDataLength: number,
|
|
gap: number,
|
|
) => (bandwidth - gap * (combinedDataLength - 1)) / combinedDataLength;
|