5 poin oleh GN⁺ 2024-11-19 | 1 komentar | Bagikan ke WhatsApp

Proses pembuatan kode QR langkah demi langkah

Aplikasi demo JavaScript ini memvisualisasikan secara rinci proses bagaimana string teks dikodekan menjadi simbol barcode kode QR. Isi halaman ini menjelaskan dan membenarkan cara kerja internal pustaka pembuat kode QR.

Input pengguna

  • String teks: "Hello world"
  • Tingkat koreksi kesalahan: rendah, sedang, kuartil, tinggi
  • Paksa versi minimum: antara 1 hingga 40
  • Paksa pola mask: otomatis(-1) atau manual(0 hingga 7)

Output kode QR

Proses langkah demi langkah

0. Analisis karakter Unicode

  • Jumlah code point pada string teks input: 17
  • Rincian setiap karakter:
    • Indeks, karakter, code point Unicode, apakah dapat dikodekan dalam mode numerik, mode alfanumerik, mode byte, mode kanji

1. Membuat segmen data

  • Mengubah setiap karakter menjadi bit
  • Dalam mode byte, karakter menghasilkan 8, 16, 24, 32 bit
  • Segmen tunggal yang dihasilkan:
    • Mode: byte
    • Jumlah: 17 byte
    • Data: panjang 136 bit

2. Menyesuaikan dengan nomor versi

  • Total panjang bit yang diperlukan untuk merepresentasikan daftar segmen
  • Kapasitas codeword data kode QR menurut versi dan tingkat koreksi kesalahan

3. Menggabungkan segmen, menambahkan padding, membuat codeword

  • Menggabungkan berbagai string bit
  • Mode segmen, jumlah karakter, data, terminator, padding bit, padding byte

4. Membagi blok, menambahkan ECC, dan interleave

  • Statistik untuk semua blok
  • Membagi codeword data menjadi blok pendek dan blok panjang, lalu menghitung dan menambahkan codeword ECC

5. Menggambar pola tetap

  • Menggambar pola timing horizontal dan vertikal
  • Menggambar pola finder di tiga sudut
  • Menggambar grid pola alignment
  • Menggambar bit format sementara
  • Menggambar blok informasi versi

6. Menggambar codeword dan sisa

  • Menghitung pemindaian zigzag untuk mengunjungi semua modul yang belum terisi
  • Menggambar modul data/ECC sesuai urutan pemindaian zigzag dan nilai bit dari codeword

7. Mencoba menerapkan setiap mask

  • Menerapkan pola mask
  • Menerapkan mask XOR pada modul data, ECC, dan sisa
  • Menggambar bit format yang sebenarnya

8. Mencari pola penalti

  • Rangkaian modul horizontal dan vertikal dengan warna yang sama
  • Kotak modul 2×2 dengan warna yang sama
  • Pola finder horizontal dan vertikal
  • Keseimbangan modul gelap/terang

9. Menghitung poin penalti, memilih mask terbaik

  • Cara menghitung poin penalti
  • Total poin penalti terendah: pola mask 3

Informasi tambahan

  • Menyediakan tautan ke Wikipedia dan materi lain tentang desain kode QR

Kode sumber TypeScript aplikasi web ini dan kode JavaScript hasil kompilasinya dapat dilihat.

1 komentar

 
GN⁺ 2024-11-19
Komentar Hacker News
  • Sangat disayangkan bahwa penjelasan online tentang kode QR sering melewatkan perhitungan kode koreksi kesalahan Reed-Solomon

    • Penulis menjelaskannya sebagai "panjang, membosankan, dan tidak menarik"
    • Akibatnya, informasi terkait menjadi sulit ditemukan
  • Ada video Veritasium tentang kode QR berjudul "I used to hate QR codes. But they're actually genius"

  • Umpan balik yang diterima penulis cukup menarik

  • Saya juga ingin melihat penjelasan serupa tentang decoder kode QR

  • Saya pernah mengimplementasikan kode QR dengan Rust

  • Menambahkan tahun pada judul artikel adalah praktik yang baik (dalam kasus ini, 2018)

  • Mempelajari cara kerja kode QR sudah lama ada dalam daftar hal yang ingin saya lakukan, dan ini adalah pengantar yang bagus

  • Saya ingin membuat kode QR dengan cepat, tetapi mengalami kesulitan karena situs yang penuh iklan dan situs yang mengharuskan "mendaftar untuk menggunakannya"

    • Saya menemukan beberapa di GitHub, tetapi ada masalah lain, jadi saya mengimplementasikannya sendiri menggunakan library yang dirancang dengan baik yang pernah saya pakai sebelumnya
    • Menghabiskan waktu sekitar 15 menit
    • Tautan generator kode QR
  • Saya bisa menambahkan lebih banyak opsi, tetapi saya rasa sebagian besar pengguna tidak akan membutuhkannya

  • Setelah mengetahui cara kerja kode QR, sekarang ini juga bisa digunakan dalam kueri SQL