Jekyll2021-03-19T19:10:43+00:00https://rustytriangles.github.io//feed.xmlRusty TrianglesRusty Triangles is the github playground for Mike Garrity.Where’s This Train Going?2021-03-19T18:18:44+00:002021-03-19T18:18:44+00:00https://rustytriangles.github.io//jekyll/update/2021/03/19/cornu_spiral<p>I’m currently reading Julian Havil’s book <a href="https://press.princeton.edu/books/hardcover/9780691180052/curves-for-the-mathematically-curious">Curves for the Mathematically Curious</a>. The chapter on Euler’s spiral (which I’ve
always known as the Cornu spiral) had a comment which reminded me of my days at <a href="https://en.wikipedia.org/wiki/Applicon">Applicon</a>.</p>
<p>Imagine you’re laying railroad tracks and have to make a 90 degree turn. How exactly do you do that? If you remember playing with
model railroads as a child, it seems easy. You take some straight sections, then add enough arc sections to add up to 90 degrees.
Then you go back to straight sections. But that’s not how you do it on a real railroad. The reason has to do with something called continuity.</p>
<p>Let’s imagine we’re riding on that model railroad you built, and calculate what it would feel like. In particular, what
are the side forces you would feel? Obviously, when the train is on a straight section, there aren’t any side forces.
And almost as obviously, when it’s on an arc section, there’s a constant side force which is proportional to the
radius of the arc. But when the train goes from a straight to an arc (or from an arc to a straight), the force
changes suddenly. If you’re standing up while riding the train, that sudden change is going to make you stumble.</p>
<p>This is all simple calculus. When the train moves sideways (as in turning a corner), the first derivative of the
position is called <em>velocity</em>. The second derivative is called <em>acceleration</em>. That’s the side force you
feel. The second derivative is called <em>jerk</em>. Really! The next 3 derivatives are called <em>snap</em>, <em>crackle</em>,
and <em>pop</em>. Who said engineers don’t have a sense of humor?</p>
<p><img src="/images/cornu_model_accel.png" alt="Model" /></p>
<p>A mathematician would say that your model railroad is C<sup>1</sup>
continuous. That means that there isn’t a discontinuity in position or lateral velocity, but there may be in the acceleration.
To have a nice smooth ride, we’d like to keep the jerk small, which means you want at least C<sup>2</sup> continuity.</p>
<p>The way that’s done in practice is using the lovely <a href="https://mathworld.wolfram.com/CornuSpiral.html">Cornu spiral</a> as a
transition between the straights and the arcs. This spiral has the interesting property that the radius of curvature
changes linearly as you move along the curve. That means that it is possible to stick in a transition piece which
will make the side force smoothly ramp up from nothing on the straight section to the acceleration of the arc.</p>
<p><img src="/images/cornu_transition_accel.png" alt="Transition" /></p>
<p>The resulting corner looks something like this:</p>
<p><img src="/images/cornu_corner.png" alt="Corner" /></p>
<p>The red curve is our model railroad with the sudden transition from straight to arc. The blue curve is uses sections of
Cornu spirals to transition between them. The radius of the arc is the same in the two curves, but the blue one would feel
nicer if you were riding on the train. The markers show where the segments join.</p>
<p>Computing this shape is actually rather tricky. It involves something called <a href="https://en.wikipedia.org/wiki/Fresnel_integral">Fresnel integrals</a>.
<a href="https://github.com/rustytriangles/cornu/blob/master/src/corner.jl">Here’s a simple Julia script</a> that shows how it works. There
is actually a lot of other interesting math involved in designing real railroad lines. <a href="https://web.engr.uky.edu/~jrose/RailwayIntro/Modules/Module%206%20Railway%20Alignment%20Design%20and%20Geometry%20REES%202010.pdf">This AREMA presentation</a>
does a nice job of explaining many of the issues.</p>
<p>But what’s all this got to do with Applicon? They didn’t design railroad tracks. Actually, many of our biggest customers at Applicon
were car companies, and it turns out you hit a lot of these same issues when you are designing car bodies. Because cars have such
shiny paint jobs, discontinuities in the higher derivatives are very obvious in the reflections. That meant that to keep these customers
happy, we needed to ensure that it was very easy for a designer to get at least C<sup>2</sup> continuity when they were using our system
to design car bodies. We did this with <a href="https://en.wikipedia.org/wiki/Non-uniform_rational_B-spline">NURBS</a> instead of Cornu spirals, just
because the math is simpler.</p>
<p>We also did a rendering mode which showed up what your model would look like if it was polished and placed in a
room with stripes or checkerboards on the wall so that you could see any continuity issues. The result was kind of
trippy looking, but it was very good at highlighting issues before the user fabricated the shape.</p>I’m currently reading Julian Havil’s book Curves for the Mathematically Curious. The chapter on Euler’s spiral (which I’ve always known as the Cornu spiral) had a comment which reminded me of my days at Applicon.Rust -> WebAssembly2021-02-25T12:01:44+00:002021-02-25T12:01:44+00:00https://rustytriangles.github.io//jekyll/update/2021/02/25/rust_wasm_teapot<p>OK, time for another teapot. This one is a combination of the two in
<a href="https://rustytriangles.github.io/jekyll/update/2020/05/01/teapots.html">this earlier post</a>. The code
which creates the geometry of the teapot is copied from the Rust example, and the code which does the
rendering is copied from the WebGL example.</p>
<p>But how do they work together? Rust compiles to native, and WebGL is only available in a browser or in
something like <a href="https://www.electronjs.org/">electron</a>. The trick is something calle <a href="https://rustwasm.github.io/wasm-pack/book/">wasm-pack</a>. This compiles the Rust code to WebAssembly. Then you can use that as
a module you can call from JavaScript.</p>
<p><img src="/images/rust_wasm_teapot_screenshot.png" alt="Teapot" /></p>
<p>Connecting the two is surprisingly simple. You just mark the functions and types you want to
expose to javascript with the <code class="language-plaintext highlighter-rouge">wasm_bindgen</code> macro and then you can <code class="language-plaintext highlighter-rouge">import</code> them in your JS code.</p>
<p>The source is <a href="https://github.com/rustytriangles/rust-wasm-teapot">here</a>. You can run it from <a href="https://rustytriangles.github.io/rust-wasm-teapot/">github pages</a>.</p>OK, time for another teapot. This one is a combination of the two in this earlier post. The code which creates the geometry of the teapot is copied from the Rust example, and the code which does the rendering is copied from the WebGL example.Recursive Pentagons2020-10-05T17:22:44+00:002020-10-05T17:22:44+00:00https://rustytriangles.github.io//jekyll/update/2020/10/05/recursive_pentagons<p>I was reading Roger Penrose’s old Pentaplexity paper recently. It’s about the history of
his famous nonperiodic tile set. But I was particularly struck by one of the diagrams
showing how he started by subdividing pentagons recursively. I wanted an interactive
version to play with, so I made <a href="https://github.com/rustytriangles/recursive_pentagons">this</a>.
You can play with it <a href="https://rustytriangles.github.io/recursive_pentagons/">here on github pages</a>.</p>
<p><img src="/images/recursive_pentagons_screenshot.png" alt="recursive_pentagons" /></p>I was reading Roger Penrose’s old Pentaplexity paper recently. It’s about the history of his famous nonperiodic tile set. But I was particularly struck by one of the diagrams showing how he started by subdividing pentagons recursively. I wanted an interactive version to play with, so I made this. You can play with it here on github pages.Hex Tiles2020-10-02T20:24:44+00:002020-10-02T20:24:44+00:00https://rustytriangles.github.io//jekyll/update/2020/10/02/hextiles<p>I was playing around with the <a href="https://rustytriangles.github.io/jekyll/update/2020/09/22/tile_explorer.html">path tiles</a> again. This type I made a page that creates a grid of random Hexagon/1 tiles for you and then lets you edit them. You can find it at <a href="https://rustytriangles.github.io/hextile/">this github page</a>.</p>
<p><img src="/images/hextile_screenshot.png" alt="hextile" /></p>
<p>It’s written in React and SVG. You can find the source <a href="https://github.com/rustytriangles/hextile">here</a>.</p>I was playing around with the path tiles again. This type I made a page that creates a grid of random Hexagon/1 tiles for you and then lets you edit them. You can find it at this github page.Eisenstein Primes2020-09-30T18:24:44+00:002020-09-30T18:24:44+00:00https://rustytriangles.github.io//jekyll/update/2020/09/30/eisenstein-primes<p>If you’re anything like me, as soon as you saw the patterns <a href="https://rustytriangles.github.io/jekyll/update/2020/09/29/gaussian-primes.html">I was talking about yesterday</a>
in the Gaussian primes, you wanted to know whether there were similar patterns in the
<a href="https://en.wikipedia.org/wiki/Eisenstein_prime">Eisenstein primes</a>. So I made <a href="https://github.com/rustytriangles/eisenstein_primes">this</a> to find out.</p>
<p>The answer is yes. And I think they’re even cooler, just because they look like snowflakes.</p>
<p><img src="/images/eisenstein_primes_6_1.png" alt="screenshot" /></p>
<p><img src="/images/eisenstein_primes_16_3.png" alt="screenshot" /></p>
<p>I deployed it to <a href="https://rustytriangles.github.io/eisenstein_primes/">this github page</a> so you can play with it too.</p>If you’re anything like me, as soon as you saw the patterns I was talking about yesterday in the Gaussian primes, you wanted to know whether there were similar patterns in the Eisenstein primes. So I made this to find out.Gaussian Primes2020-09-29T14:24:44+00:002020-09-29T14:24:44+00:00https://rustytriangles.github.io//jekyll/update/2020/09/29/gaussian-primes<p>John D Cook recently had <a href="https://www.johndcook.com/blog/2020/09/24/gaussian_integer_walk/">a post</a>
on <a href="https://www.johndcook.com/blog/">his blog</a> about a <a href="https://mathoverflow.net/questions/91423/gaussian-prime-spirals">Stack Overflow thread</a>
about some interesting patterns in the Gaussian primes. I had gotten really interested in Gaussian
primes after reading <a href="http://illustratedtheoryofnumbers.com/">Martin Weissman’s wonderful book</a>, so
I knew I needed to make an interactive toy to play with the patterns. Since I’d just been doing
<a href="https://rustytriangles.github.io/jekyll/update/2020/09/22/tile_explorer.html">this project</a> in
SVG & React, I used those. The result is <a href="https://github.com/rustytriangles/gaussian_primes">here</a>. I also
deployed it to <a href="https://rustytriangles.github.io/gaussian_primes/">this github page</a> so you can play with it too.</p>
<p><img src="/images/gaussian_primes_screenshot.png" alt="Gaussian Primes" /></p>John D Cook recently had a post on his blog about a Stack Overflow thread about some interesting patterns in the Gaussian primes. I had gotten really interested in Gaussian primes after reading Martin Weissman’s wonderful book, so I knew I needed to make an interactive toy to play with the patterns. Since I’d just been doing this project in SVG & React, I used those. The result is here. I also deployed it to this github page so you can play with it too.Tile Explorer2020-09-22T16:26:00+00:002020-09-22T16:26:00+00:00https://rustytriangles.github.io//jekyll/update/2020/09/22/tile_explorer<p>About 8 years ago <a href="https://blog.garritys.org/2012/01/path-tile-games.html">I got interested</a> in games like
<a href="https://boardgamegeek.com/boardgame/16992/tsuro">Tsuro</a> & <a href="https://boardgamegeek.com/boardgame/9028/tongiaki-journey-unknown">Tongiaki</a>.
In particular, I was interested in the <a href="https://blog.garritys.org/2012/01/more-path-tiles.html">combinatorics of the tiles</a>.
How many unique tiles are there for each different shape of tile? The answer is related to sequence <a href="https://oeis.org/A132100">A132100</a> of the <a href="http://oeis.org">Online Encyclopedia of Integer Sequences</a>. While I was playing around with that, I spent
a lot of time drawing different tiles using a simple <a href="http://processing.org">Processing</a> sketch which I wrote. I posted that
<a href="https://blog.garritys.org/2012/01/tile-explorer.html">here</a>, but it has gotten kind of crufty and hard to keep running because
of Java-rot.</p>
<p><img src="/images/tile_explorer.png" alt="tile_explorer" /></p>
<p>So I decided to whip up a new version. This one uses React & SVG and makes a nice, simple standalone page
with no complicated plugins. You can find the source <a href="https://github.com/rustytriangles/tile_explorer">here</a>, or if you just
want to play with it, you can run it <a href="https://rustytriangles.github.io/tile_explorer/">here</a>.</p>About 8 years ago I got interested in games like Tsuro & Tongiaki. In particular, I was interested in the combinatorics of the tiles. How many unique tiles are there for each different shape of tile? The answer is related to sequence A132100 of the Online Encyclopedia of Integer Sequences. While I was playing around with that, I spent a lot of time drawing different tiles using a simple Processing sketch which I wrote. I posted that here, but it has gotten kind of crufty and hard to keep running because of Java-rot.Yet Another Teapot2020-09-04T14:15:00+00:002020-09-04T14:15:00+00:00https://rustytriangles.github.io//jekyll/update/2020/09/04/r3f_teapot<p>I’ve been spending some time with <a href="https://reactjs.org/">React</a> lately.
Naturally, that meant that I needed to do another teapot.
I found the <a href="https://github.com/react-spring/react-three-fiber">React Three Fiber project</a> which
provides a react renderer that makes it really easy to plug <a href="https://threejs.org/">three.js</a> content
into a React app. So I used that to make <a href="https://rustytriangles.github.io/r3f-teapot/">this github page</a>.
You can find the <a href="https://github.com/rustytriangles/r3f-teapot">source here</a>, but it could really use a cleanup pass.</p>I’ve been spending some time with React lately. Naturally, that meant that I needed to do another teapot. I found the React Three Fiber project which provides a react renderer that makes it really easy to plug three.js content into a React app. So I used that to make this github page. You can find the source here, but it could really use a cleanup pass.React, D3, & Github Pages2020-09-02T17:29:00+00:002020-09-02T17:29:00+00:00https://rustytriangles.github.io//jekyll/update/2020/09/02/react_d3_example<p>For something I’m working on, I needed to figure out how to create a <a href="https://reactjs.org/">React</a> app that uses <a href="https://d3js.org/">D3</a> and deploys to a github page.
I couldn’t find a good example that had all of those pieces together, so I did a bit of hacking and came up with <a href="https://github.com/rustytriangles/payems-chart">this</a>.
That creates a simple line chart using employment data from <a href="https://fred.stlouisfed.org/">FRED</a>. A simple <code class="language-plaintext highlighter-rouge">npm run deploy</code> will push it to <a href="https://rustytriangles.github.io/payems-chart/">this github page</a>.</p>For something I’m working on, I needed to figure out how to create a React app that uses D3 and deploys to a github page. I couldn’t find a good example that had all of those pieces together, so I did a bit of hacking and came up with this. That creates a simple line chart using employment data from FRED. A simple npm run deploy will push it to this github page.hexmirror2020-08-31T14:07:00+00:002020-08-31T14:07:00+00:00https://rustytriangles.github.io//jekyll/update/2020/08/31/hexmirror<p>Here’s a thing I made.</p>
<p><img src="/images/hexmirror.png" alt="hexmirror" /></p>
<p>It’s made of walnut, brass screws, mulberry paper, and a Raspberry Pi. It reacts to the environment, and it’s a lot of fun to play with.</p>
<iframe src="https://player.vimeo.com/video/447575759" width="640" height="360" frameborder="0" allow="autoplay; fullscreen" allowfullscreen=""></iframe>
<p><a href="https://vimeo.com/447575759">hexmirror</a> from <a href="https://vimeo.com/user2619389">Garrity Family</a> on <a href="https://vimeo.com">Vimeo</a>.</p>
<p>You can find the build details <a href="https://github.com/rustytriangles/hexmirror">here</a>.</p>
<p>The basic idea is that it samples the video stream from the camera at 36 locations and then sets the colors of the LEDs to match. It’s built using cheap WS2811 LEDs. Driving those from a raspi is a little tricky because they’re picky about timing.. This uses the <a href="https://github.com/jgarff/rpi_ws281x">rpi_ws281x</a> library to drive them with the PWM module.</p>Here’s a thing I made.