Unable to draw with tikz

[axiomtutor]

Sorry for the somewhat sprawling "issue". This is really a request to see if you can refer me to some resources. I've tried using several different tool, like LaTeX.js, to generate math problems and diagrams which render in a web page. I'm getting to the point where I don't think I can just figure it out myself because I don't have an adequate CS background. I'm wondering if you can point me toward someone who is available as a consultant or tutor who knows how to use LaTeX.js or any other software that can do the job. I tried looking for people on WyzAnt and Codementor. Everyone I found wasn't able to figure out how to use the CLI for LaTeX.js. And in general they couldn't help me resolve all my issues with my project.

---

Although my request really is to find an expert who can teach me how to use these tools, I'll also describe exactly what I'm trying to do and what's going wrong.

I initially tried to use the CLI, but I just have no idea how to use it. So I just abandoned this pretty quickly and inserted the script tags in the head of the HTML to import LaTeX.js.

Now I'm trying to draw a diagram with arrows. I used the following code:

<style>
      latex-js {
        display: inline-block;
        width: 10cm;
        border: 1px solid red;
        margin-right: 2em;
      }
</style>

    <latex-js baseURL="https://cdn.jsdelivr.net/npm/latex.js@0.11.1/dist/">
      \documentclass{article}

      \begin{document}

      \frame{\setlength{\unitlength}{1mm}

        \begin{picture}(100, 100)

          \put(6,10){\circle{10}}
          \put(0,20){$\rho$}
          \put(80,10){\circle{10}}
          \put(80,20){$\vec{E}$}
          \put(40,50){\circle{10}}
          \put(36,60){$V$}

          \put(10, 10){\vector(80,80){1}}

        \end{picture}
      }
      \end{document}
    </latex-js>

But the arrow isn't rendering as I expected. I tried playing with the inputs to get it to point from one circle to another, but can't figure it out.

Thanks!

[michael-brade]

hi, indeed, this is not a problem with LaTeX.js :-) You need to understand the LaTeX graphics commands to be able to do what you want to do. You obviously used \put correctly. But the first argument of \vector is the "angle" of the arrow, how far to the right and how far up. The second argument is the length. So to go from the left circle to the right, you need

\put(11, 10){\vector(1,0){64}}

Also, I thought the CLI is pretty straightforward to use :-o Please let me know what didn't work for you, then I will update the documentation.