یک تصویر را انتخاب می‌کنی، چند ثانیه صبر می‌کنی، و بعد همان تصویر با دو زنجیره از دایره‌های چرخان دوباره کشیده می‌شود. این ایدهٔ دموی «اپی‌سیکل‌های فوریه» است: مرز تصویر در مرورگر استخراج می‌شود، دو سری فوریهٔ مستقل برای مختصات X و Y محاسبه می‌شوند، و یک قلم روی بوم حرکت می‌کند تا شکل اولیه بازسازی شود.
دموی زنده را می‌توانی همین حالا امتحان کنی: دموی اپی‌سیکل‌های فوریه. هیچ تصویری به سرور ارسال نمی‌شود و همهٔ پردازش‌ها در مرورگر خودت انجام می‌شوند.
در یک نگاه
- آپلود تصویر و استخراج خودکار کانتور
- محاسبهٔ ضرایب فوریه برای X و Y به‌صورت جداگانه
- نمایش دو زنجیره، خطوط راهنما و قلم در حال رسم
- کنترل زندهٔ تعداد هارمونیک‌ها، سرعت و خطای RMS
1. اپی‌سیکل چیست و چرا فوریه؟
هر حرکت دوره‌ای را می‌توان به مجموع مجموعه‌ای از حرکت‌های ساده‌تر شکست. در سری فوریه، هر جمله یک بردار چرخان است: یک دایره با شعاع مشخص که با سرعت زاویه‌ای ثابت می‌چرخد. اگر چند بردار چرخان را پشت سر هم قرار دهی، نقطهٔ انتهای زنجیره مسیر پیچیده‌ای را طی می‌کند. به این دایره‌های تودرتو «اپی‌سیکل» می‌گویند؛ همان ایده‌ای که اخترشناسان قدیم برای توضیح حرکت سیارات به کار می‌بردند.
تفاوت این دمو با نمایش‌های کلاسیک در این است که اینجا دو سری مستقل داریم:
x(t) = a0 + Σ [ak cos(kt) + bk sin(kt)] y(t) = c0 + Σ [ck cos(kt) + dk sin(kt)]
برای هر محور، دامنه و فاز هر هارمونیک جداگانه محاسبه می‌شود. بعد از مرتب‌سازی بر اساس دامنه، بزرگ‌ترین دایره‌ها اول رسم می‌شوند و جزئیات کوچک‌تر در ادامه اضافه می‌شوند.
2. از تصویر تا یک مسیر بسته
مرورگر ابتدا تصویر را روی یک بوم مخفی می‌کشد و آن را به حداکثر 300 پیکسل در بعد بزرگ‌تر مقیاس می‌دهد. سپس مسیر پردازش زیر اجرا می‌شود:
- تشخیص کانال آلفا: اگر تصویر شفافیت داشته باشد، همان ماسک شفافیت مبنای کار است.
- در غیر این صورت، تصویر خاکستری می‌شود و آستانهٔ Otsu با بررسی روشنایی حاشیه، جهت پیش‌زمینه را تعیین می‌کند.
- بزرگ‌ترین مؤلفهٔ متصل انتخاب می‌شود تا نویزهای پراکنده حذف شوند.
- مرز بیرونی با الگوریتم Moore ردیابی می‌شود و یک مسیر مرتب به دست می‌آید.
- مسیر کمی هموار و سپس با فاصلهٔ مساوی به 1000 نقطه بازنمونه‌گیری می‌شود.
بهترین نتیجه با PNG شفاف یا سوژهٔ یکدست روی پس‌زمینهٔ ساده به دست می‌آید. عکس‌های شلوغ هم در بسیاری از موارد کار می‌کنند، اما مرز استخراج‌شده ممکن است بخشی از پس‌زمینه را هم شامل شود.
3. چرا دو زنجیره و یک قلم؟
در نمایش تک‌زنجیره‌ای، یک سری فوریهٔ مختلط کل مسیر دو بعدی را می‌سازد. اینجا اما دو سری واقعی و مستقل داریم: یکی برای X و یکی برای Y. زنجیرهٔ افقی بالای بوم مختصات X را تولید می‌کند و زنجیرهٔ عمودی سمت چپ مختصات Y را. از انتهای هر زنجیره یک خط راهنمای نقطه‌چین رسم می‌شود و محل تلاقی آن دو، نقطهٔ قلم است.
این تقسیم‌بندی عمدی است: اگر جای X و Y عوض شود، تقاطع خطوط راهنما به لبهٔ بوم منتقل می‌شود و شکل درست رسم نمی‌شود. با چیدمان فعلی، خط عمودی از زنجیرهٔ بالا و خط افقی از زنجیرهٔ کناری دقیقاً روی نقطهٔ رسم به هم می‌رسند.
4. ضرایب، دامنه و خطای RMS
ضرایب با تبدیل فوریهٔ گسسته روی همان 1000 نقطه محاسبه می‌شوند. برای هر هارمونیک، دامنه و فاز ذخیره می‌شود و هارمونیک‌ها بر اساس دامنه نزولی مرتب می‌شوند. جملهٔ Nyquist که در انتهای طیف قرار دارد، ضریب ویژهٔ خودش را دارد تا بازسازی در N=500 دقیقاً کامل شود.
خطای نمایش‌داده‌شده، RMS مسیر تقریبی نسبت به شعاع RMS مسیر اصلی است. یعنی فقط فاصلهٔ هندسی مهم نیست؛ خطا نسبت به اندازهٔ خود شکل سنجیده می‌شود. برای یک ستارهٔ پنج‌پر، مقادیر اندازه‌گیری‌شده در دمو چنین بودند:
| تعداد هارمونیک | خطای RMS |
|---|---|
| 5 | 1.79% |
| 10 | 0.75% |
| 80 | 0.09% |
| 500 | 0.00% |
این اعداد به شکل ورودی و کیفیت کانتور بستگی دارند، اما روند کلی همیشه یکسان است: با افزایش N، خطا کاهش می‌یابد و مسیر به شکل اصلی نزدیک‌تر می‌شود.
5. کنترل‌ها و تجربهٔ تعاملی
در پنل سمت چپ، اسلایدر هارمونیک از 1 تا 500 کار می‌کند و تغییر آن بلافاصله روی هر دو زنجیره اعمال می‌شود. اسلایدر سرعت، سرعت چرخش را تغییر می‌دهد. دکمهٔ Pause انیمیشن را متوقف می‌کند و Clear trace مسیر رسم‌شده را پاک می‌کند.
- شکل‌های آمادهٔ قلب، ستاره و دایره برای شروع سریع
- نمایش زندهٔ تعداد هارمونیک، تعداد نمونه‌ها و خطای RMS
- پشتیبانی از درگ‌اند‌دراپ و پیست تصویر از کلیپ‌بورد
- میان‌برهای صفحه‌کلید: Space برای پخش و توقف، R برای پاک‌کردن، H برای قلب، S برای ستاره و C برای دایره
6. محدودیت‌ها و نکات عملی
این دمو برای آموزش و آزمایش ساخته شده، نه برای بازسازی دقیق هر عکس. چند نکته را در نظر بگیر:
- مرزهای تیز گوشه‌ها با تعداد هارمونیک کم، نوسان‌های کوچکی نشان می‌دهند. این همان پدیدهٔ گیبس است و با افزایش N کاهش می‌یابد.
- تصویر کاری حداکثر 300 پیکسل است تا پردازش در مرورگر سریع بماند. جزئیات ریزتر از این مقیاس ممکن است از دست بروند.
- آستانه‌گذاری ساده روی عکس‌های شلوغ همیشه به یک سوژهٔ تمیز نمی‌رسد. PNG شفاف بهترین انتخاب است.
- تمام محاسبات سمت کلاینت انجام می‌شود و هیچ تصویری آپلود نمی‌شود.
7. امتحانش کن
یک لوگو، یک قلب، یا یک تصویر شفاف را آپلود کن و اسلایدر N را از 5 تا 200 حرکت بده. تفاوت بین یک بیضی ساده و یک شکل کامل را همان‌جا می‌بینی. اگر نتیجهٔ جالبی گرفتی، در بخش نظرات همین پست لینکش را بگذار.
No Comments have been Posted.