Using the 'less than' operator ('<') in a JavaScript section within a SVG in the Anki card template editor

Anki Card Design
1

Hi everyone!

To create a card template, I’m using inline SVG and within that I’m using JavaScript to paint parts of the SVG in different colors according to given conditions.

For that, I need to use if-statements and in particular the ‘less than’ operator <.

While working on the card template, I have a copy of it in a seperate .svg file on my computer, which I view with my internet browser for testing and debugging.

I know I can’t use the < character within HTML without escaping or substituting it somehow. So, I have tried the combinations &lt; or &#60; . In my testing file, viewed with my browser, both versions work as expected. In Anki, they don’t.

Enclosing the whole script content like so:

<script><![CDATA[
  ...
  if (x < y) {
    ...
  }
  ...
  ]]></script>

also works in my testing file in my browser, but not in Anki.

In the Anki editor, I also tried the other comparison operators == and != whithin the if-statements and there, everything works as expected.

So the problem at this point is definitely only with the two characters < and > in Anki.

Does anyone know how to use them in the Anki card editor?

1 Like
2

I’m not sure if there is a straightforward way of doing what you want, but you can try workarounds like

if (Math.max(x, y) === y && x!==y) {
...
1 Like