web-dev-qa-db-fra.com

Quelle est la meilleure façon d'écrire des équations mathématiques sur le Web?

Je travaille sur une page Web liée aux mathématiques et je cherche une solution pour écrire facilement des équations mathématiques sur une page Web. Plusieurs solutions sont actuellement disponibles pour moi:

  • Utilisez LaTeX et publiez-les sur ma page Web sous forme d'images.
  • Utiliser MathML

Ces deux solutions ne sont pas idéales et semblent quelque peu datées. Remplacer ce qui devrait être du texte par une image n'est jamais une bonne idée et MathML n'est pas compatible avec tous les navigateurs/systèmes d'exploitation. 

J'espère qu'il existe une solution moderne pour utiliser des images ou MathML, peut-être quelque chose utilisant sIFR pour afficher des équations mathématiques? Après quelques recherches, je n'ai pas encore trouvé de solution réelle.

Veuillez noter que je demande une nouvelle façon de publier des équations. Je ne veux pas que les images soient la sortie affichée sur la page Web et préférerais que ces équations soient rendues sous forme de données textuelles. MathML est le plus proche de moi, mais ce n'est toujours pas idéal. Je me demande depuis un moment si un outil de remplacement tel que sIFR pourrait être utilisé pour créer des équations dans Flash. Quelqu'un a des suggestions sur ce front?

EDIT: Cela fait un moment que j'ai mis à jour ce message pour la dernière fois, mais avec l'adoption de HTML5 par les navigateurs, un nouveau joueur dans le jeu introduit de nouveau LaTeX et MathML, MathJax! . MathJax est définitivement la voie à suivre!

Question similaire:Les équations mathématiques sur le Web

43
Mike B

Le package jsMath est une option qui utilise le balisage LaTeX et les polices natives. Citant leur page Web http://www.math.union.edu/~dpvc/jsMath/ :

Le package jsMath fournit une méthode d'inclure les mathématiques dans les pages HTML qui fonctionne sur plusieurs navigateurs sous Windows, Macintosh OS X, Linux et d'autres saveurs d'Unix. Il surmonte un certain nombre de lacunes de la méthode traditionnelle d'utilisation des images pour représenter les mathématiques: jsMath utilise des polices natives, donc ils redimensionner lorsque vous modifiez la taille du fichier texte dans votre navigateur, ils impriment à la résolution complète de votre imprimante, et vous n'avez pas à attendre des dizaines des images à télécharger pour voir les mathématiques dans une page Web . Il y a aussi des avantages pour la page Web auteurs, car il n’est pas nécessaire de prétraitez vos pages Web pour générer toutes les images, et les mathématiques sont entré dans le formulaire TeX, il est donc facile de créer et maintenir vos pages Web.

Voir par exemple cette page ou celle-là .

17
Fanfan

Je viens d'écrire un module javascript appelé jqmath. Voir http://mathscribe.com/author/jqmath.html

C'est un peu similaire à MathJax, mais plus simple, plus petit et plus rapide.

9
Dave Barton

J'ai utilisé des tableaux sans bordure avec des cellules fusionnées sur mon site Web pour afficher des équations mathématiques. Cela fonctionne très bien pour la plupart des équations. Cependant, étant donné que le balisage est généralement un peu complexe, cela prendrait beaucoup de temps dans le cas de sites Web en mathématiques complexes.

Voici le code:

<style type="text/css">
  table.math{font:17px georgia, times, serif;border-collapse:collapse;border:none;}
  td.a{text-align:center;}
  td.b{padding:0 2px;}
  td.c{border-top:1px solid #505050;border-left:1px solid #505050;border-bottom:1px solid #505050;}
  td.d{border-top:1px solid #505050;border-right:1px solid #505050;border-bottom:1px solid #505050;}
  td.e{text-align:center;border-top:1px solid #505050;}
</style>
<table class="math">
  <tr>
    <td class="a">1</td>
    <td class="b" rowspan="2">&times;</td>
    <td class="c" rowspan="2">&nbsp;</td>
    <td class="a">8</td>
    <td class="b" rowspan="2">+</td>
    <td class="a">1</td>
    <td class="d" rowspan="2">&nbsp;</td>
  </tr>
  <tr>
    <td class="e">x + 2</td>
    <td class="e">x + 2</td>
    <td class="e">x &minus; 1</td>
  </tr>
</table>

Voici la sortie du code ci-dessus:

enter image description here

4
erfan

LaTeX est déjà largement utilisé sur le net et dans les universités pour rendre les équations.

Un bon exemple de ceci est wikipedia, regardez cette page pour 1 exemple.

http://en.wikipedia.org/wiki/Latitude

Je sais que c’est une généralisation, mais: L’utilisation d’images est un moyen viable d’atteindre beaucoup de choses sur le Web de manière compatible avec un navigateur - à condition de prévoir certaines des lacunes. (par exemple, Google Maps, coins arrondis, graphiques, typographie avancée)

De plus, "daté" pourrait être interprété comme "essayé, testé et complet" 

et merci de signaler sIFR - quelque chose que je vais regarder plus tard, j'ai déjà une liste de choses à explorer avec elle, telles que l’impression? (html + images peuvent très bien faire cela, peut-on utiliser sIFR? ....)

3
Mesh
1
jiv-e

MathTran est la solution la plus agréable que j'ai trouvée:

http://www.mathtran.org/

1
jvvw

J'aime les deux MathBin.net et L'éditeur d'équation en ligne de Roger . Ce dernier vous permet de contrôler la qualité de la sortie.

1
lhf

J'utilise le plugin LaTeX pour le wiki Confluence pour écrire des équations sur le Web (enfin, sur l'intranet). Il affiche une image dans le navigateur Web, mais vous pouvez toujours voir la source LaTeX si vous modifiez la page.

Je ne sais pas ce que vous utilisez pour héberger le site Web, mais vous pourriez peut-être utiliser une approche similaire: incorporer la source LaTeX dans la page et la restituer sous forme d'image pour le navigateur Web.

1
Tim Robinson

Cela dépendra de votre objectif principal et de votre public.

MathML (MathML2) semble prometteur, mais de nombreux problèmes de compatibilité persistent entre les navigateurs et les éditeurs (ou les générateurs) d’équations MathML. De nombreuses équations complexes ne seront pas conservées ni affichées de la même manière sur différents navigateurs. De nombreux éditeurs, convertisseurs et générateurs de mathématiques disent qu'ils prennent en charge MathML. Mais le résultat n'est pas le même bien que la sortie puisse sembler similaire. Et il n'est pas facile/impossible de définir de nombreuses équations complexes dans MathML 2 . Si vous n'avez que quelques équations simples et si vous pouvez faire en sorte que votre public utilise un certain navigateur, cela peut être une option . MathML3 est largement pris en charge, alors MathML pourrait être la solution.

Si vos expressions mathématiques ne sont pas interactives et ne doivent pas être générées dynamiquement) et plutôt statiques sur la page, une image au format PNG ou JPG peut être une bonne option. La taille des images n’est pas très grande dans la plupart des cas et l’affichage de dizaines d’équations sur une page est assez rapide, car la plupart d’entre nous avons actuellement un accès Internet à haut débit. Peu de différence entre les images PNG et les approches de rendu basées sur des scripts car les équations basées sur les scripts ne représentent souvent que quelques ko et qu'il faut du temps pour restituer les images à partir de l'ordinateur local après le téléchargement de tous les scripts ..__ également. applications qui prennent en charge la réédition des images d’équations basées sur le format PNG ou JPG . MathMagic (www.mathmagic.com) prend en charge le PNG rééditable (fichier au format PNG transparent également), GIF, JPG, BMP . MathType (www. .dessci.com) prend en charge le format GIF rééditable. MathMagic lit également les images MathType.

Si un format d’image vectoriel est requis pour l’écran et les impressions haute qualité telles que l’impression, SVG peut être la solution. En outre, PDF peut être une option dans certains cas . De nombreux éditeurs d'équations Mac prennent en charge le format PDF, car il s'agit d'une sorte de format (presque natif) de Mac OS X. Toutefois, seuls quelques-uns des supports PDF sous Windows . Il semble que la dernière version de MathType Mac prend en charge les formats PDF. MathMagic prend en charge PDF sur Mac et Win. MathMagic semble également prendre en charge le format SVG.

Si les équations sont créées par certains auteurs limités, il existe de nombreuses options à combiner pour obtenir les meilleurs résultats. Comme utiliser l’éditeur d’équations MathML/XML intégré à la dernière version de MS Word, puis convertir les pages en Web. Ou en utilisant quelques éditeurs d’équations WYSIWYG tiers (tels que MathType ou MathMagic) pour une écriture et une édition rapides, puis en sauvegardant les équations dans un format d’équation conforme à MathML, LaTeX ou Wiki et en utilisant des moteurs de rendu d’équation en ligne tels que codecogs.com ou MathJax.

Si le contenu doit également être utilisé pour d'autres formats, tels que eBook/ePub, d'autres facteurs doivent être pris en compte, notamment la qualité des équations et l'intégration à la solution, telle que InDesign.

corrigez-moi s'il vous plaît si quelque chose est incorrect.

0
Sci Tech

Vous pouvez écrire votre latex directement dans votre page HTML et l'afficher dynamiquement à l'aide de cette bibliothèque :

http://www.codecogs.com/components/equationeditor/equationeditor.php

0
karlipoppins

La solution consiste à utiliser http://www.codecogs.com/components/equationeditor/equationeditor.php

Le site Web vous permet de taper votre équation au format LaTeX et en utilisant son serveur TeX, il convertira l’équation en images et vous pourrez y afficher votre équation mathématique.

laissez-moi vous montrer un exemple, supposons que je veuille imprimer une formule d'intégration que je tape simplement:

img style = "display: block; float: none; margin-left: auto; margin-right: auto" title = "\int_ {a} ^ {b} (x + 2) dx " src = "http://latex.codecogs.com/gif.latex?\int_{a}^{bBuch(x+2)dx"

Reportez-vous au troisième code ci-dessus. L'équation mathématique LaTex est insérée après le point d'interrogation dans src = " http://latex.codecogs.com/gif.latex?[put votre code TeX ici]"

0
calculus1985

iTex2Img est le meilleur que je n'ai jamais utilisé. Voici une capture d'écran avec un exemple. 

enter image description here

0
SparkAndShine