如何在JSXGraph中使用MathJax作为记号标签

Question

我正在使用JSXGraph，并希望使用MathJax将轴记号标记为分数。例如，(frac{1}{2})

不知道怎么做。

Answer 1

请允许我给出一个更长的答案。

1. 如果你只想用MathJax数学字体显示勾号标签，可以对y轴进行如下操作：

   var board = JXG.JSXGraph.initBoard('jxgbox', {
   boundingbox: [-0.1, 3, 1, -3],
   axis: true,
   defaultAxes: {
   y: {
   ticks: {
   label: {
   fontSize: 18,
   display: 'html',
   cssStyle: 'font-family: MJXZERO, MJXTEX',
   offset: [-10, -5]
   }
   }
   }
   }
   });
   

重要的属性是display:'html'和cssStyle: 'font-family: MJXZERO, MJXTEX',。当然，您必须包含MathJax JavaScript库。

2. 如果您想使用MathJax来显示标签，可以这样做(对于x轴(：

const board = JXG.JSXGraph.initBoard('jxgbox', {
boundingbox: [-1, 10, 11, -2],
axis: true,
defaultAxes: {
x: {
ticks: {
label: {
fontSize: 15,
parse: false,
useMathJax: true,
display: 'html'
},
generateLabelText: (tick) => {
return '\(' + tick.usrCoords[1].toFixed(0) + '\)';
}
}
}
}
});

3. 最后，回到你最初的问题：最好的方法似乎是生成新的、固定的tick，类似于2(：

   const board = JXG.JSXGraph.initBoard('jxgbox', {
   boundingbox: [-0.1, 3, 1, -3],
   axis: true,            
   defaultAxes: {
   x: {
   ticks: {
   visible: false,
   drawLabels: false,
   }
   },
   y: {
   ticks: {
   label: {
   fontSize: 18,
   parse: false,
   display: 'html',
   CssStyle: 'font-family: MJXZERO, MJXTEX',
   offset: [-10, -5]
   }
   }
   }
   }
   });
   board.create('ticks', [board.defaultAxes.x, [0.25, 0.5, 0.75]], {
   drawLabels: true,
   label: {
   fontSize: 20,
   parse: false,
   useMathJax: true,
   display: 'html',
   offset: [-10, -25]
   },
   generateLabelText: (tick) => {
   var v = tick.usrCoords[1];
   switch (v) {
   case 0.25:
   return '\(\frac{1}{4}\)';
   case 0.5:
   return '\(\frac{1}{2}\)';
   case 0.75:
   return '\(\frac{3}{4}\)';
   }
   }
   });
   

您可以在https://jsfiddle.net/ba8xh9jz/1/和3(https://jsfiddle.net/ba8xh9jz/2/.