时间戳

首页 > 解决方案 > 如何使用 JSXgraph 中包含的 mathJax 将文本转换为乳胶？

javascript - 如何使用 JSXgraph 中包含的 mathJax 将文本转换为乳胶？

问题描述

我正在尝试使用 JSXgraph 0.99.7 附带的 mathJax 渲染一个方程。

简单的形式似乎呈现 (r^2=(xh)^2+(yk)^2)，但不是函数或分数 (1=\frac{(xh)^2}{a^2}+\frac{( yk)^2}{b^2})。

这是一张图片

当前绘制椭圆的代码：

var graph = board.create('ellipse', [A, B, C], {
        id: field,
        fixed: true,
        useMathJax: true,
        withLabel: true,
        name: '',
        strokeColor: color,
        strokeWidth: 2,
        fillColor: shade,
        fillOpacity: 0.3,
        size: 2,
        dash: dashed,
        highlightStrokeColor: 'red',
        highlightStrokeWidth: 3,
        highlightFillColor: shade,
        highlightFillOpacity: op
    });
    graph.on('down', function (e, i) {
        showMaster(this.id); 
        graph.setName('1=\\frac{(x-h)^2}{a^2}+\\frac{(y-k)^2}{b^2}');
    });

有什么建议么 ？

标签： javascriptmathmathjaxjsxgraph

解决方案

默认情况下，不会为 MathJax 内容解析标签。必要的更改是添加

   label: {useMathJax: true, visible: false}

到椭圆声明。此外，我想建议在创建椭圆时设置名称，并将标签设置为在down事件中可见。

这是完整的示例：

MathJax.Hub.Config({
    extensions: ["tex2jax.js","TeX/AMSmath.js","TeX/AMSsymbols.js"],
    jax: ["input/TeX", "output/HTML-CSS"],
    tex2jax: {
      inlineMath: [ ['$','$'], ["\\(","\\)"] ],
      displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
    },
    "HTML-CSS": { availableFonts: ["TeX"] }
  });

var A = board.create('point', [-2, 0]);
var B = board.create('point', [1, 0]);
var C = board.create('point', [0, 2]);

var graph = board.create('ellipse', [A, B, C], {
    withLabel: true,
    strokeColor: 'black',
    strokeWidth: 2,
    fillColor: '#cccccc',
    fillOpacity: 0.3,
    highlightStrokeColor: 'red',
    highlightStrokeWidth: 3,
    name: '$1=\\frac{(x-h)^2}{a^2}+\\frac{(y-k)^2}{b^2}$',
    label: {useMathJax: true, visible: false}
});
graph.on('down', function (e, i) {
    graph.label.setAttribute({visible: true});
});

在http://jsfiddle.net/r3fxcp54/1/现场观看

推荐阅读