Home Explore Help
Sign In
billie
/
www.billiegoose.xyz
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Branch: master
Branches Tags
www.billiegoose...
/
projects
/
javascript-cnc-machine
/
index.html

index.html 3.9 KB
Permalink History Raw

12345678910111213141516171819202122232425262728293031323334353637383940414243444546 
  1. <!DOCTYPE html>
    2. 

  2. <html>
    3. 

  3.   <head>
    4. 

  4.     <meta charset="utf-8">
    5. 

  5.     <title>Javascript CNC Machine Emulator</title>
    6. 

  6.     <meta name="viewport" content="width=device-width, initial-scale=1">
    7. 

  7.     <link rel="stylesheet" href="//yegor256.github.io/tacit/tacit.min.css">
    8. 

  8.     <!-- favicon -->
    9. 

  9.     <link rel="apple-touch-icon" sizes="180x180" href="/favicon/apple-touch-icon.png?v=3">
    10. 

  10.     <link rel="icon" type="image/png" sizes="32x32" href="/favicon/favicon-32x32.png?v=3">
    11. 

  11.     <link rel="icon" type="image/png" sizes="16x16" href="/favicon/favicon-16x16.png?v=3">
    12. 

  12.     <link rel="manifest" href="/favicon/site.webmanifest?v=3">
    13. 

  13.     <link rel="mask-icon" href="/favicon/safari-pinned-tab.svg?v=3" color="#ffb300">
    14. 

  14.     <link rel="shortcut icon" href="/favicon/favicon.ico?v=3">
    15. 

  15.     <meta name="msapplication-TileColor" content="#00aba9">
    16. 

  16.     <meta name="msapplication-config" content="/favicon/browserconfig.xml?v=3">
    17. 

  17.     <meta name="theme-color" content="#ffffff">
    18. 

  18.     <!-- https://realfavicongenerator.net/favicon_result?file_id=p1i11gpomc1kc09h71jmnr19kp6 -->
    19. 

  19.   </head>
    20. 

  20.   <body>
    21. 

  21.     <header>&#xA0;</header>
    22. 

  22.     <section>
    23. 

  23.       <article>
    24. 

  24.         <!--
    25. 

  25. title: Javascript CNC Machine Emulator
    26. 

  26. -->
    27. 

  27. <h1 id="javascript-cnc-machine-emulator" class="deep-link"><a href="#javascript-cnc-machine-emulator">Javascript CNC Machine Emulator</a></h1>
    28. 

  28. <p>The University of Cincinnati&apos;s Robotics Team had a DYNA MYTE 2400 CNC machine sitting in its lab for several years. After sitting unused for many years, someone found the manual and I quickly made it my project to learn how to use it. During my time in California, I developed an urge to send a unique kind of postcard to my friends at the Robotics Team at UC - a CNC-it-yourself postcard. Having written a report on CNC machines comparing G-code with the native language of the DYNA MYTE 2400 the previous quarter, I knew the basic commands by heart (and could reference the manual for the rest). After coming up with my design for the postcard and writing out the code I thought would produce it, I decided I needed some way to test it before I sent it to the team. So I spent a couple of nights learning how to use the HTML5 <code>&lt;canvas&gt;</code> element and made a quick 2D emulator to parse my DYNA MYTE code and render it.</p>
    29. 

  29. <div class="youtube-video"><iframe width="560" height="315" src="https://www.youtube.com/embed/ZL0pXrBJSBo" frameborder="0" allowfullscreen></iframe></div>
    30. 

  30. <p><em>Video demonstrating my Javascript emulator of the lab&apos;s CNC machine</em></p>
    31. 

  31. <p>I sent them the code, and a link to this YouTube video to encourage them to machine the postcard. However, no one understood the machine as well as I did, and they weren&apos;t able to get the code entered while I was in California. It wasn&apos;t until I returned and entered the code myself that the postcard became a physical reality.</p>
    32. 

  32. <p>You can try the emulator yourself here: <a href="CNC_Simulator.html">CNC_Simulator.html</a> It is just an HTML page with the Javascript source code embedded and no external references. Here are some sample CNC programs you can try:</p>
    33. 

  33. <ul>
    34. 

  34. <li><a href="CNC_Spiral.txt">CNC_Spiral.txt</a> - A simple example</li>
    35. 

  35. <li><a href="CNC_D-SUB_PROGRAM.txt">CNC_D-SUB_PROGRAM.txt</a> - A program for cutting D-SUB sockets in sheet metal, which was the first use of the machine for the robotics team.</li>
    36. 

  36. <li><a href="CNC_California.txt">CNC_California.txt</a> - The program seen in the video above.</li>
    37. 

  37. <li><a href="CNC_California_Subs.txt">CNC_California_Subs.txt</a> - The same program, but using subroutines.</li>
    38. 

  38. <li><a href="CNC_UC_Logo.txt">CNC_UC_Logo.txt</a> - A program for cutting the UC logo into sheet metal. (Note that UC&apos;s Logo is subject to regulations and shouldn&apos;t be used without permission.)</li>
    39. 

  39. </ul>
    40. 

  40. <p><em>Note</em>: You will have to change the Pixels per Inch setting based on your monitor to scale the image if it doesn&apos;t fit.</p>
    41. 

  41. 

  42.       </article>
    43. 

  43.     </section>
    44. 

  44.     <footer>&#xA0;</footer>
    45. 

  45.   </body>
    46. 

  46. </html>
    47.