{"id":17945,"date":"2025-02-11T12:06:27","date_gmt":"2025-02-11T11:06:27","guid":{"rendered":"https:\/\/www.bernd-leitenberger.de\/blog\/?p=17945"},"modified":"2025-02-11T15:00:46","modified_gmt":"2025-02-11T14:00:46","slug":"grafik-und-text-ausgeben-gar-nicht-so-einfach-1","status":"publish","type":"post","link":"https:\/\/www.bernd-leitenberger.de\/blog\/2025\/02\/11\/grafik-und-text-ausgeben-gar-nicht-so-einfach-1\/","title":{"rendered":"Grafik und Text ausgeben \u2013 gar nicht so einfach (1)"},"content":{"rendered":"
<\/div>\n

<\/path><\/svg><\/i> \"Loading\"<\/p>\n

<\/div>\n

In meiner lockeren Reihe über Technologien von Computern von \u201efrüher\u201c will ich heute mal die Ausgabe von Grafik und Text in den Achtzigern beleuchten. Heute geht vieles aufgrund dedizierten Grafikkarten mit eigenem Speicher und Monitoren mit einzeln adressierbaren Pixeln anders. Morgen gibt es dann Teil zwei des Artikels.\"\"<\/a><\/p>\n

Das Prinzip<\/h4>\n

Damals schloss man den Rechner entweder an den (Farb)Fernseher oder einen Monitor an. Auch wenn ein Monitor schon damals die bessere Wahl war, weil er eine bessere Bildqualität bot ,funktionierten doch beide nach dem gleich physikalischen und technischen Prinzip. Basis war ein erzeugter, eng fokussierter Elektronenstrahl. Der Elektronenstrahl wurde von einer Ablenkelektronik mithilfe von Magnetfeldern in einer horizontalen Linie bewegt. Ein Signal vom Computer, die horizontale Synchronisation schichtete ihn wieder zum Zeilenanfang, wobei gleichzeitig die Höhe verschoben wurde das er eine neue Zeile begann. Wie hoch diese Differenz war, was die Zeilenzahl eines Bildes festlegte, war programmierbar. Am Ende des Bildes musste der Elektronenstrahl zum Ursprung, also in die linke, obere Ecke zurückgeschickt werden. Auch dafür gab es ein Signal, die vertikale Synchronisation. Bei einem einfachen Grünmonitor oder anderem Monochrommonitor war die Oberfläche der Glasröhre mit einem Material beschichtet, das durch den Elektronenstrahl aufleuchtete, meist auch nachleuchtete, das erlaubte es die Bildwiederholrate kleinzuhalten, ohne das man ein Flimmern aufgrund des Bildwechsels wahrnahm.<\/p>\n

Farbmonitore hatten dagegen eine Maske, beschichtet mit vielen Punkten in den drei Grundfarben rot, grün und blau, die zusammen die Helligkeit eines Bildpunktes ergaben. (additive Farbmischung) Dass man einen einzelnen Punkt wahrnahm und sich nicht die Farbinformation verschiedener Bildpunkte vermischte, gab es zudem eine Lochmaske, welche die Bildpunkte voneinander trennte.<\/p>\n

Was der Rechner nun machen musste, war zum einen die Intensität des Elektronstrahls zu verändern \u2013 für einen hellen Punkt auf voller Intensität, für einen Punkt der dunkel bleiben muss, wird er kurzzeitig abgeschaltet und er muss die beiden Synchronisationssignale für horizontale und vertikale Synchronisation schicken. Wie viele Bildpunkte pro Zeile es sind, legt er durch die Zahl der Helligkeitsanpassungen des Elektronenstrahls Zeile fest. Wer mal einen alten Monitor hat, weiß das man auch das Bild selbst nachjustieren konnte. Man konnte das Bild dehnen oder stauchen oder in der Lage verändern. Ganz ausnutzen tat man die Bildfläche nie. Monitore und Fernseher hatten damals eine Glasröhre, die nur in der Mitte einigermaßen plan war, an den Ecken hin wurde sie immer mehr gewölbter und die Abbildung verzerrt. In der Praxis nutzen Computer nur diesen zentralen Bereich um die Mitte, außen blieb ein Rand, der im Laufe der Zeit durch Steigerung der Auflösung aber immer kleiner wurde. Dieser Rand machte in den Achtziger Jahren bei einem Heimcomputer durchaus ein Drittel bis Hälfte der gesamten Fläche aus. Das ist nicht unwichtig, weil in der Zeit wo der Elektronenstrahl diese Fläche überstreicht, der Computer keine Daten übertragen muss und was anderes tun kann.<\/p>\n

So legen technische Angaben immer die Fähigkeiten eines Monitors fest. In der Spätzeit bevor die heutigen Flachbildschirme auf Basis von LCD\/LED aufkamen, waren Begriffe wie Zeilenfrequenz und Bandbreite wichtig. Die Zeilenfrequenz gab an wie viele Zeilen multipliziert mit der Bildwiederholrate ein Monitor anzeigen konnte. Für VGA waren es zum Beispiel 31,5 kHz. Wollte man mehr Zeilen in einem Bild unterbringen, indem man die Auflösung hochfuhr, musste man die Bildwiederholrate senken. Wie viele Punkte insgesamt pro Sekunde angezeigt wurden, gab die Bandbreite an. In meiner Zeit, den Achziger Jahren waren da 14,5 bis 18,5 MHz üblich. Sprich der Monitor konnte maximal ~ 18,5 Millionen Bildpunkte anzeigen. Teilt man diese 18,5 Millionen Hz durch eine Bildwiederholrate von 60 Hz, so sind das 308.000 Bildpunkte pro Bild \u2013 nicht gerade viel nach heutigen Maßstäben und dabei ist auch der Bereich dabei der nur Rand ist. Der nutzbare Bereich ist also noch kleiner und dürfte bei 150.000 bis 210.000 Bildpunkten liegen.<\/p>\n

Ein Fernseher unterschied sich von einem Monitor durch zusätzliche Komponenten, dem Empfänger und Dekoder für die PAL- oder NTSC-Signale und dem Verstärker. Sie sorgten in der Praxis für mehr Unschärfe, weil zuerst ein direktes Signal in ein TV-Signal umgewandelt werden musste und dann wieder zurückgewandelt wurde. Das erfolgte ja noch komplett analog, sodass es hier immer Verluste gab. So gab es sehr viele Bauanleitungen in Zeitschriften, wie man einen Heimcomputer direkt an einen Fernseher ohne den Umweg über den Modulator anschließen konnte. Farbintensive hatten damals meist je einen Eingang pro Farbkomponente, also Rot, Grün und Blau. Aus der Mischung dieser drei Grundfarben erhielt man insgesamt acht Farbtöne \u2013 schwarz (kein Signal auf allen drei Farben), weiß (volles Signal auf allen drei Farben), Rot, Grün und Blau sowie Türkis (grün+blau), Violett (rot+blau) und Gelb (rot+grün). Geräte mit 16 Farben hatten eine zusätzliche Luminanzleitung, die dafür sorgte das die Sättigung mal halb (0) oder voll (1) war. Es gab dann von jeder Farbe noch eine dunklere Variante sowie ein Hellgrau\/Dunkelgrau.<\/p>\n

Die Anforderung<\/h4>\n

Das alles ist bisher nicht kompliziert. Die Anforderung für den Rechner ergibt sich nun daraus, das das Zeichnen und Aufrechterhalten des Bildes eine Echtzeitanwendung ist. Sprich der Rechner muss in dem Augenblick, in dem der Elektronenstrahl eine Stelle mit einer Spielfigur überstreicht, das Pixelmuster bitweise übertragen, in dessen Pixeln die Figur steckt. Dasselbe gilt aber auch für statischen Text. Ja selbst, wenn sich nichts tut, muss das Bild dauernd neu gezeichnet werden, weil es selbst beim Fernsehen mit der niedrigsten Bildwiederholfrequenz 25-mal pro Sekunde erneuert wird. In der Frühzeit des Einsatzes von Monitoren \u2013 die es auch erst ab Mitte der Sechziger Jahre gab, vorher bestanden Konsolen aus vielen Lämpchen und einem Fernschreiber als Ein-\/Ausgabegerät \u2013 war diese Aufgabe sogar zu komplex. Da lenkte man den Elektronenstrahl nach dem zu zeichnenden Schriftzug, also nicht in einem festen Raster und \u201ezeichnete\u201c so den Text. Das ersparte den Bildschirmspeicher und sein Auslesen, weil das aber relativ lange dauerte, leuchteten diese Monitore oft lange nach.<\/p>\n

Unser Auge ist relativ empfindlich, wenn der Bildschirmneuaufbau mal an einer Stelle ausbleibt und bemerkt dies als Flimmern oder Grießeln je nachdem wie hell der Hintergrund ist und was es für eine Störung gibt. Für eine CPU ist das dauernde Übertragen der Information zum Monitor aber keine leicht Aufgabe. Üblicherweise ist vor dem Ausgang ein Schiebregister geschaltet, das getaktet bei jedem Takt ein Bit an den Monitorausgang schiebt und damit die Helligkeit des Elektronenstrahls steuert. Aber auch ein Schieberegister muss periodisch gefüttert werden. Nehmen wir nur mal eine damals populäre Auflösung von 256 x 192 Pixels für Heimcomputer und 8 Farben gespeichert in drei Byte, also je 8 Pixel pro Byte und je ein Byte für Rot, Grün und Blau. Eine CPU müsste für eine Zeile dann in etwa dieses Codestück abarbeiten:<\/p>\n

Zeilenbeginn: <\/b><\/p>\n

lade register1 mit der Startadresse<\/p>\n

lade register3 mit derAnzahl der Bildpunkte pro Zeile<\/p>\n

Punktausgabe:<\/b><\/p>\n

Lade den Wert aus der Adresse in Register1 in das Register2<\/p>\n

Gebe Register2 an das Rot-Schiebregister aus<\/p>\n

Erhöhe Adresse in Register1 um 1<\/p>\n

Lade den Wert aus der Adresse in Register1 in das Register2<\/p>\n

Gebe Register2 an das Grün-Schiebregister aus<\/p>\n

Erhöhe die Adresse in Register1 um 1<\/p>\n

Lade den Wert aus der Adresse in Register1 in das Register2<\/p>\n

Gebe das Register2 an das Blau-Schiebregister aus<\/p>\n

Erhöhe die Adresse in Register1 um 1<\/p>\n

Erniedrige Register3 um 1<\/p>\n

Prüfe ob Register3=0<\/p>\n

Wenn Nein, dann springe zu \u201ePunktausgabe\u201c<\/p>\n

Wir haben für die Ausgabe von 8 Bildpunkten hier acht Anweisungen, die bei einem 8080 Prozessors<\/a> 73 Takte brauchen, beim Zilog Z80<\/a> mit Blockbefehlen für die Ausgabe sind es immerhin noch 63 Takte. Multipliziert man diese 73 Takte für acht Bildpunkte pro Byte nun mit 256 x 192 Bildpunkte so kommt man auf 448.512 Takte pro Bild und selbst bei Fernsehanschluss mit nur 25 Bildern pro Sekunde auf 11,2 MHz. Diese Taktfrequenz erreichte damals kein Mikroprozessor. Der 8080 hatte eine Taktfrequenz bei 2 bis 3 MHz, der Z80 bei 2,5 bis 4 MHz in bezahlbaren Geräten (es gab Ende der Achtziger auch schnellere Versionen, die aber selten eingesetzt wurden).<\/p>\n

Ich kenne nur wenige Beispiele, wo ein Mikroprozessor die Ausgabe übernahm, eines ist der Sinclair ZX80\/ZX81<\/a> wo man sogar unter BASIC umstellen musste, wenn man den Prozessor mit voller Geschwindigkeit arbeiten lassen wollte, dafür das Bild aber nicht erneuert wird. Der ZX81 hatte denn auch nur 49.152 Bildpunkte in Schwarz-Weiß, also ein Drittel der Datenmenge oben. Mit voller Geschwindigkeit das Programm abarbeiten kann der Rechner bei diesem Prinzip eigentlich nur, wenn der Elektronenstrahl die Ränder abtastet, also den Bereich, in dem man keine aktive Ausgabe hat.<\/p>\n

Schon die erste \u201eGrafikkarte\u201c Dazzler für den Altair 8800<\/a> ging daher eine andere Lösung. Im Ptrinzip baute man mit TTL-Bausteinen diese Logik nach. Ein Mastertakt sorgte dafür das automatisch aus dem Speicher je ein Byte gelesen und an ein Schieberegister übertragen wurde. Andere Bausteine generierten aus dem Mastertakt dann die zusätzlich benötigten Signale für die horizontale und vertikale Synchronisation.<\/p>\n

Später wurde es üblich das man diese Funktion in einen anwendungsspezifischen Baustein, ein Gate Array oder ULA integrierte. Die CPU hatte also mit dem Bildaufbau nichts zu tun und mit komplexeren Bausteinen waren dann auch mehrere Grafikmodi möglich.<\/p>\n

Videocontroller und Videoprozessoren<\/h4>\n

Wie immer, wenn viele Rechner so eine spezialisierte Funktion brauchen gab es bald von der Industrie standardisierte Bausteine, diesmal sogar zwei Arten, den Videocontroller und den Videoprozessor. Der Videocontroller überträgt keine Daten zum Monitor. Seine Aufgabe ist die Signal- und die Adresserzeugung. Die Logik für das Übertragen der Daten wird so vereinfacht. Der Videocontroller überträgt selbst die Signale für die Synchronisation, er legt an die Logik jeweils die Adresse an, von der sie lesen muss, er erhöht diese je nach gewähltem Videomodus und berechnet auch die Adressen wo man das Bitmuster bei der Textdarstellung im ROM findet. Andere Komfortfunktionen sind das er signalisiert wenn man an der Position angekommen ist, wo der Cursor blinkend davorstellt werden muss und manche können, auch wenn man sie mit einem Lightpen verbindet dessen Position auf dem Monitor feststellen. Der bekannteste Videokontroller ist der 6845 von Motorola der im BBC-Mikro, den Amstrad CPC<\/a> aber auch den IBM Grafikkarten MDA und CGA <\/a>steckte.<\/p>\n

Weiter geht ein Videoprozessor. Er kontrolliert einen eigenen Speicherbereich, den Grafikspeicher, selbstständig und unabhängig vom Hauptspeicher. Er überträgt die Daten an den Monitor und verfügt meist über weitere Funktionen wie Sprites. Das sind Spielfiguren deren Muster und Bewegung der Anwender definiert und die der Videoprozessor selbst bewegt, ohne das die CPU etwas tun musste. Oft informierte er die CPU auch über eine Kollision von Sprites, die man in Spielen wie Pacman nutzen konnte. Das macht das Programmieren natürlich einfacher. Commodore baute den VC-20, weil sie einen Videoprozessor VIC entwickelt hatten aber keinen Kunden für das Bauteil fanden. Der TMS 9918\/9919 steckte im Ti 99\/4a und den MSX-Geräten<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"

<\/div>\n

<\/path><\/svg><\/i> \"Loading\"<\/p>\n

<\/div>\n

In meiner lockeren Reihe über Technologien von Computern von \u201efrüher\u201c will ich heute mal die Ausgabe von Grafik und Text in den Achtzigern beleuchten. Heute geht vieles aufgrund dedizierten Grafikkarten mit eigenem Speicher und Monitoren mit einzeln adressierbaren Pixeln anders. Morgen gibt es dann Teil zwei des Artikels.<\/p>\n","protected":false},"author":169,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[4],"tags":[5270,4442,2442,5271,5272],"class_list":["post-17945","post","type-post","status-publish","format-standard","hentry","category-computer","tag-bildschirm","tag-grafik","tag-monitor","tag-videocontroller","tag-videoprozessor","entry"],"a3_pvc":{"activated":true,"total_views":194,"today_views":0},"jetpack_featured_media_url":"","jetpack-related-posts":[{"id":18380,"url":"https:\/\/www.bernd-leitenberger.de\/blog\/2025\/09\/03\/die-glorreichen-10-das-war-mal-weg-pc-hardware\/","url_meta":{"origin":17945,"position":0},"title":"Die glorreichen 10 – Das war mal weg: PC Hardware","author":"Bernd Leitenberger","date":"3. September 2025","format":false,"excerpt":"Ich will heute mal zwei ZDF Info \/ Neo Sendungen verbinden. Die glorreichen 10, die bei mir als Vorlage f\u00fcr einige Blogs dienten und die von mir noch mehr gesch\u00e4tzte Sendung \"Das war mal weg\", wo es um Dinge geht, die fr\u00fcher fast jeder hatte und die heute aus unserem\u2026","rel":"","context":"In "Die Glorreichen 10"","block_context":{"text":"Die Glorreichen 10","link":"https:\/\/www.bernd-leitenberger.de\/blog\/category\/allgemein\/die-glorreichen-10\/"},"img":{"alt_text":"","src":"https:\/\/vg02.met.vgwort.de\/na\/876c61d389304d98aa0332fadd769381","width":350,"height":200},"classes":[]},{"id":18683,"url":"https:\/\/www.bernd-leitenberger.de\/blog\/2026\/06\/01\/die-glorreichen-10-programmiersprachen-2\/","url_meta":{"origin":17945,"position":1},"title":"Die glorreichen 10 \u2013 Programmiersprachen (2)","author":"Bernd Leitenberger","date":"1. Juni 2026","format":false,"excerpt":"Der heutige Teil schlie\u00dft nahtlos an den ersten Teil an, der gestern erschien. Es geht um 10 Kriterien anhand derer man Programmiersprachen kategorisieren kann. Maschinennah oder universell, aber komplex Als eine maschinennahe Sprache bezeichnet man eine Sprache, die nahe den M\u00f6glichkeiten von Prozessoren ist. Das Paradebeispiel ist C. Alle Prozessoren\u2026","rel":"","context":"In "Die Glorreichen 10"","block_context":{"text":"Die Glorreichen 10","link":"https:\/\/www.bernd-leitenberger.de\/blog\/category\/allgemein\/die-glorreichen-10\/"},"img":{"alt_text":"","src":"https:\/\/vg09.met.vgwort.de\/na\/7f5d9cf5265047179df05b778bf455b5","width":350,"height":200},"classes":[]},{"id":18469,"url":"https:\/\/www.bernd-leitenberger.de\/blog\/2025\/11\/13\/operation-fishbowl\/","url_meta":{"origin":17945,"position":2},"title":"Operation Fishbowl","author":"Bernd Leitenberger","date":"13. November 2025","format":false,"excerpt":"Hallo, ich schreibe weiter an meinem Buch, die Auskopplung der Thor und Delta aus dem Buch \u00fcber die US-Tr\u00e4gerraketen. Und wie immer nutze ich die Zeit noch was zu erg\u00e4nzen. Seitens des Einsatzes der Thor bzw. Delta als Satellitentr\u00e4ger gibt es wenig Neues zu schreiben da habe ich schon beim\u2026","rel":"","context":"In "Raumfahrt"","block_context":{"text":"Raumfahrt","link":"https:\/\/www.bernd-leitenberger.de\/blog\/category\/raumfahrt\/"},"img":{"alt_text":"","src":"https:\/\/upload.wikimedia.org\/wikipedia\/commons\/e\/e2\/Radiocarbon_bomb_spike.svg","width":350,"height":200,"srcset":"https:\/\/upload.wikimedia.org\/wikipedia\/commons\/e\/e2\/Radiocarbon_bomb_spike.svg 1x, https:\/\/upload.wikimedia.org\/wikipedia\/commons\/e\/e2\/Radiocarbon_bomb_spike.svg 1.5x"},"classes":[]},{"id":18612,"url":"https:\/\/www.bernd-leitenberger.de\/blog\/2026\/03\/28\/galileos-cds-teil-2\/","url_meta":{"origin":17945,"position":3},"title":"Galileos CDS \u2013 Teil 2","author":"Bernd Leitenberger","date":"28. M\u00e4rz 2026","format":false,"excerpt":"So, heute geht es weiter mit Teil 2 \u00fcber Galileos CDS, dieser Beitrag schlie\u00dft nahtlos an den ersten Beitrag von gestern an, wie man schon an der ersten Textzeile sieht. Nach der Einleitung im ersten Teil geht es heute weiter damit warum der RCA 1802 genutzt wurde und was seine\u2026","rel":"","context":"In "Raumfahrt"","block_context":{"text":"Raumfahrt","link":"https:\/\/www.bernd-leitenberger.de\/blog\/category\/raumfahrt\/"},"img":{"alt_text":"","src":"https:\/\/vg07.met.vgwort.de\/na\/191e4b0728de42829cf656027b84dc82","width":350,"height":200},"classes":[]},{"id":18610,"url":"https:\/\/www.bernd-leitenberger.de\/blog\/2026\/03\/27\/galileos-cds-teil-1\/","url_meta":{"origin":17945,"position":4},"title":"Galileos CDS – Teil 1","author":"Bernd Leitenberger","date":"27. M\u00e4rz 2026","format":false,"excerpt":"Hall\u00f6chen, es wird Zeit das ich mich mal wieder melde. Es gab zwei Gr\u00fcnde, warum ich mich so rar gemacht habe. Das eine ist das es gerade nicht so viel aktuelles gibt, au\u00dfer einem Update zu Artemis, zu dem ich vielleicht noch etwas schreibe. W\u00e4hrend Trump das ganze Programm nach\u2026","rel":"","context":"In "Raumfahrt"","block_context":{"text":"Raumfahrt","link":"https:\/\/www.bernd-leitenberger.de\/blog\/category\/raumfahrt\/"},"img":{"alt_text":"","src":"https:\/\/vg07.met.vgwort.de\/na\/4fb81c7bafbd4d9d88b5695abdb33d29","width":350,"height":200},"classes":[]},{"id":18709,"url":"https:\/\/www.bernd-leitenberger.de\/blog\/2026\/06\/14\/der-blog-wird-20\/","url_meta":{"origin":17945,"position":5},"title":"Der Blog wird 20","author":"Bernd Leitenberger","date":"14. Juni 2026","format":false,"excerpt":"Vor genau 20 Jahren erschien der erste Blog, damals noch unter der Bezeichnung \u201eWeb-Log\u201c. Ich habe gerade einen Artikel gelesen \u00fcber das Zustandekommen des Worts \u201eBlog\u201c. Interessanterweise war es genauso wie bei mir. Obwohl es die Bezeichnung \u201eBlog\u201c damals schon gab, bezeichnete ich meinen Blog lange Zeit als \u201eWeb-Log\u201c, also\u2026","rel":"","context":"In "Allgemein"","block_context":{"text":"Allgemein","link":"https:\/\/www.bernd-leitenberger.de\/blog\/category\/allgemein\/"},"img":{"alt_text":"","src":"https:\/\/vg09.met.vgwort.de\/na\/635ab0c6229b4d6898fff3de77fa418a","width":350,"height":200},"classes":[]}],"jetpack_sharing_enabled":true,"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.bernd-leitenberger.de\/blog\/wp-json\/wp\/v2\/posts\/17945","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.bernd-leitenberger.de\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.bernd-leitenberger.de\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.bernd-leitenberger.de\/blog\/wp-json\/wp\/v2\/users\/169"}],"replies":[{"embeddable":true,"href":"https:\/\/www.bernd-leitenberger.de\/blog\/wp-json\/wp\/v2\/comments?post=17945"}],"version-history":[{"count":0,"href":"https:\/\/www.bernd-leitenberger.de\/blog\/wp-json\/wp\/v2\/posts\/17945\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.bernd-leitenberger.de\/blog\/wp-json\/wp\/v2\/media?parent=17945"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.bernd-leitenberger.de\/blog\/wp-json\/wp\/v2\/categories?post=17945"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.bernd-leitenberger.de\/blog\/wp-json\/wp\/v2\/tags?post=17945"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}