Canvas -

[Matthias Scharwies]

Ich bin ganz neu hier im Forum.

Herzlich willkommen bei SELFHTML!

Um meinen Schülern im Homeschooling bestimmte Inhalte besser zu visualisieren, bin ich für mein Projekt (https://www.kramlade.de/?Pruefe-dich-selbst-und-lerne/Deutsch/Schwierigere-Uebungen/Satzbau/Bestimmungen-3) auf die Möglichkeiten mit <canvas> gestoßen. Soweit sind mir auch die Anpassungen bereits gelungen, dass der verwendete Text gut lesbar und nicht verzerrt dargestellt wird.

in Canvas ist der Text ein Bild. Hast du das in canvas eingegeben und so formatiert?

Soll das ein Quiz werden, das Schüler dann selbst bearbeiten sollen und wo dann die Position des roten/grünen Strichs ausgewertet wird?

Evtl. könntest du das mit HTML oder mit SVG machen. Der normale Text könnte mit der Maus selektiert und über den :selection-Selektor formatiert werden:

::selection {
   background-color: white;
  text-decoration: underline;
  text-decoration-color: red;
}

Leider sind die verwendeten Linien (beim Code von Chtiwi Malek) nicht wie mit dem Lineal gezogen (https://tutor-test.cmsimplexh.de/?Canvas-Test-3); er hat allerdings die Auswahl von unterschiedlicher Strichdicke und eine Auswahl von Farben.

Bei stackoverflow fand ich eine Installation (https://tutor-test.cmsimplexh.de/?Canvas-Test-4-Strecke), die das kann, allerdings nur in rot. Was ich allerdings bisher nicht hinbekommen habe, ist eine Kombination von beiden.

Vom oberen Beispiel das select-Menü mit den Farben ins untere Beispiel übernehmen, so dass die Schüler das auswählen können. Da müssen dann ein paar Variablen angepasst werden.

Kann mir bitte jemand helfen. Ich bin für jeden Vorschlag dankbar!

Beschreibe noch mal genau für was du das suchst: als Präsentation, die die Schüler anschauen sollen oder eben als Selbstlern-Quiz für die Schüler.

Herzliche Grüße

Matthias Scharwies