mirror of
https://github.com/leporello-js/leporello-js
synced 2026-01-13 21:14:28 -08:00
deploy: leporello-js/app@a6e3f1b36f
This commit is contained in:
@@ -2,30 +2,29 @@
|
||||
// Author: Sarah Bricault
|
||||
|
||||
// Canvas setup
|
||||
const canvas = document.createElement('canvas')
|
||||
const canvas = document.createElement("canvas")
|
||||
canvas.width = 700
|
||||
canvas.height = 700
|
||||
document.body.appendChild(canvas)
|
||||
const ctx = canvas.getContext('2d')
|
||||
const ctx = canvas.getContext("2d")
|
||||
ctx.translate(canvas.width / 2, canvas.height)
|
||||
|
||||
// Draw a tree
|
||||
fractalTreeBasic({totalIterations: 10, basicLength: 10, rotate: 25})
|
||||
|
||||
function fractalTreeBasic({totalIterations, basicLength, rotate}) {
|
||||
fractalTreeBasic({ totalIterations: 10, basicLength: 10, rotate: 25 })
|
||||
|
||||
function fractalTreeBasic({ totalIterations, basicLength, rotate }) {
|
||||
// Draw the tree trunk
|
||||
const trunkLength = basicLength * 2 * Math.pow(1.2, totalIterations + 1)
|
||||
const width = Math.pow(totalIterations, 0.6)
|
||||
|
||||
ctx.beginPath()
|
||||
ctx.moveTo(0, 0)
|
||||
ctx.lineTo(0, - trunkLength)
|
||||
ctx.lineTo(0, -trunkLength)
|
||||
ctx.lineWidth = width
|
||||
ctx.strokeStyle = 'black'
|
||||
ctx.strokeStyle = "black"
|
||||
ctx.stroke()
|
||||
|
||||
drawBranch(90, [0, - trunkLength], totalIterations + 1)
|
||||
drawBranch(90, [0, -trunkLength], totalIterations + 1)
|
||||
|
||||
function drawBranch(angle, startPoint, iterations) {
|
||||
const len = basicLength * Math.pow(1.2, iterations)
|
||||
@@ -34,7 +33,7 @@ function fractalTreeBasic({totalIterations, basicLength, rotate}) {
|
||||
|
||||
const red = Math.floor(255 - (iterations / totalIterations) * 255)
|
||||
const green = 0
|
||||
const blue = Math.floor( 255 - (iterations / totalIterations) * 255)
|
||||
const blue = Math.floor(255 - (iterations / totalIterations) * 255)
|
||||
const color = `rgb(${red}, ${green}, ${blue})`
|
||||
|
||||
const x1 = startPoint[0]
|
||||
@@ -43,7 +42,7 @@ function fractalTreeBasic({totalIterations, basicLength, rotate}) {
|
||||
const y2 = y1 - len * Math.sin((angle * Math.PI) / 180)
|
||||
const x2 = x1 + len * Math.cos((angle * Math.PI) / 180)
|
||||
|
||||
console.log('draw branch', x1, y1, x2, y2)
|
||||
console.log("draw branch", x1, y1, x2, y2)
|
||||
|
||||
ctx.beginPath()
|
||||
ctx.moveTo(x1, y1)
|
||||
|
||||
Reference in New Issue
Block a user