Render Text von HTML5 Canvas

Question

Meine Website hat Leinwand, die die Org-Hierarchie zeichnet.

Diese enthalten the name, email, department etc mit Bild der Person. Ich führe einen Automatisierungstest unter Verwendung von Selen durch und möchte sehen, ob ich die Textdaten von der Leinwand erhalten kann.

Gibt es eine Möglichkeit, wie ich diese Daten auf der Leinwand als Text erhalten kann.?

Wenn ich diesen Teil als Bild schneiden, gibt es JS library zur Verfügung, die mir Text von diesem Bild geben kann.

Kann mir jemand zu diesem Thema helfen?
Ihre Hilfe wird sehr geschätzt.
Mit freundlichen Grüßen.

Answer 1

Sobald Elemente auf der Arbeitsfläche gerendert werden, handelt es sich um ein Vektorbild. In den Elementen, die Sie zum Erstellen Ihres Bilds verwendet haben, gibt es keine Objekterkennung. Daher wird der Text, den Sie in das Bild eingefügt haben, nicht gespeichert.

Auf die gleiche Weise, wie Sie Bildpositionen und -eigenschaften mit Programmierobjekten verknüpfen können, können Sie Ihre Textinformationen in einer Datenstruktur speichern, die zur gleichen Zeit aktualisiert wird, wenn sie in das Canvas-Bild eingefügt wird.

Ich meine ... Wenn Sie einige Datenbankinfos verwenden, um Ihre Arbeitsfläche mit Namen, E-Mail- und Abteilungsdaten zu füllen, können Sie diese Informationen in einer Datenstruktur speichern und in das Arbeitsflächenbild zeichnen.

Dann wird nur der Abruf der Werte, die auf diesem Objekt gespeichert sind, der Trick.

Answer 2

Was auf der Leinwand passiert, bleibt auf der Leinwand. Canvas ist eine Bitmap, also wird jeder Text, der gezeichnet wird, gerastert und dann vergessen. Die einzige Möglichkeit, Text nach diesem Punkt zu extrahieren, ist die Verwendung von OCR (und vertraue mir, du wirst mehr Zeit damit verbringen, Korrekturalgorithmen zu schreiben als der eigentliche Code). Aber es gibt ein paar Möglichkeiten, wenn Sie sich masochistisch fühlen: Ocrad, Tesseract.

Allerdings ist meine Empfehlung: Immer zur Quelle gehen! Wenn Sie auf die ursprüngliche Textquelle zugreifen können (die ursprünglich zum Zeichnen auf die Arbeitsfläche verwendet wurde), verwenden Sie diese stattdessen.