LaTeX tester

Odkryj moc LaTeX z moją aplikacją online!

Czy kiedykolwiek marzyłeś o tworzeniu perfekcyjnych dokumentów naukowych, matematycznych czy technicznych? Teraz to prostsze niż kiedykolwiek! Moja aplikacja dostępna bezpośrednio w przeglądarce, oparta na bibliotece latex.js, pozwoli Ci wejść w świat LaTeX bez potrzeby instalowania dodatkowego oprogramowania.

Dlaczego warto zacząć?

Wydajność: Składanie profesjonalnych dokumentów w zaledwie kilka chwil.
Pełne wsparcie dla wzorów matematycznych: Prezentuj skomplikowane równania z nieskazitelną precyzją.
Wygoda w przeglądarce: Działa wszędzie - wystarczy dostęp do internetu.
Nauka przez praktykę: Przyjazny interfejs ułatwia poznawanie składni LaTeX krok po kroku.

Dla kogo jest ta aplikacja?

Studentów piszących prace licencjackie, magisterskie lub doktoraty
Naukowców i wykładowców przygotowujących materiały dydaktyczne
Pasjonatów matematyki, fizyki czy informatyki
Każdego, kto chce tworzyć eleganckie, profesjonalne dokumenty

Przekonaj się, jak łatwe może być tworzenie pięknych dokumentów dzięki LaTeX!

Rozpocznij teraz i zobacz, co możesz osiągnąć!

Przykładowy dokument:

\documentclass{article}

\title{Mój Pierwszy Dokument w LaTeX-u}
\author{Jan Kowalski}
\date{Luty 2025}

\begin{document}

\maketitle

\section{Wprowadzenie}
To jest przykładowy dokument stworzony w LaTeX-u.

\section{Podsumowanie}
LaTeX to narzędzie, które znaczaco ułatwia pracę nad profesjonalnymi dokumentami.

\end{document}

Tekst LaTeX

Pokaż kod tej aplikacji

Kod po stronie przeglądarki

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.7/codemirror.min.css">
<link rel="stylesheet" href="http://www.dariuszrorat.ugu.pl/assets/css/codemirror/theme/light.css">
<link rel="stylesheet" href="http://www.dariuszrorat.ugu.pl/assets/css/codemirror/themes.css">
<link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/npm/latex.js@0.12.4/dist/css/katex.css">
<link type="text/css" rel="stylesheet" href="http://www.dariuszrorat.ugu.pl/assets/css/latex/article.css">
<div id="app">
    <div class="row my-5">
        <div class="col-12">
            <label for="latexInput" class="form-label">Tekst LaTeX</label>
            <textarea type="text" id="latexInput" class="form-control"></textarea>                    
        </div>
    </div>
    <div class="my-5">
        <button class="btn btn-primary" data-bind="click: convert">Konwertuj na HTML</button>
    </div>
    
    <div id="latexOutput" class="latex-container">
    </div>    
    
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.7/codemirror.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.7/mode/xml/xml.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.7/mode/meta.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.7/mode/markdown/markdown.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.7/addon/edit/matchbrackets.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.7/mode/stex/stex.min.js"></script>

<script src="https://cdn.jsdelivr.net/npm/latex.js/dist/latex.js"></script>
<script src="https://cdn.jsdelivr.net/npm/latex.js@0.12.4/dist/js/base.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function() {    
//Knockout.js App ViewModel    
var ViewModel = function()
{
    var self = this;
    self.latex = ko.observable('');

    self.convert = function ()
    {
        var text = self.latex();
        var generator = new latexjs.HtmlGenerator({ hyphenate: false });
        var div = document.getElementById('latexOutput');
        div.innerHTML = '';
        
        generator = latexjs.parse(text, { generator: generator });        
        div.appendChild(generator.domFragment());        
    };
};
var vm = new ViewModel();
ko.applyBindings(vm, document.getElementById('app'));
//CodeMirror for textarea
var myTextarea = document.getElementById('latexInput');  
var editor = CodeMirror.fromTextArea(myTextarea, {
        lineNumbers: true,
        matchBrackets: true,
        mode: "text/x-stex",
        indentUnit: 4,
        indentWithTabs: false,
        enterMode: "keep",
        tabMode: "shift",
        extraKeys: {Tab: false, "Shift-Tab": false}
  });
    
  editor.setSize(null, 500);  
  editor.getWrapperElement().style["font-size"] = "14px";
  
  editor.refresh();    
  editor.on('change', (args) => { vm.latex(editor.getValue()) } );  
    
  //WCAG missing form label fix
  codemirrorTextareaIdFix("latexInput");
});    
</script>

Kod po stronie serwera

Informacja

Aplikacja nie korzysta z kodu po stronie serwera.

Tagi

LaTeX

Dziękujemy!

()