Tujuan dari tantangan ini adalah untuk menghasilkan animasi sistem rantai drive , yang terdiri dari satu set roda gigi sproket yang dihubungkan bersama oleh rantai .
Persyaratan Umum
Program Anda akan diberi daftar sprocket , ditentukan sebagai (x, y, radius)
kembar tiga. Sistem penggerak rantai yang dihasilkan terdiri dari sprocket ini, dihubungkan bersama oleh rantai tegang tertutup yang melewati masing-masing, secara berurutan . Tujuan Anda adalah untuk menghasilkan animasi looping tanpa batas , yang menunjukkan sistem bergerak. Misalnya diberi input
(0, 0, 16), (100, 0, 16), (100, 100, 12), (50, 50, 24), (0, 100, 12)
, hasilnya akan terlihat seperti
.
Sistem koordinat harus sedemikian rupa sehingga sumbu x mengarah ke kanan, dan sumbu y mengarah ke atas. Anda dapat mengasumsikan bahwa jari-jari bahkan bilangan lebih besar dari atau sama dengan 8 (kita akan melihat mengapa ini penting nanti.) Anda juga dapat berasumsi bahwa setidaknya ada dua sprocket , dan sprocket tidak saling berpotongan . The unitdari input tidak terlalu kritis. Semua contoh dan uji kasus dalam posting ini menggunakan piksel sebagai unit input (jadi, misalnya, jari-jari sproket tengah pada gambar sebelumnya adalah 24 piksel;) cobalah untuk tidak menyimpang terlalu banyak dari unit ini. Di sisa tantangan, kuantitas spasial dipahami diberikan dalam satuan yang sama dengan input — pastikan untuk menjaga proporsinya dengan benar! The dimensi output harus sedikit lebih besar dari kotak berlari dari semua sprockets, cukup besar sehingga seluruh sistem terlihat. Secara khusus, posisi absolut sprocket tidak boleh memengaruhi output; hanya posisi relatif mereka yang seharusnya (jadi, misalnya, jika kita menggeser semua sprocket pada contoh di atas dengan jumlah yang sama, hasilnya akan tetap sama.)
Rantai harus bersinggungan dengan sprocket yang dilewatinya di semua titik kontak, dan lurus ke tempat lain. Rantai harus melewati sprocket sehingga segmen rantai yang berdekatan (yaitu, bagian rantai antara dua sprocket, yang bertemu pada sproket yang sama) tidak saling berpotongan .
.
Misalnya, sementara sistem kiri di atas valid, yang di tengah tidak, karena dua segmen rantai yang berdekatan yang melewati sproket kiri bawah berpotongan. Namun, perhatikan bahwa sistem yang tepat adalah valid, karena dua segmen rantai yang bersilangan tidak berdekatan (sistem ini diproduksi oleh input yang berbeda dari dua lainnya, meskipun.)
Untuk menjaga hal-hal sederhana (r), Anda dapat mengasumsikan bahwa tidak ada sproket memotong lambung cembung dari dua sprocket tetangga, atau lambung cembung dari masing-masing tetangga dan tetangga lainnya. Dengan kata lain, sproket atas pada diagram di bawah ini mungkin tidak berpotongan dengan daerah yang diarsir.
Segmen rantai dapat memotong sprocket selain yang dilewati (seperti pada test case terakhir). Dalam hal ini, rantai harus selalu muncul di depan sprocket.
Persyaratan Visual
Rantai harus terdiri dari serangkaian tautan dengan lebar bergantian. Lebar tautan sempit harus sekitar 2, dan lebar tautan lebar harus sekitar 5. Panjang kedua jenis tautan harus kira-kira sama. The periodedari rantai, yaitu total panjang pasangan lebar / sempit dari tautan, harus merupakan bilangan terdekat dengan 4π yang cocok dengan bilangan bulat bilangan kali dalam panjang rantai. Misalnya, jika panjang rantai adalah 1.000, maka periode harus 12,5, yang merupakan angka terdekat dengan 4π (12.566 ...) yang sesuai dengan jumlah bilangan bulat (80) dalam 1.000. Penting bagi periode untuk memasukkan bilangan bulat berapa kali dalam panjang rantai, sehingga tidak ada artefak pada titik di mana rantai membungkus.
Sproket jari-jari R harus terdiri dari tiga bagian konsentris: poros tengah , yang harus berupa lingkaran jari-jari sekitar 3; tubuh sproket , di sekitar poros, yang seharusnya berupa lingkaran jari-jari sekitar R -4.5; dan pelek sproket , di sekitar tubuh, yang seharusnya menjadi lingkaran jari-jari sekitar
R - 1.5. Pelek juga harus mengandung gigi sproket , yang harus memiliki lebar sekitar 4; ukuran dan jarak gigi harus sesuai dengan ukuran mata rantai, sehingga ikatannya rapi.
Periode gigi sproket, yaitu jarak antara dua gigi berurutan di sepanjang sproket, harus sesuai dengan periode rantai. Karena periode sekitar 4π, dan karena jari-jari sproket dijamin genap, periode tersebut harus sesuai dengan keliling sproket dalam jumlah yang hampir bilangan bulat, sehingga tidak boleh ada artefak yang terlihat pada titik di mana gigi sproket membungkus.
Anda dapat menggunakan kombinasi warna apa saja untuk rantai, bagian sproket yang berbeda, dan latar belakang, selama mereka mudah dibedakan . Latar belakang mungkin transparan. Contoh-contoh dalam posting ini digunakan #202020
untuk rantai, #868481
untuk poros dan pelek #646361
sproket , dan untuk tubuh sproket.
Persyaratan Animasi
The sproket pertama dalam daftar masukan harus memutar searah jarum jam ; sisa sprocket harus berputar sesuai. Rantai harus bergerak dengan kecepatan sekitar 16π (sekitar 50) unit per detik; kecepatan bingkai terserah Anda, tetapi animasi harus terlihat cukup halus.
Animasi harus diulang mulus .
Kesesuaian
Beberapa atribut dan proporsi visual sengaja ditentukan hanya secara kasar — Anda tidak harus mencocokkannya dengan tepat . Output program Anda tidak harus berupa replika pixel-ke-pixel dari contoh-contoh yang diberikan di sini, tetapi harus terlihat serupa. Secara khusus, proporsi yang tepat dari rantai dan sprocket, dan bentuk yang tepat dari rantai dan gigi sproket, fleksibel.
Poin paling penting untuk diikuti adalah:
- Rantai harus melewati sprocket, dalam urutan input, dari arah yang benar.
- Rantai harus bersinggungan dengan sprocket di semua titik kontak.
- Tautan rantai dan gigi sprocket harus terpasang dengan rapi, setidaknya hingga memperbaiki jarak dan fase.
- Jarak antara mata rantai, dan gigi sprocket, harus sedemikian rupa sehingga tidak ada artefak yang terlihat pada titik di mana mereka membungkus.
- Sprocket harus berputar ke arah yang benar.
- Animasi harus diulang mulus.
Sebagai catatan terakhir, sementara, secara teknis, tujuan dari tantangan ini adalah menulis kode terpendek, jika Anda merasa ingin menjadi kreatif dan menghasilkan output yang lebih rumit, tentu saja, lakukanlah!
Tantangan
Tulis program atau fungsi , ambil daftar sprocket, dan buat animasi sistem drive rantai yang sesuai, seperti dijelaskan di atas.
Masukan dan keluaran
Anda dapat mengambil input melalui baris perintah , melalui STDIN , sebagai argumen fungsi , atau menggunakan metode yang setara . Anda dapat menggunakan format yang sesuai untuk input, tetapi pastikan untuk menentukannya di posting Anda.
Sebagai output , Anda dapat menampilkan animasi secara langsung , menghasilkan file animasi (misalnya, GIF animasi), atau menghasilkan urutan file bingkai (namun, ada penalti kecil dalam kasus ini; lihat di bawah.) Jika Anda menggunakan output file, pastikan jumlah frame masuk akal (contoh dalam posting ini menggunakan sangat sedikit frame;) jumlah frame tidak harus minimal, tetapi Anda tidak harus menghasilkan terlalu banyak frame berlebihan. Jika Anda menampilkan urutan bingkai, pastikan untuk menentukan kecepatan bingkai dalam posting Anda.
Skor
Ini adalah kode-golf . The jawaban terpendek , dalam byte, menang.
+ 10% Penalti Jika program Anda menghasilkan urutan frame sebagai output, alih-alih menampilkan animasi secara langsung atau menghasilkan file animasi tunggal, tambahkan 10% ke skor Anda.
Uji Kasus
Tes 1
(0, 0, 26), (120, 0, 26)
Tes 2
(100, 100, 60), (220, 100, 14)
Tes 3
(100, 100, 16), (100, 0, 24), (0, 100, 24), (0, 0, 16)
Tes 4
(0, 0, 60), (44, 140, 16), (-204, 140, 16), (-160, 0, 60), (-112, 188, 12),
(-190, 300, 30), (30, 300, 30), (-48, 188, 12)
Tes 5
(0, 128, 14), (46.17, 63.55, 10), (121.74, 39.55, 14), (74.71, -24.28, 10),
(75.24, -103.55, 14), (0, -78.56, 10), (-75.24, -103.55, 14), (-74.71, -24.28, 10),
(-121.74, 39.55, 14), (-46.17, 63.55, 10)
Tes 6
(367, 151, 12), (210, 75, 36), (57, 286, 38), (14, 181, 32), (91, 124, 18),
(298, 366, 38), (141, 3, 52), (80, 179, 26), (313, 32, 26), (146, 280, 10),
(126, 253, 8), (220, 184, 24), (135, 332, 8), (365, 296, 50), (248, 217, 8),
(218, 392, 30)
Jawaban:
JavaScript (ES6),
2557191518971681 byteIni bukan super-duper golfed benar-benar; itu diperkecil - sebagian dengan tangan - tapi itu tidak istimewa. Tidak diragukan lagi akan lebih pendek jika saya golf lebih banyak sebelum minifying, tapi saya sudah menghabiskan (lebih dari) cukup waktu untuk ini.
Sunting: Oke, jadi saya menghabiskan lebih banyak waktu di sana dan memutarkan kode lebih banyak sebelum minifying (kali ini sangat manual). Kode masih menggunakan pendekatan yang sama dan struktur keseluruhan, tetapi meskipun demikian saya akhirnya menghemat 642 byte. Tidak terlalu buruk, jika saya mengatakannya sendiri. Mungkin melewatkan beberapa peluang penghematan byte, tetapi pada titik ini bahkan saya tidak yakin cara kerjanya lagi. Satu-satunya hal yang berbeda dalam hal output, adalah bahwa sekarang menggunakan warna yang sedikit berbeda yang dapat ditulis lebih singkat.
Sunting 2 (lebih lama): Disimpan 18 byte. Terima kasih kepada ConorO'Brien dalam komentarnya karena menunjukkan dengan sangat jelas bahwa aku benar-benar ketinggalan.
Sunting 3: Jadi, saya pikir saya akan merekayasa ulang kode saya sendiri, karena, terus terang, saya tidak ingat bagaimana saya melakukannya, dan saya kehilangan versi yang tidak dikoleksi. Jadi saya pergi, dan lihatlah ada 316 byte lagi untuk diselamatkan dengan merestrukturisasi dan melakukan beberapa micro-golf.
Fungsi di atas menambahkan elemen SVG (termasuk animasi) ke dokumen. Misalnya untuk menampilkan test case ke-2:
Tampaknya berhasil - setidaknya di sini di Chrome.
Cobalah di snippet di bawah ini (mengklik tombol akan menarik masing-masing kasus uji OP).
Tampilkan cuplikan kode
Kode ini menarik rantai dan gigi gigi sebagai goresan putus-putus. Kemudian menggunakan
animate
elemen untuk menghidupkanstroke-dashoffset
atribut. Elemen SVG yang dihasilkan adalah mandiri; tidak ada animasi berbasis JS atau gaya CSS.Untuk membuat hal-hal berbaris dengan baik, cincin gigi masing-masing gigi sebenarnya digambarkan sebagai jalur yang terdiri dari dua busur, sehingga jalur dapat mulai tepat pada titik singgung di mana rantai menyentuh. Ini membuatnya lebih mudah untuk mengaturnya.
Selain itu, tampaknya ada banyak kesalahan pembulatan saat menggunakan stroke putus-putus SVG. Setidaknya, itulah yang saya lihat; semakin lama rantai, semakin buruk jala dengan setiap gigi berurutan. Jadi untuk meminimalisir masalah, rantai sebenarnya terdiri dari beberapa jalur. Setiap jalur terdiri dari segmen busur di sekitar satu gigi dan garis lurus ke gigi berikutnya. Dash-off mereka dihitung agar sesuai. Namun, bagian "rantai" tipis dari rantai itu hanya jalur pengulangan tunggal, karena tidak dianimasikan.
sumber
R=g=>...
<g>
, tetapi meletakkannya langsung di svg root. Juga menemukan tempat di mana Anda mengubah bendera sapu dan bendera busur besar dari boolean ke menggunakan angka1*x
, tetapi Anda bisa menggunakan+x
C # 3566 byte
Tidak bermain golf sama sekali, tetapibekerja (saya pikir)Tidak disatukan dalam riwayat edit.
Menggunakan Magick.NET untuk merender gif.
Kelas P memiliki fungsi F; Contoh:
sumber
public
pengubah sebelum setiap bidang di kelas Anda?using
klausa yang sesuai harus dimasukkan, atau jenis yang sepenuhnya memenuhi syarat saat digunakan, dan referensi untuk System.Drawing harus diperhatikan dalam jawaban (apakah harus menambah skor saya tidak tahu). Bagaimanapun jawaban yang mengesankan.JavaScript (ES6) 1626 byte
Solusi ini adalah hasil rekayasa balik dari solusi @ Flambino, saya mempostingnya atas kemauannya.
Versi ungolfed:
sumber