Text

[Cyrille Piatecki]

I wonder if there is a mode column for text. I know how to make a rotation. But to write in column seems not to exist.

[Alfred Wassermann]

Yes, this can done with plain CSS, e.g.

var txt = board.create('text', [1, 4, "Hello"],  {cssStyle: 'text-orientation: upright; writing-mode: vertical-lr;'});

See https://jsfiddle.net/db4vfsot/ for a live example.

Best wishes,

Alfred

[Cyrille Piatecki]

Thank you. But I have some joint questions.

1) I use mathjax and "Hello" is here not written in computer Modern font. How could I change the font.

2) Incidently you use cssStyle. Is it pure javascript or Jsxgraph. I would like to know how use it since I have tried

"

var input0 = board.create('input', [-1, 14, '0.1', '$p_0\\,\\,$'], {cssStyle: 'witdh:50px'});

"

which doesn't work (if can't change the width so the font the background...)

3) what is the difference with cssClass and cssStyle ?

Sorry to ask these questions,  but there are no real how to for Jsxgraph.

[Cyrille Piatecki]

I would add one thing.

What I want is to have access to the internal value of the box. I want to change the font, size of the font and its color, but also the characteristics of the box in itself. By the cssStyle it seems we have access only to the width and the height.

[Alfred Wassermann]

Dear Cyrille,

first, I want to note that in your example above, witdh should be changed to width.  

Then cssStyle and cssClass correspond 1-to-1 to the style attribute of HTML and CSS classes in HTML. In your case, it looks like it would be more elegant and easier to use cssClass.

In our wiki there is an example about cssClass: https://jsxgraph.org/wiki/index.php?title=Using_CSS_styles

The essence is that JSXGraph texts are HTML divs which can by styled with cssClass (and cssStyle).

The question for Computer Modern font is therefore a general question outside of the scope of JSXGraph. It has been discussed at various places, e.g. https://tex.stackexchange.com/questions/267196/how-can-i-use-standard-latex-font-computer-modern-in-a-web-page.

Regarding your question about JSXgraph in JSXgraph: Indeed it is possible, it can be realized with foreignObject, see https://jsxgraph.org/docs/symbols/ForeignObject.html .

However, the event handling may cause problems. However, you might consider two separate JSXGraph constructions which are stacked upon each other with CSS properties. In both cases, two boards can be connected by

board1.addChild(board2), see e.g. https://jsxgraph.org/wiki/index.php?title=Parabola .

Hope that helps,

Alfred