1

I'm trying a number of different ways to render mathjax in highcharts but nothing is working! Please let me know if this is possible. You can see in the fiddle that Mathjax is being rendered, just not in the chart:

categories: [
        '\(+x \)',
        '\\(+x \\)',
        '/\(+x /\)',

http://jsfiddle.net/nscozzaro/nr986r0x/

Halvor Holsten Strand
  • 19,829
  • 17
  • 83
  • 99
Nic Scozzaro
  • 6,651
  • 3
  • 42
  • 46

1 Answers1

2

Your format '\\(+x \\)' is already being replaced in Highcharts, however, you have not enabled HTML for the labels. Simply add this code:

xAxis: {
    labels: {
        useHTML: true
    }
    categories: [
        '\\(+x \\)',
        // ...
    ]
}

Or see this updated JSFiddle example.

The same useHTML feature exists for legend, series.dataLabels, title, subtitle, tooltip and a few other places where you can use text. If in doubt, search the API.

Halvor Holsten Strand
  • 19,829
  • 17
  • 83
  • 99
  • A follow-up question, regarding the tooltip: currently "useHTML: true" is set inside the tooltip, but the mathjax isn't being rendered in the tooltip. What's the reason for this and how can I make it render in the tooltip? – Nic Scozzaro Feb 16 '16 at 03:56
  • And a last question is why is double slashing necessary: \\( \\) as opposed to just the regular \( \)? – Nic Scozzaro Feb 16 '16 at 04:19
  • 2
    First question is [answered here](http://stackoverflow.com/a/5200579/2732991). MathJax is just run initially. You need to call some additional code to run it at the times when new math might appear for it to re-scan. Double slash is because backslash is an escape character in JS, so you need to escape the escape character for it to show up. – Halvor Holsten Strand Feb 16 '16 at 05:55