Mathematische Formeln in html schreiben

  • Welche allgemeinen Aufrufe muss ich in meiner Datei setzen, damit ich mathematische Formeln aus wiki einsetzen kann?


    Beispiel:

    Ich möchte das erste Skalarprodukt

    ( x . y ) unter der Überschrift Reelle Definition

    aus

    https://de.wikipedia.org/wiki/Minkowski-Raum


    auf meiner Seite genauso darstellen, wie es unter wiki steht.

    Man kann sich ja relativ leicht den Quelltext der Datei

    https://de.wikipedia.org/wiki/Minkowski-Raum

    im Browser anzeigen lassen. Für mich ist es allerdings schwer, die notwendigen Ausdrücke zu finden.

  • In Wikipedia sind die Formeln als Bild eingefügt.


    Das liegt wohl auch daran, das laut Wikipedia


    Zitat

    Unter Mathematikern und anderen interessierten Benutzern gilt MathML für die manuelle Editierung als unhandlich, sodass nur Programme zur Generierung zum Einsatz kommen. Durch die Syntax lässt es sich nur schwer bzw. gar nicht durch CSS formatieren.

    Für Webseiten ist MathML damit eher nicht geeignet.


    Falls du dich damit beschäftigen willst findest du zum Einstieg ein paar Beispiele unter


    http://elsenaju.info/mathml/MathML-Beispiele.htm


    Mit der Browserunterstützung sieht es ganz mies aus:


    https://www.caniuse.com/?search=mathml


    MathML wird offensichtlich nur vom Firefox und vom Safari unterstützt. Von daher kann ich MathML nicht empfehlen.

    Dieser Beitrag wurde bereits 3 Mal editiert, zuletzt von MrMurphy ()

  • Danke für die hilfreichen Antworten.

    Ich kann die Bilder bei mir einbinden.

    Ein kleiner Schönheitsfehler ist, dass die Formeln ein klein wenig höher stehen als der übrige Text in der Zeile.


    So binde ich die Formeln ein:

    Code
    1. ...
    2. übriger text <img src="https://wikimedia.org/api/rest_v1/media/math/render/svg/a0559104f847e15673c659accc403a96673bf437"> übriger text ...

    Das Bild der Formel ist innerhalb der Zeile etwas zu hoch.

  • Ich hatte so etwas im Hinterkopf, dass es ein mathml.js gibt aber da täusche ich mich anscheinend. Wahrscheinlich war es statt dessen dieses:

    https://www.mathjax.org

    Zitat

    A JavaScript display engine for mathematics that works in all browsers.

    Zitat

    Das Bild der Formel ist innerhalb der Zeile etwas zu hoch.

    Bei mir ist es subjektiv eher zu tief, aber das täuscht wahrscheinlich, da die Formel tiefgestellte Zeichen enthält:

    mathjax.png


    Edit: Das lag daran, dass ich das in einer globalen Testdatei hatte, wo dieses CSS auf img lag:

    Code
    1. img {
    2. vertical-align: middle;
    3. border-style: none;
    4. }

    Deaktiviere ich das, ist die Grafik zu hoch, wie von dir beobachtet. Default für vertical-align ist ja baseline und bei einem Bild ist baseline die Unterkante :-)

    Dieser Beitrag wurde bereits 3 Mal editiert, zuletzt von Sempervivum ()

  • Sempervivum danke für die schnelle Hilfe.


    Ich habe "align" in den img Aufruf gesetzt, es funktioniert gut.


    Beispiel:

    <img src="https://wikimedia.org/api/rest_v1/media/math/render/svg/fc09a8bf2430e8e6ec7dbf63b64515398805db91" align="top">


    So habe ich in einem Satz drei Bilder im Text in der Höhe ausgerichtet.

  • Hallo an alle,


    es wurde bereits erwähnt aber mir ist eben auch der Begriff MathML bekannt (= Mathematical Markup Language).

    Hierbei handelt es sich ja um eine Darstellungsform von mathematischen Formeln oder eben komplexen Ausdrücken.

    Das Ganze wurde durch World Wide Web Consortium festgelegt.


    Außerdem besteht es aus zwei Teilsprachen:

    - Content MathML (nur die Struktur)

    - Presentation MathML (grafische Gestaltung)