Jsxgraph 旋转和 LaTex 文本 CSS：JavaScript / JSXGraph

如何解决Jsxgraph 旋转和 LaTex 文本 CSS：JavaScript / JSXGraph

board.create('text',[40,42.5,'Ligne de certitude'],{highlightstrokeColor: 'red',display: 'internal',rotate: 45,fontSize:8});

这项工作。但是当我用 LaTex 机制（Mathjax）替换文本时，它失败了。为什么

解决方法

在您的示例中，您指定了 display:'internal'，它强制 JSXGraph 使用 SVG 文本元素来呈现文本。但是，SVG 文本元素无法应对 MathJax。另一方面，您可以轻松旋转它们。 如果您想要旋转 MathJax 文本，您必须设置 display:'html' 并使用 CSS 强制旋转。 下面是一个例子：

CSS：

.rotated {
  transform: rotate(-45deg); 
}

JavaScript / JSXGraph

const board = JXG.JSXGraph.initBoard('jxgbox',{ 
  boundingbox: [-5,5,-5],axis:true
});

// Text using SVG text
board.create('text',[-2,-3,'Ligne de certitude'],{
    display: 'internal',rotate: 45,fontSize:8});

// Dynamic text element,rotated with MathJax
var t2 = board.create('text',1,() => 'Ligne de certitude $$\\int$$'],{
    display: 'html',CSSClass: 'rotated',fontSize:10});

// Static text element,rotated with MathJax
var t3 = board.create('text',[2,'Ligne de certitude \\(\\int\\)'],parse: false,useMathjax: true,fontSize:10});        

可以在 https://jsfiddle.net/0aq23omf/

处查看示例