Rotate text: Difference between revisions
From JSXGraph Wiki
| A WASSERMANN (talk | contribs) No edit summary | A WASSERMANN (talk | contribs) No edit summary | ||
| Line 14: | Line 14: | ||
| var t = brd.create('text',[0,2,function(){return 'text = '+s.Value().toFixed(3);}],{id:'my_t'}); | var t = brd.create('text',[0,2,function(){return 'text = '+s.Value().toFixed(3);}],{id:'my_t'}); | ||
| </jsxgraph> | </jsxgraph> | ||
| ===The CSS/JavaScript source code=== | |||
| <source lang="css"> | |||
| #my_t { | |||
|         -webkit-transform: rotate(-90deg); | |||
|         -moz-transform: rotate(-90deg); | |||
|         filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); | |||
| } | |||
| </source> | |||
| <source lang="javascript"> | |||
| var brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-5,5,5,-5], grid:true}); | |||
| var s = brd.create('slider',[[-3,0],[3,0],[0,1,10]], {name:'s'}); | |||
| var t = brd.create('text',[0,2,function(){return 'text = '+s.Value().toFixed(3);}],{id:'my_t'}); | |||
| </source> | |||
| [[Category:Examples]] | |||
Revision as of 10:30, 15 December 2009
Text can be rotated with CSS transformations. In that case JSXGraph text elements have to be realized with HTML div elements, which is the default case.
The CSS/JavaScript source code
#my_t {
        -webkit-transform: rotate(-90deg);
        -moz-transform: rotate(-90deg);
        filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
var brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-5,5,5,-5], grid:true});
var s = brd.create('slider',[[-3,0],[3,0],[0,1,10]], {name:'s'});
var t = brd.create('text',[0,2,function(){return 'text = '+s.Value().toFixed(3);}],{id:'my_t'});
