I have written a spad package HTMLFormat so that users can cut and paste output from the FriCAS command line into an HTML page. This output is enabled by typing:
)set output html on
(of course you need to download HTMLFormat (availible from: http://github.com/martinbaker/multivector/), configure FriCAS and compile everything first)
All the formulas on this page have been cut and pasted from FriCAS using HTMLFormat so you can see what it looks like. (more test results here)
It is based on similar outputs like TeXFormat and MathMLFormat. In some ways HTMLFormat is a compromise between the standard text output and specialised formats like MathMLFormat. The potential quality is never going to be as good as output to a specialised maths renderer but on the other hand it is a lot better than the clunky fixed width font text output.
It does have advantages that the other output formats don't, for instance,
- It works with any browser without the need for plugins (as far as I know most computers should have the required fonts)
- Users can easily annotate and add comments using colour, bold, underline and so on.
- Annotations can easily be done with whatever html editor or text editor you are familiar with.
- Edits to the output will cause the width of columns and so on to be automatically adjusted, no need to try to insert spaces to get the superscripts to line up again!
- It is very easy to customise output so, for instance, we can fit a lot of information in a compact space on the page.
HTMLFormat does not try to interpret syntax, for instance in this example it just takes what OutputForm provides and does not try to replace %A with the bound variable x.
(1) -> integral(x^x,x)
Type: Expression(Integer)
In order to see how we can make annotations lets generate a more complex expression:
(2) -> series(sin(a*x),x=0)
By using a html or text editor we can remove terms, add text and so on and the formatting automatically adjusts:
At the moment the default output for a matrix is a grid, my requirement is to fit big matrices on ordinary web pages:
(3) -> matrix [ [x^i + y^j for i in 1..4] for j in 1..4]
y+x |
y
+
x 2 |
y
+
x 3 |
y
+
x 4 |
y 2 +
x |
y 2 +
x 2 |
y 2 +
x 3 |
y 2 +
x 4 |
y 3 +
x |
y 3 +
x 2 |
y 3 +
x 3 |
y 3 +
x 4 |
y 4 +
x |
y 4 +
x 2 |
y 4 +
x 3 |
y 4 +
x 4 |
Type: Matrix(Polynomial(Integer))
However it easy to modify this for a single matrix, or a whole page or whole site by using css (cascading style sheets). For instance we can get a more conventional looking matrix by adding the following style to the top of the page:
<style type="text/css">
#matl {border-left-style:solid}
#matr {border-right-style:solid}
#matlt {border-left-style:solid;border-top-style:solid}
#matrt {border-right-style:solid;border-top-style:solid}
#matlb {border-left-style:solid;border-bottom-style:solid}
#matrb {border-right-style:solid;border-bottom-style:solid}
</style>
(3) -> matrix [ [x^i + y^j for i in 1..4] for j in 1..4]
y+x |
y
+
x 2 |
y
+
x 3 |
y
+
x 4 |
y 2 +
x |
y 2 +
x 2 |
y 2 +
x 3 |
y 2 +
x 4 |
y 3 +
x |
y 3 +
x 2 |
y 3 +
x 3 |
y 3 +
x 4 |
y 4 +
x |
y 4 +
x 2 |
y 4 +
x 3 |
y 4 +
x 4 |
Type: Matrix(Polynomial(Integer))
The problem now is that the columns are so close together that it is hard to tell where one column ends and another starts, this is easy to fix with just one line we can increase the cell spacing:
(3) -> matrix [ [x^i + y^j for i in 1..4] for j in 1..4]
y+x |
y
+
x 2 |
y
+
x 3 |
y
+
x 4 |
y 2 +
x |
y 2 +
x 2 |
y 2 +
x 3 |
y 2 +
x 4 |
y 3 +
x |
y 3 +
x 2 |
y 3 +
x 3 |
y 3 +
x 4 |
y 4 +
x |
y 4 +
x 2 |
y 4 +
x 3 |
y 4 +
x 4 |
Type: Matrix(Polynomial(Integer))
There are still problems with this, it increases the size of the matrix and therefore reduces the ability to have very big matrices on a page, it also accentuates the gaps in the left and right bars. The best solution that I have found so far is to have fainter bars between the elements but there are many possibilities including dotted lines.
(3) -> matrix [ [x^i + y^j for i in 1..4] for j in 1..4]
y+x |
y
+
x 2 |
y
+
x 3 |
y
+
x 4 |
y 2 +
x |
y 2 +
x 2 |
y 2 +
x 3 |
y 2 +
x 4 |
y 3 +
x |
y 3 +
x 2 |
y 3 +
x 3 |
y 3 +
x 4 |
y 4 +
x |
y 4 +
x 2 |
y 4 +
x 3 |
y 4 +
x 4 |
Type: Matrix(Polynomial(Integer))
There are many other possibilities, for instance we can generate a matrix with bars either side to indicate a determinant.
Further test results on this page.