LaTeX2Web, a web authoring and publishing system
LaTeX2Web, a web authoring and publishing system
If you see this, something is wrong
To get acquainted with the document, the best thing to do is to select the "Collapse all sections" item from the "View" menu. This will leave visible only the titles of the top-level sections.
Clicking on a section title toggles the visibility of the section content. If you have collapsed all of the sections, this will let you discover the document progressively, from the top-level sections to the lower-level ones.
Generally speaking, anything that is blue is clickable.
Clicking on a reference link (like an equation number, for instance) will display the reference as close as possible, without breaking the layout. Clicking on the displayed content or on the reference link hides the content. This is recursive: if the content includes a reference, clicking on it will have the same effect. These "links" are not necessarily numbers, as it is possible in LaTeX2Web to use full text for a reference.
Clicking on a bibliographical reference (i.e., a number within brackets) will display the reference.
Speech bubbles indicate a footnote. Click on the bubble to reveal the footnote (there is no page in a web document, so footnotes are placed inside the text flow). Acronyms work the same way as footnotes, except that you have the acronym instead of the speech bubble.
By default, discussions are open in a document. Click on the discussion button below to reveal the discussion thread. However, you must be registered to participate in the discussion.
If a thread has been initialized, you can reply to it. Any modification to any comment, or a reply to it, in the discussion is signified by email to the owner of the document and to the author of the comment.
The blue button below that says "table of contents" is your tool to navigate in a publication.
The left arrow brings you to the previous document in the publication, and the right one brings you to the next. Both cycle over the publication list.
The middle button that says "table of contents" reveals the publication table of contents. This table is hierarchical structured. It has sections, and sections can be collapsed or expanded. If you are a registered user, you can save the layout of the table of contents.
First published on Monday, Sep 15, 2025 and last modified on Friday, Sep 26, 2025
I am normally hidden by the status bar
LaTeX2Web lets you draw data in graphics using the chart.js library.
Data resides in a CSV file, and the styling is in the LaTeX code.
We will use the following data in the examples.
| Red | Blue | Yellow | Green | Purple | Orange | |
| # of Votes | 12 | 19 | 3 | 5 | 2 | 3 |
| Average age | 35 | 22 | 55 | 64 | 32 | 15 |
| Red | Blue | Yellow | Green | Purple | Orange | |
| # of Votes | 12 | 19 | 3 | 5 | 2 | 3 |
Charts are embedded in a chart environment. Then optional parameter for the \begin{chart} command is the type of the chart. You can also use the \type command in the chart definition. The default type is line . Next the \data command indicate the CSV file where the data is stored.
Now for the styling.
The chartStyle environment includes the styling parameters for the chart as a whole.
Inside the chartStyle, you may also style each row of data individually, using the rowStyle environment, each opening statement having the number of the row as a second (mandatory) parameter. Here is the structure.
\begin{chart}
\caption{caption text}
\data{CSV file location}
\begin{chartStyle}
... styling commands for the chart ...
\begin{rowStyle}{1}
... styling commands for row 1 ...
\end{rowStyle}
\begin{rowStyle}{2}
... styling commands for row 2 ...
\end{rowStyle}
\end{chartStyle}
\end{chart}Let us give now a few examples with source code.
Chart 1. Line chart
Here is the code.
\begin{chart}
\caption{Line chart}
\data{chartTest.csv}
\begin{chartStyle}
tension=0.4
\begin{rowStyle}{1}
borderColor=red pointStyle=circle pointRadius=8
\end{rowStyle}
\begin{rowStyle}{2}
borderColor=green pointStyle=triangle pointRadius=8
\end{rowStyle}
\end{chartStyle}
\end{chart}For details, please refer to the chart.js documentation.
Chart 2. Bar chart
Here is the code.
\begin{chart}
\caption{Bar chart}
\data{chartTest.csv}
\type{bar}
\begin{chartStyle}
borderRadius=5 borderWidth=3 borderColor=black
\begin{rowStyle}{1}
backgroundColor=red
\end{rowStyle}
\begin{rowStyle}{2}
backgroundColor=green
\end{rowStyle}
\end{chartStyle}
\end{chart}For details, please refer to the chart.js documentation.
Chart 3. Pie chart
Here is the code.
\begin{chart}[pie]
\caption{Pie chart}
\data{PieTest.csv}
\begin{chartStyle}
backgroundColor=[red,blue,yellow,green,purple,orange] borderColor=black
\end{chartStyle}
\end{chart}For details, please refer to the chart.js documentation.
Chart 4. Doughnut chart. These charts can incluse several datasets.
Here is the code.
\begin{chart}[doughnut]
\caption{Doughnut chart. These charts can incluse several datasets.}
\data{chartTest.csv}
\type{doughnut}
\begin{chartStyle}
backgroundColor=[red,blue,yellow,green,purple,orange] borderColor=black
\end{chartStyle}
\end{chart}For details, please refer to the chart.js documentation.
Chart 5. Polar area chart
Here is the code.
\begin{chart}[polarArea]
\caption{Polar area chart}
\data{PieTest.csv}
\type{polarArea}
\begin{chartStyle}
backgroundColor=[red,blue,yellow,green,purple,orange] borderColor=black
\end{chartStyle}
\end{chart}For details, please refer to the chart.js documentation.
Chart 6. Radar chart. These charts can incluse several datasets.
Here is the code.
\begin{chart}[radar]
\caption{Radar chart. These charts can incluse several datasets.}
\data{chartTest.csv}
\begin{chartStyle}
\begin{rowStyle}{1}
borderColor=pink backgroundColor=red?50
\end{rowStyle}
\begin{rowStyle}{2}
borderColor=lime backgroundColor=green?50
\end{rowStyle}
\end{chartStyle}
\end{chart}red?50 means that the red color is applied with an opacity of 50%.
For details, please refer to the chart.js documentation.