Mathjax - using bbox extension for custom color

[saf....@gmail.com]

In LaTeX I can include \definecolor{BrightGreen}{rgb}{0.4, 1.0, 0.0} in preamble and then use  \colorbox{BrightGreen}{SomeMath}

I would like to do an equivalent in MathJax, for example, \(\bbox[BrightGreen]{someMath}\) to display a bright green background.

Thanks..Saf

[Sandor Szabo]

Hi Saf,

If I understand well your aim, one possible solution is 

\bbox[lightblue,5px,border:2px solid red]{\color{#800000}

{ \bf{I(t)=e^{-t/(RC)}\left(\frac{1}{R}\int_0^t e^{\tau/(RC)}E'(\tau)\,d\tau+I_0 \right).}}}

see my blog page  http://diffeqinapplications.blogspot.hu/2016/02/electric-circuits.html , Problem 1, Solution.

I hope it helps you.

Sandor

[saf....@gmail.com]

Sandor, thank you for trying to help. What I'm after is to define a custom color either inside a MathJax in-line configuration or inside a MathJax local configuration file and then use the custom color as an input of bbox[myCustomColor]{someMath} throughout a web page. Your example is using a built-in color as an input of bbox[...]{...}. Thanks..Saf

[Davide P. Cervone]

The color extension allows you to use \definecolor and \colorbox, so if you include that in your configuration, e.g., add

<script type="text/x-mathjax-config">

MathJax.Hub.Config({

  TeX: {extensions: ["color.js"]}

});

</script>

BEFORE the script that loads MathJax.js, that would do it.  Or you could use \require{color} in an expression in the page.  For example

\(\require{color}\definecolor{BrightGreen}{rgb}{0.4, 1.0, 0.0}\)

\(\colorbox{BrightGreen}{$x+1$}\)

should do what you are after.

Davide

--
You received this message because you are subscribed to the Google Groups "MathJax Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mathjax-user...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[saf....@gmail.com]

Davide, I'm already loading color.js before MathJax.js, and the custom color BrightGreen works with colorbox but not with bbox extension. As noted in the subject line of my post, I am interested in using custom color as an input of bbox. I like to use bbox specially in inline math as, unlike colorbox, it does not produce extra spaces around math as you can see the comparison of colorbox vs. bbox below. But since "green" is too dark I want to use BrightGreen but that does not work with bbox:

1. Inline Math display of \(\sqrt{\colorbox{BrightGreen}{$t^4+1$}}\) with \definecolor{BrightGreen}{rgb}{0.4, 1.0, 0.0}\):
   

2. Inline Math display of \(\sqrt{\bbox[green]{t^4+1}}\). I want to show it with BrightGreen but that does not work:

Thanks..Saf

[jjto...@gmail.com]

It seems that \bbox only accepts standard HTML color names, not colors defined through \definecolor. This means that, although you can't use custom colors, at least you can choose from a wide range. See admisible colors here: http://www.w3schools.com/colors/colors_names.asp

For example, \(\sqrt{\bbox[Chartreuse]{t^4+1}}\) or \(\sqrt{\bbox[GreenYellow]{t^4+1}}\) seem to yield something similar to that you are seeking for.

A different approach could be to modify the padding of the box generated by \colorbox. In standard LaTeX, this can be done by setting the \fboxsep length. I've seen that the color.js extension contains the following lines:

config: MathJax.Hub.CombineConfig("TeX.color",{

    padding: "5px",

    border: "2px"

  })

So I assume that the default padding can be changed somehow when loading MathJax. I don't know how to do that. Perhaps Davide or Peter could explain it.

Regards 

Juanjo

El jueves, 12 de mayo de 2016, 19:30:18 (UTC+2), saf....@gmail.com escribió:

Davide, I'm already loading color.js before MathJax.js, and the custom color BrightGreen works with colorbox but not with bbox extension. As noted in the subject line of my post, I am interested in using custom color as an input of bbox. I like to use bbox specially in inline math as, unlike colorbox, it does not produce extra spaces around math as you can see the comparison of colorbox vs. bbox below. But since "green" is too dark I want to use BrightGreen but that does not work with bbox:

1. Inline Math display of \(\sqrt{\colorbox{BrightGreen}{$t^4+1$}}\) with \definecolor{BrightGreen}{rgb}{0.4, 1.0, 0.0}\):
   

[jjto...@gmail.com]

Well, I think I got it. To change the padding in the box genertaed by \colorbox, load MathJax with

   <script type="text/x-mathjax-config">

        MathJax.Hub.Config({

          TeX: {extensions: ["color.js"]},

          config: MathJax.Hub.CombineConfig("TeX.color",{ padding: "1px" })

        });

    </script>

    <script type="text/javascript"

       src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML">

    </script>

Then

\(\definecolor{BrightGreen}{rgb}{0.4, 1.0, 0.0}\)

\(\sqrt{\colorbox{BrightGreen}{$t^4+1$}}\)

yield the desired result.

Regards

Juanjo

[Davide P. Cervone]

Juanjo:

Thanks for pointing out the configuration parameters for the color extension.  I had forgotten that those were there, and they certainly can be used to make \colorbox work more like \bbox.

Your configuration is not quite what it should be, however.  It should be

<script type="text/x-mathjax-config">

MathJax.Hub.Config({

  TeX: {

    extensions: ["color.js"],

    color: {padding: "1px"}

  }

});

</script>

which is easier anyway.

Again, thanks for your great suggestion.

Davide