taramath: Bildkompression

Beschreibung

Die zweidimensionale diskrete Kosinustransformation findet Anwendung in der Speicherung von Bildern im JPG-Format. Das Originalbild wird dabei in -Blöcke unterteilt, welche jeweils einer zweidimensionalen diskreten Kosinustransformation unterzogen werden. Alle Koeffizienten mit einen betragsmäßig vergleichsweise kleinen Wert werden auf Null gesetzt, sodass diese Werte nicht gespeichert werden müssen. Um aus den gespeicherten Koeffizienten wieder ein Bild zu erstellen, wird zu allen -Blöcken eine inverse zweidimensionale diskrete Kosinustransformation durchgeführt. Anschließend werden die einzelnen Blöcke wieder zum Gesamtbild zusammengesetzt.

Beispiel

Durch den Aufruf ExampleData.image wird ein (schwarz-weiß) Bild als Matrix (zweidimensionales Array) eingelesen.

Anschließend wird das zuvor beschriebene Verfahren zur Demonstration der JPG-Komprimierung durchgeführt. Als Ergebnis wird das Originalbild sowie das komprimierte Bild dargestellt.

Tipp: Verändere die Variable k im Quellcode und aktualisiere die Vorschau, um die Kompressionsrate anzupassen. Verwende dazu Werte zwischen 0 und 50.

<!DOCTYPE HTML>
<html>

<head>
  <script src="taramath.js"></script>
</head>

<body>

<div id="original" style="display:inline-block;"></div>
<div id="compressed" style="display:inline-block;"></div>

<script>

  var k = 6; // Kompressionsrate

  var A = ExampleData.image("peppers");
  var m = A.length;
  var n = A[0].length;

  Plot.init("original");
  Plot.image(A, 2);

  var B = LinearAlgebra.zero_matrix(m, n);

  for (var r = 0; r < m-7; r = r+8) for (var s = 0; s < n-7; s = s+8) {
    var H =  LinearAlgebra.zero_matrix(8, 8);
    for (var i = 0; i < 8; i++) for (var j = 0; j < 8; j++) H[i][j] = A[r+i][s+j];

    var C = Fourier.cosine_transform_2d(H);
    for (var i = 0; i < 8; i++) for (var j = 0; j < 8; j++) if (Math.abs(C[i][j]) < k) C[i][j] = 0;

    var D = Fourier.inverse_cosine_transform_2d(C);
    for (var i = 0; i < 8; i++) for (var j = 0; j < 8; j++) B[r+i][s+j] = D[i][j];
  };

  Plot.init("compressed");
  Plot.image(B, 2);

</script>

</body>
</html>

Vorschau aktualisieren

Beispiel

Während die zweidimensionale diskrete Kosinustransformation sehr gut zur Kompression von Fotos geeignet ist, lässt sich das Verfahren weniger gut zu Kompression von Zeichnungen einsetzen.

Als Beispiel dazu wird ein Bild erzeugt, dessen Pixel zufällig entweder grau oder schwarz sind. Anschließend wird das Verfahren wie zuvor durchgeführt. Das Ergebnis zeigt, dass das komprimierte Bild nicht mehr nur aus zwei sondern aus diversen Grautönen besteht.

<!DOCTYPE HTML>
<html>

<head>
  <script src="taramath.js"></script>
</head>

<body>

<div id="original" style="display:inline-block;"></div>
<div id="compressed" style="display:inline-block;"></div>

<script>

  var k = 6; // Kompressionsrate

  var n = 24;
  var m = 24;
  var A = LinearAlgebra.zero_matrix(m, n);
  for (var i = 0; i < m; i++) for (var j = 0; j < n; j++) {
    A[i][j] = (Math.random() < 0.5 ? 0 : 60);
  };

  Plot.init("original");
  Plot.image(A, 8);

  var B = LinearAlgebra.zero_matrix(m, n);

  for (var r = 0; r < m-7; r = r+8) for (var s = 0; s < n-7; s = s+8) {
    var H =  LinearAlgebra.zero_matrix(8, 8);
    for (var i = 0; i < 8; i++) for (var j = 0; j < 8; j++) H[i][j] = A[r+i][s+j];

    var C = Fourier.cosine_transform_2d(H);
    for (var i = 0; i < 8; i++) for (var j = 0; j < 8; j++) if (Math.abs(C[i][j]) < k) C[i][j] = 0;

    var D = Fourier.inverse_cosine_transform_2d(C);
    for (var i = 0; i < 8; i++) for (var j = 0; j < 8; j++) B[r+i][s+j] = D[i][j];
  };

  Plot.init("compressed");
  Plot.image(B, 8);

</script>

</body>
</html>

Vorschau aktualisieren

Bildkompression

unter Verwendung der Kosinustransformation