paths.ts aktualisiert
This commit is contained in:
parent
182314faa0
commit
a5d3a50f0f
43
paths.ts
43
paths.ts
@ -12,9 +12,41 @@ const COLORS = [
|
||||
]
|
||||
|
||||
|
||||
numberLineFontSize = 1.25;
|
||||
numberLineStrokeWidth = 0.1;
|
||||
strokeWidth = 0.5;
|
||||
lineHeight = 0.75;
|
||||
lineGap = 1;
|
||||
points = [{ start: 0, end: 20, count: 2 }, { start: 0, end: 36.5, count: 1 }, { start: 36.5, end: 10, count: 3 }, { start: 10, end: 87, count: 1 }, { start: 87, end: 4.5, count: 1 }, { start: 4.5, end: 90, count: 1 }, { start: 90, end: 2, count: 1 }]
|
||||
points = [
|
||||
{ start: 0, end: 20, count: 2 },
|
||||
// { start: 0, end: 36.5, count: 1 },
|
||||
// { start: 36.5, end: 10, count: 3 },
|
||||
// { start: 10, end: 45, count: 1 },
|
||||
// { start: 45, end: 87, count: 1 },
|
||||
// { start: 87, end: 4.5, count: 1 },
|
||||
// { start: 4.5, end: 100, count: 1 },
|
||||
// { start: 100, end: 2, count: 1 }
|
||||
]
|
||||
|
||||
get maxPoint(): number {
|
||||
return Math.max(...this.points.map(item => item.end));
|
||||
}
|
||||
|
||||
get normalizedNumberLineFontSize(): number {
|
||||
return this.maxPoint / 100 * this.numberLineFontSize;
|
||||
}
|
||||
|
||||
get normalizedNumberLineStrokeWidth(): number {
|
||||
return this.maxPoint / 100 * this.numberLineStrokeWidth;
|
||||
}
|
||||
|
||||
get normalizedStrokeWidth(): number {
|
||||
return this.maxPoint / 100 * this.strokeWidth;
|
||||
}
|
||||
|
||||
get normalizedLineHeight(): number {
|
||||
return (this.getLineNumber(this.points.length - 1, this.points[this.points.length - 1].count) + 1) / 10 * this.lineHeight;
|
||||
}
|
||||
|
||||
get viewBox(): string {
|
||||
return `0 0 ${Math.max(...this.points.map(item => item.end))} ${this.getLineNumber(this.points.length - 1, this.points[this.points.length - 1].count) + 1}`
|
||||
@ -24,7 +56,14 @@ lineCountNumber(n: number): number[] {
|
||||
return Array(n).fill(null).map((_, i) => i + 1);
|
||||
}
|
||||
getLineNumber(index: number, lineCount: number): number {
|
||||
return this.points.slice(0, index).map(item => item.count).reduce((total, num) => total += num, 0) + lineCount;
|
||||
return this.points.slice(0, index).map(item => item.count).reduce((total, num) => total += num, 0) + lineCount + 5;
|
||||
}
|
||||
getSinglePoints(): number[] {
|
||||
// get all points in one array (start + end)
|
||||
const allPoints = this.points.map(item => [item.start, item.end]).reduce((pV, cV) => { pV.push(...cV); return pV }, []);
|
||||
// remove duplicates and sort
|
||||
const singlePoints = allPoints.filter((item, index) => allPoints.findIndex(n => n === item) === index).sort((a, b) => a - b);
|
||||
return singlePoints
|
||||
}
|
||||
getRandomColor(n: number): string {
|
||||
return COLORS[n % COLORS.length];
|
||||
|
||||
Loading…
Reference in New Issue
Block a user