Sezione 10

LINE-RENDER

Visualizzare formule matematiche, strutture chimiche e HTML nella console.

Progresso del corso 100%

LINE-RENDER

LINE-RENDER è un'estensione dell'IDE che permette di visualizzare formule matematiche e strutture chimiche nella console. Richiede line-render.js e la libreria KaTeX.

La notazione è una versione abbreviata che viene compilata in LaTeX prima del rendering.

24.1 Blocchi RENDER

Sintassi per il rendering a blocco (su una riga separata, centrato):

RENDER{
    formula
  }

Tutto ciò che è tra { e } viene interpretato come formula e renderizzato nella console.

RENDER{
    s(k=0,n)(k2) = n(n+1)/2
  }

  RENDER{
    de(f)/de(x) = lim(h -> 0)((f(x+h) - f(x))/h)
  }

24.2 Render inline \R...\R

Per includere una formula direttamente all'interno di una riga di testo si usa la coppia di escape \R:

TALK Questo è un integrale \RS(0,1)(f(x))\R, ed è molto interessante.
  TALK La formula di Eulero è \Reu^(pi*i) + 1 = 0\R.

La formula tra i due \R viene renderizzata con KaTeX in modalità inline, allineata verticalmente al testo circostante.

24.3 Modalità CHEM — Strutture chimiche

Per disegnare molecole la prima riga del blocco deve essere CHEM. Ogni riga successiva descrive una molecola.

RENDER{
    CHEM
    C(HHH=O)
  }

Sintassi delle molecole:

RENDER{
    CHEM
    C(HHH=O)        >> metanale (formaldeide)
  }

  RENDER{
    CHEM
    C(H)(H)(=O)     >> carbonile con due H
  }

24.4 Notazione matematica

La notazione è compatta. Ogni espressione viene tradotta in LaTeX.

Operazioni di base
NotazioneSignificato
a + bsomma
a - bdifferenza
a * bprodotto
a/bfrazione
(a+b)/(c+d)frazione composta
n!fattoriale
Potenza e pedice
NotazioneRendering
x5x alla 5
x^(n+1)x alla (n+1)
x#(i)x con pedice i
a#(i)^(2)a con pedice i, alla 2
Radici
NotazioneRendering
R(x2+1)radice quadrata
R3(a3)radice cubica
Derivate
NotazioneTipo
f', y'', x'''Notazione di Newton
de(f)/de(x)Derivata ordinaria
dp(f)/dp(x)Derivata parziale
Sommatorie, produttorie, integrali, limiti
NotazioneRendering
s(k=0,n)(k2)Sommatoria
P(k=1,n)(k)Produttoria
S(0,1)(x2)Integrale definito
L(0)((sin(x))/x)Limite
Funzioni standard
NotazioneFunzione
sin(x), cos(x), tan(x)Trigonometriche
arcsin(x), arccos(x), arctan(x)Arco-trigonometriche
sinh(x), cosh(x), tanh(x)Iperboliche
ln(x), log(x), exp(x)Logaritmi ed esponenziale
Vettori, matrici e combinatoria
NotazioneRendering
v(x;y;z)Vettore colonna
M(2;2)(a;b;c;d)Matrice 2×2
C(n;k)Coefficiente binomiale
Perm(n;k)Permutazioni
CombR(n;k)Combinazioni con ripetizione
Decoratori, costanti e relazioni
NotazioneEffetto
vc(v)Vettore
ha(x)Cappello
ba(x)Barra
ti(x)Tilde
do(x) / do2(x)Punto / doppio punto
fl(x) / ce(x)Floor / Ceiling
pi, eu, I, naπ, e, ∞, ∇
alp, bet, gam...Lettere greche minuscole
Gam, Sig, Phi...Lettere greche maiuscole
->, =>, <=>→, ⇒, ⇔
~, !=, <=, >=≈, ≠, ≤, ≥

24.5 Salvataggio PDF della console

Il bottone PDF nella barra della console genera un PDF visivo della console, conservando il rendering delle formule e dei grafici chimici. Il PDF viene ridimensionato al contenuto effettivo.

Il bottone TXT salva invece il testo puro della console (le formule appaiono come testo sorgente).

24.6 Modalità HTML

La prima riga del blocco può essere HTML. Tutto il contenuto successivo viene interpretato come HTML grezzo e inserito direttamente nella console tramite innerHTML.

RENDER{
    HTML
    ...codice HTML...
  }

Questo permette di visualizzare nella console qualsiasi struttura HTML: tabelle, liste, immagini, testo stilizzato, componenti arbitrari.

RENDER{
    HTML
    <table border="1" style="border-collapse:collapse;color:#cdd9e5">
      <tr><th>Nome</th><th>Valore</th></tr>
      <tr><td>pi</td><td>3.14159</td></tr>
      <tr><td>e</td><td>2.71828</td></tr>
    </table>
  }

  RENDER{
    HTML
    <ul style="color:#80cbc4">
      <li>Primo elemento</li>
      <li>Secondo elemento</li>
    </ul>
  }
Nota: il contenuto HTML viene inserito senza sanitizzazione. Usare tag di script all'interno non è consigliato — l'HTML viene renderizzato nel contesto della console dell'IDE.

Hai completato tutte le sezioni!

Clicca sul bottone qui sotto per ricevere il tuo riconoscimento.