Jsxgraph 旋转和 LaTex 文本

Question

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

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

Answer 1

在您的示例中，您指定了 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, -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', [-2, 1, () => 'Ligne de certitude $$\int$$'], {
    display: 'html', 
    CSSClass: 'rotated',
    fontSize:10});

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

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

上看到。

Jsxgraph 旋转和 LaTex 文本

Jsxgraph Rotation and LaTex text

jsxgraph

CSS:

JavaScript / JSXGraph