Hosting at your server

WIRIS editor comprises a Formula Image Service and an Applet Editor. This document explains how to install and use such components.

You will normally use the WIRIS editor with a Formula plugin but there are occasions where the WIRIS editor can be use alone. For example, a learning platform could provide a quizzes system and the students could type the answer of the mathematical questions with WIRIS editor.


WIRIS editor is comprised of the following components

  1. A visual formula editor based on the Java Applets technology which can be embedded in any Web form to allow editing formulas. This editor supports the MathML Presentation standard.
  2. An image service based on the Java Servlets technology which translates from MathML to images. The image service can be used to embed formulas in HTML pages without the need of any plug-in.
  3. A set of HTML pages to test both the formula editor and the image service.


In the server side, to run the image service, the following requirements are needed:

  1. Java 1.4 or higher
  2. A Java Web application server (like Tomcat).

The clients that need to edit formulas will require:

  1. The Java plug-in for the Web Browser installed and enabled.

Download and installation

Do the following steps

  1. DOWNLOAD file formula-XXX.war
  2. Change the name into formula.war and deploy it in the application server (see the specific documentation of your application server).

Note. In linux or unix servers, when the X libraries are not available the image service might be unable to generate any image. To fix it, the Java property java.awt.headless must be set to true. See
http://www.jguru.com/faq/view.jsp?EID=222296 or http://java.sun.com/developer/technicalArticles/J2SE/Desktop/headless/

Testing and using the formula editor applet

To test the formula editor, open the URL http://<server>/formula/editor.html where <server> is the server and port of the application server. You should see the following:

This Web page (editor.html and util.js) is an example of how using the formula editor. To get or set the MathML from/to the editor the following methods are available from JavaScript

String getContent()
void setContent(String s)

Applet parameters

The applet supports the following parameters

NameTypeDescriptionDefault value
contentstring-MathMLThe initial formula shown by the formula editor. This is an alternative to use setContent. 
fontSizeintegerThe base font size used by the formula editor16
bgColorcolorBackground color of the image. Ignored if transparency set to true.#FFFFFF (white)
langstringTwo letters indicating the language of the user interface. Available languages: ar, ca, de, en, es, et, eu, fr, gl, it, nl, pt, zh en
colorCan be used to control the colors of different parts of the formula.#000000 (black)

The page http://<domain:port>/formula/parameters.html (former http://<domain:port>/formula/codebase/parameters-editor.html) can be used to test the above parameters.

Testing and using the image service

Enter http://<domain:port>/formula/ to see the main page of the formula editor. The link formula/render points to where the image service is located (it will not work unless the mml parameter with the formula is set). To see a full example, go to Test page.

The image service generates PNG images from xml documents representing a formula. The xml code must be in the MathML format. To generate an image you must send the corresponding parameters using the HTTP GET or POST method to the image service URL. There is only one required parameter, which is the xml code representing the formula; this parameter is called mml.

Image service parameters

In addition to mml, the image service supports all the following parameters:

NameTypeDescriptionDefault value
mmlstring-MathMLThe initial formula shown by the editor 
fontSizeintegerThe base font size used by the formula16
centerBaselinebooleanIf true the baseline of the formula is always in the center of the image so the image can be aligned with the text in html document (when using the align=center attribute for the image)true
transparencybooleanIf true the image has a transparent background. Note that for Microsoft Internet Explorer browsers prior to version 7, a grey background is displayed instead.false
bgColorcolorBackground color of the image. Ignored if transparency set to true.#FFFFFF (white)
colorCan be used to control the colors of different parts of the formula.#000000 (black)