Lines circle

Developer
Takashi
Size
1,959 Kb
Views
10,120
  1. Lines circle Previews
  2. Lines circle HTML Codes
  3. Lines circle CSS Codes
  4. Lines circle JS Codes

How do I make an lines circle?

What is a lines circle? How do you make a lines circle? This script and codes were developed by Takashi on 20 October 2022, Thursday.

Lines circle Previews
IQ Test

Lines circle - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>lines circle</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <script src='https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.4.21/p5.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Lines circle - Script Codes CSS Codes

body {padding: 0; margin: 0;}

Lines circle - Script Codes JS Codes

var g_freq = 0;
var g_col_i = 0;
var radius = 0;
var freq_increase = true;
var col_increase = true;
function setup(){ createCanvas(windowWidth, windowHeight); background(0); colorMode(HSB); init();
}
function draw(){ //clear(); background(0); if(freq_increase){ g_freq += 0.02; }else{ g_freq -= 0.02; } if(g_freq>100){ g_freq = 100; freq_increase = false; }else if(g_freq<0){ g_freq = 0; freq_increase = true; } drawLine();
}
function windowResized() { resizeCanvas(windowWidth, windowHeight); init();
}
/*
カスタム関数
-------------------------------*/
function drawLine(){ for(var i=0; i<360; i+=1){ g_col_i += 2; push(); var cx = cos(radians(i)) * radius + windowWidth/2; var cy = sin(radians(i)) * radius + windowHeight/2; translate(cx,cy); rotate(radians(i*g_freq)); stroke(g_col_i%360,100,100,1); strokeWeight(1); line(0,0,radius,0); pop(); }
}
function init(){ if(windowWidth>windowHeight){ radius = windowHeight * 0.2; }else{ radius = windowWidth * 0.2; }
}
Lines circle - Script Codes
Lines circle - Script Codes
Home Page Home
Developer Takashi
Username tksiiii
Uploaded October 20, 2022
Rating 3
Size 1,959 Kb
Views 10,120
Do you need developer help for Lines circle?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Takashi (tksiiii) Script Codes
Name
Wave2D
Glitch Effect
Magic circle5
Glittering particle
Magic circle1
Sierpinski
Colorful smoke
Noise curve 2D
Magic circle4
Rose curve animation
Create amazing marketing copy with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!