yuhhxn द्वारा एक कोड

810 yuhhxn

संपादक में खोलें अपना कोड प्रकाशित करें

अनुशंसित

16 March 2024

साइड मेनू कोड HTML

24 February 2025

कोडपेन होम पुश बटन

10 December 2024

हंगन द्वारा एक कोड

HTML

CSS

JS

const canvas = document.getElementById('network-canvas');

const ctx = canvas.getContext('2d');

canvas.width = window.innerWidth;

canvas.height = window.innerHeight;

const nodes = [];

const maxNodes = 100;

const maxDistance = 100;

// Yeşil tonlar için renk ayarları

const nodeColor = '#00ff4c'; // Daha parlak yeşil

const lineColorBase = '0, 255, 76'; // RGB yeşil ton

class Node {

constructor(x, y) {

this.x = x;

this.y = y;

this.vx = (Math.random() - 0.5) * 2;

this.vy = (Math.random() - 0.5) * 2;

}

update() {

this.x += this.vx;

this.y += this.vy;

if (this.x < 0 || this.x > canvas.width) this.vx *= -1;

if (this.y < 0 || this.y > canvas.height) this.vy *= -1;

}

draw() {

ctx.beginPath();

ctx.arc(this.x, this.y, 2, 0, Math.PI * 2);

ctx.fillStyle = nodeColor;

ctx.fill();

}

for (let i = 0; i < maxNodes; i++) {

nodes.push(new Node(Math.random() * canvas.width, Math.random() * canvas.height));

}

function drawConnections() {

for (let i = 0; i < nodes.length; i++) {

for (let j = i + 1; j < nodes.length; j++) {

const dx = nodes[i].x - nodes[j].x;

const dy = nodes[i].y - nodes[j].y;

const distance = Math.sqrt(dx * dx + dy * dy);

if (distance < maxDistance) {

ctx.beginPath();

ctx.moveTo(nodes[i].x, nodes[i].y);

ctx.lineTo(nodes[j].x, nodes[j].y);

ctx.strokeStyle = `rgba(${lineColorBase}, ${1 - distance / maxDistance})`;

ctx.stroke();

}

function animate() {

ctx.clearRect(0, 0, canvas.width, canvas.height);

for (const node of nodes) {

node.update();

node.draw();

}

drawConnections();

requestAnimationFrame(animate);

}

animate();

window.addEventListener('resize', () => {