کار با canvas در html 5

[manit44]

سلام بر دوستان

من یه طرحی هست که میخوام با canvas پیاده سازی کنم و میخوام که خطوط دورانی رو به صورت لایه لایه طراحی کنم که نیاز به کمک دوستان دارم و میخوام دقیقا مثل عکس زیر بشه. در ضمن ارتفاع کار هم 590 پیکسل هست.

این هم عکس طرح من:

124618
ممنون میشم از دوستان کمکم کنند.

[پیام حیاتی]

سلام
شما شروع کن به مشکل برخوردی مطرح کن ، الآن میخوای ما چه کار کنیم کد بدیم!

[manit44]

ببینید من یه کدی نوشتم ولی با هر رفرش شدن صفحه به صورت رندم شکل خطوط دورانی عوض میشه نمیخوام این اتفاق بیفته و میخوام که برای هر لایه یک canvas بنویسم و به شکل عکسی که گذاشتم در بیاد و تغییر نکنه.

اینم کدمه:

$(document).ready(function () {
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');

canvas.width = window.innerWidth ;
canvas.height = window.innerHeight - 200;
var centerX = canvas.width / 2;
var centerY = canvas.height / 2;

canvas.style.marginTop = canvas.height / 10.2 + 'px';

var vertical = document.getElementById('vertical');
vertical.style.height = canvas.height + 'px';
vertical.style.marginTop = canvas.height / 10.2 + 'px';
vertical.style.left = centerX + 150 + 'px';

var img = document.getElementById('img');
img.style.marginTop = canvas.height / 8.2 + 'px';
img.style.left = centerX + 170 + 'px';

var menu = document.getElementById('menu');
menu.style.marginTop = canvas.height / 2.4 + 'px';
menu.style.left = centerX + 190 + 'px';


for (var i = 1; i <= 30; i++) {
draw();
}

function draw() {
var line_width = [20, 10, 10, 2, 5, 5, 10, 10, 20, 5, 2, 10, 10, 2, 5, 5, 5, 2, 10, 10, 2, 2, 5, 10, 10, 20, 20, 20, 20];
var lw = Math.floor(Math.random() * 40);
var lwidth = line_width[lw];
var sAngle = Math.floor(Math.random() * 180) * Math.PI / 180;
var eAngle = Math.floor(Math.random() * 180) * Math.PI / 180;
var radius = Math.floor(Math.random() * (canvas.width / 2.9)) + (canvas.width / 4);


context.beginPath();
context.arc(centerX + 200, centerY, radius,sAngle, eAngle, false);
context.lineWidth = lwidth;
context.strokeStyle = 'maroon';
context.stroke();
}
});

[manit44]

کسی کمک نمیکنه؟

[manit44]

لطفا دوستان کم لطفی نکنند.

[manit44]

دوستان واقعا اگه کمکی از دستشون بر نمیاد لطفا پست بدین تا یه فکر دیگه ای بکنم.

[manit44]

دوستان خیلی ممنون از اینکه کمکی نمی کنید.

[پیام حیاتی]

سلام
خوب شاید کسی بلد نیست عزیز دل.
یا بلدن و نمیخوان فوت کوزه گریشونو بگن.:کف: