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