Add dynamic line thickness

This commit is contained in:
Florine W. Dekker 2021-10-31 17:07:11 +01:00
parent c5e9d763ce
commit 93816fad4b
Signed by: FWDekker
GPG Key ID: D3DCFAA8A4560BE0
1 changed files with 8 additions and 8 deletions

View File

@ -123,8 +123,9 @@ class Line {
* Global constants.
*/
const settings = {
dotRadius: 10,
dotRadius: 20,
fillGoal: 0.3,
lineThicknesses: [1, 5, 15],
stepTime: 250,
stepsPerLevel: 5,
zoomSpeed: 1 / 30,
@ -142,8 +143,7 @@ doAfterLoad(() => {
// Model
// TODO: Dynamic thickness calculation
const lines: Line[] = [new Line(1), new Line(5)];
const lines: Line[] = [new Line(settings.lineThicknesses[0]), new Line(settings.lineThicknesses[1])];
let step = 0;
setInterval(() => {
const currentLevel = lines.findIndex(it => it.segments.length !== 25);
@ -164,7 +164,7 @@ doAfterLoad(() => {
if (lowerLines.segments.length !== 0 && lowerLines.segments.length % 5 === 0) {
if (lines.length <= inductionLevel) {
lines[inductionLevel] = new Line(5 ** inductionLevel);
lines[inductionLevel] = new Line(settings.lineThicknesses[level] / zoomFactor);
}
lines[inductionLevel].segments.push(lowerLines.sumSegmentsSlice(-settings.stepsPerLevel));
@ -208,13 +208,13 @@ doAfterLoad(() => {
// Zoom
const excessFactor = Math.max(
((1 / zoomFactor) * maxPoint.x) / (canvas.width * settings.fillGoal),
((1 / zoomFactor) * maxPoint.y) / (canvas.height * settings.fillGoal)
(zoomFactor * maxPoint.x) / (canvas.width * settings.fillGoal),
(zoomFactor * maxPoint.y) / (canvas.height * settings.fillGoal)
);
if (excessFactor > 1) {
zoomFactor *= excessFactor ** settings.zoomSpeed;
zoomFactor /= excessFactor ** settings.zoomSpeed;
}
ctx.scale(1 / zoomFactor, 1 / zoomFactor);
ctx.scale(zoomFactor, zoomFactor);
// Lines
ctx.strokeStyle = "#ffffff";