Teaching Geometry With Javascript

When I started my now ten-year journey down the “let’s teach computer science in our public schools” path, I knew that getting students to instruct machines would open up new methods of teaching and learning. But I did not understand just how powerful that would be.

It is good and necessary to offer dedicated classes in computer science to students. It is even better to use computer science to teach complex concepts in subjects like math, science, art, music, literature and more. When you do both, you can really impact student’s learning and comprehension.

I was in a high school class in the Tremont neighborhood of the Bronx yesterday. They were doing geometry lessons in Javascript.

They started with a lesson on the translation function and how it could be used to move objects around. This is a photo I took of the smartboard at the front of the classroom as the students discussed how this function works.

After this lesson, the students played a game of Battleship in Javascript with each other on their laptops.

This is a photo of the Bronx Borough President, Ruben Diaz Jr, playing Javascript Battleship with one of the students in the class.

Writing and editing code on a machine allows the student to see how geometric functions (and many other functions) work in a fun and interactive way and takes complex notions and makes them real and tangible to them. This is important and powerful.

I now believe that introducing computer science into the elementary, middle, and high school curriculum will not only help students master computational thinking but it will also help them master many other complex concepts and allow them to be better students and better adults.

#hacking education

Comments (Archived):

  1. awaldstein

    Every time you post on this Fred, I want to say Good on you! as it is just goodness and makes me think of my father.He got out of poverty learning math and science then spent his life teaching it to inner city kids.Good stuff!

  2. Mike Zamansky

    Geometry, computing, and education go way back to Logo. If you haven’t and get the chance, check out “Turtle Geometry” by Abelson.

    1. karen_e

      Happy Teacher Appreciation Week, Mike.

      1. Mike Zamansky


  3. Pointsandfigures

    Headed to NYC today. Who wants to have lunch?

  4. KB

    Well done! I love the CS4All mission. I’m curious as to how the students are responding en masse.

  5. Jeff Judge

    I love this so much.

  6. Gregg Betheil

    Great to see CS4All moving beyond narrow coding classes to applications in other disciplines and classrooms. Creating opportunities for “contextual learning” in the academic disciplines (http://www.cord.org/cord_ct… can benefit a great many students. I used to joke that having students go to a “computer lab” in the 1990’s to word process was as silly as creating a “pencil lab” in the 1970’s. The best learning has always happened when tools (including coding) are applied to real problems and authentic work that brings the academic disciplines to life.

    1. sigmaalgebra

      For a long time and to an astounding extent, the main use of computers was word processing. Sorry ’bout that, but it was just true. E.g., even if were trying some ambitious attack on the Navier-Stokes equations and had a $10 million computer for this super advanced work, still had to do the word processing for the code and, before the code, a proposal on the project and, after the code, reports on the project. And in the project, had to compile and link the code and that, while not usual word processing, was essentially just character manipulation and not really scientific computing.In blunt terms, early on, the main thing Microsoft did was kill off the typewriters.A watershed moment for me was D. Knuth’s word whacking software TeX for typing mathematics. Before TeX, for the original research I did in math, always the word processing was more work than the math.Now, of course, we are so advanced that we are past using computers heavily for word processing, right??? I mean, uh, Disqus? Or typing in some JavaScript to draw on a screen? Or typing in messages at Facebook? Or using e-mail? Or searching for some Web content via key words? And that content we searched for, did that have anything to do with word processing? Hmm ….

  7. jason wright

    I wish they could be playing a more inspiring and constructive game as they learn.

    1. Dan T

      it’s like a much simpler version of chess – attack and defend – great for critical thinking.

  8. Vasudev Ram

    Good stuff.As Mike Zamansky comments, related / similar stuff has existed for many years, via Logo (a programming language) and turtle graphics, which is available in many languages, although Logo may have been one of the first to implement it.Some relevant links:Turtle graphics: https://en.wikipedia.org/wi…Logo programming language:https://en.wikipedia.org/wi…Excerpt:Logo was created in 1967 at Bolt, Beranek and Newman (BBN), a Cambridge, Massachusetts research firm, by Wally Feurzeig, Cynthia Solomon, and Seymour Papert.[5] Its intellectual roots are in artificial intelligence, mathematical logic and developmental psychology.The ones below are from my blog.Python, meet Turtle:https://jugad2.blogspot.com…Simple drawing program with Python turtle graphics:https://jugad2.blogspot.com…Square spiral – drawing with 3D effect (turtle graphics):https://jugad2.blogspot.com

  9. Vasudev Ram

    Fred (?) (top right corner of photo, almost sure) making an appearance in his own photos, like Alfred Hitchcock ‘s brief appearances in his own movies 🙂

  10. sigmaalgebra

    Doing that, could learn some basic computer usage and a start on JavaScript, but looks like won’t learn much geometry.Geometry has been important back to Euclid, and the main point is proving theorems. In that, yes, we draw a figure, but all the way back to Euclid that was not the main work. The main work was the proof, and the proof can be done well enough with just ordinary typing.Likely the most important proof is of the Pythagorean theorem. There are many elementary proofs, some quite clever, and, of course, the generalizations are beyond belief.I like drawing figures and do so occasionally, fewer than six times a year. For figure drawing, I use an old copy of Microsoft’s PhotoDraw. Works fine. The last usage was for doing a scale model of my office layout. Before that, I got a block diagram of the more important components of the server farm for my startup — a block diagram.Little drawing programs can be nice: There’s PhotoDraw and before that CorelDraw. There has been the Google program SketchUp. And there have long been some really high end systems for designing airplanes, power plants, etc. All of those need more than will be easy to program in JavaScript. It might be nice to have an API, maybe for JavaScript, Python, Rexx, whatever, for drawing — but using computers for drawing, especially engineering drawing, including for the engineering, finite element modeling, stiffness, stress, strain, broadly CAD (computer aided design), CNC (computer numerical control), etc. have been big fields for a long time.For an ellipse, that was not really in Euclidean geometry but in analytic geometry, especially of conic sections. So, the points were, say:(1) Given two points, say, A and B, and a distance d, an ellipse is the set of all points X such that d is the distance from X to A plus the distance from X to B. Points A and B are the foci of the ellipse.(2) If have a cone and cut it with a plane, then the cut part can be a circle or, with some tilt an ellipse.(3) If are in a building where the walls form an ellipse and are at point A and speak, then all the sound will also reach B and all at the same time. Similarly for some applications in optics.(4) As Kepler discovered, the orbits of the planets are ellipses.(5) From Newton, his law of gravity, second law of motion, and calculus showed that the orbits of the planets have to be ellipses.(6) We can be algebraic: Given non-zero numbers a and b, the set of all points (x,y) such that(x/a)^2 + (y/b)^2 = 1forms an ellipse. There are other ways to write the equation of an ellipse. centered anywhere on the plane, tilted, etc.(7) A central result now for a lot in applied statistics is the polar decomposition in matrix theory: Every square matrix is the product of a unitary matrix and a Hermitian matrtix. The unitary matrix does only a rigid motion, that is, preserves distances — the quantum mechanics people get excited about that. The Hermitian matrix takes a multi-dimensional sphere and converts it to a multi-dimensional ellipse. In numerical methods in matrix theory, the important condition number of a matrix is the ratio of the longest and shortest axes of the ellipse. We’ve now touched on the basics of principle components and factor analysis, important in data compression, psychology, and more. E.g., at least early on, IQ was essentially just the longest axis of a certain ellipse.And there is a lot more about ellipses. E.g., once I saw the Courant-Fisher min-max theorem! Cute result.With some JavaScript to draw on a screen, are we teaching computer science, engineering drawing, plane geometry, analytic geometry, matrix theory, multi-variate linear statistics, motions of the planets, optics, or none of the above?

    1. Vasudev Ram

      Conic sections are cool. Did a lot of elementary computer graphics programming – a lot of it involving programmatically drawing the curves that represent various linear, trigonometry (sine / cosine) and other equations – on home computers, early in my software learning career, for fun and learning. Circles, ellipses, parabolas, hyperbolas, etc. In BASIC at first (first language I had access to), then in Pascal and C too. Thought of graphing conic sections because I was learning about them in high school math at the time.While reading about conic sections, came across interesting real-life phenomena involving them, some of which you mention. Others are:- a ball or stone thrown into the air, describes a parabola- the shadow of a lamp on a wall describes a hyperbola [1][1] https://www.google.com/sear

  11. Stuart Willson

    Relatedly, everyone at Radicle learns Python. With respect to manipulating data, it is the Excel of the future.

    1. sigmaalgebra

      I hope it’s a LOT better than Excel!!!So, with Excel are programming with memory locations with addresses (A-Z,1-1000) or some such, that is, FIXED, that is, not relocatable memory addressing. Really big back to 1940s computing BUMMER. Only an accountant could think that was a good way to program — already give up one of the first things offered by assembly language programming.Next, Excel is SLOW. Next, Excel is fat, worse than Jabba the Hut — end up with a 5 million byte monster for something can do in a few lines of Rexx, Fortran, C, C#, VB.NET, …, and likely Python.I understand that Python has some good packages. Okay. If it has something I need, maybe for some screen scraping, I’ll use it. So far, I’m not at all short on programming languages to pick from.Here I suspect is one place to beat Python and use the WatCom Fortran instead: There is an OBJ file for the IBM OSL, Optimization Subroutine Library, nicely linkable and callable from that WatCom Fortran. Once I had a 0-1 integer linear programming problem (right, NP complete) with 40,000 constraints and 600,000 variables. I saw a use of non-linear duality and in 500 primal-dual iterations found a feasible solution within 0.025% of optimality. The OSL did the dual part. At each of the 500 iterations, the OSL saw a slightly different problem, sooooooo, I needed the API and not just a program. Somehow I doubt I could call the OSL from Python. The OSL is one of the better tools in my toolbox.People have been pushing their favorite tools on me for many years: I feel like I’m a really good chef in a kitchen, doing really good cooking, but somehow I get pressured to set aside my favorite knives, knife sharpeners, cutting boards, mixing bowls, wire whips, saute pans, sauce pots, spice grinders, nut choppers, cabbage shredders, etc. So, it’s APL, Prolog, Java, various cases of OOPS, and now JavaScript, Python, R, GO, Haskell, etc.Anyone betting so much on just some one tool is short on work variety and experience and, instead, going with a fad.Gads, that Excel could ever have been considered as a powerful tool.Being pushed HARD into just 1-3 specific tools as the main consideration means that someone else with not very good qualifications is meeting with the paying customers, identifying the actual problems to be solved, and handing those off to staff with those 1-3 favorite tools for the actual work. That situation puts a tight lid on opportunity for anything good.There are lots of ways to work hard but be too far from the actual customers, problem, and money to have the work pay very well.For my startup, I’m the sole, solo founder and 100% owner so have no BOD disputes, no co-founder disputes, get to concentrate on the customers and their needs and then the means of meeting those needs. I’ll use Python, C++, R, Haskell, etc. if they help for the work — so far I see no way they would.

  12. Pointsandfigures

    I wish something like this would have been around when I went to school. I used to go to computer labs in my colleges and it was either quiet and people were busy or no one was around. I know Fred grew up in the computer room at West Point and he was lucky that people were around to help him. Glad things like this happen. Check out the ways to learn how to program on Brilliant.org. They have all sorts of modules

  13. Mike

    I really like the phrase “instructing machines”. Gets to the core of what software really does in so much of modern life.Every student will benefit from the exposure but also looks like a great way for a smaller percentage of students to identify a potential aptitude and calling to write code. I use the word calling because I think this is what is needed to put in the many, many hours needed to develop proficiency.I have a technical background but I don’t write code. One day I decided I would try coding a small App on my own to test out a concept, as opposed to just hiring a developer. It was a painful experience.

  14. Adam Parish

    What captured the imagination of people using scripting languages was instant feedback. No need to compile code and resolve dependencies. Type it, view it and iterate. Back in the 90s I quickly progressed from HTML to ASP. Good stuff!

  15. Saber Khan

    Hey folks, the JavaScript mentioned in the article is p5.js – http://p5js.org, which is a project from Processing Foundation – https://processingfoundatio…. The editor in the picture is accessible web editor for p5 or any JS library – http://editor.p5js.org. We have been partnering with the NYC DOE CSforAll to bring creating coding via p5 for the past few year. You can see the curriculum we have partnered on here – https://nycdoe-cs4all.githu

  16. Matt Zagaja

    My favorite language by far is Ruby but Javascript is definitely the most pervasive language. The unfortunate result is the highly variable quality of documentation. That being said yesterday I learned you can write Javascript functions you can call against values in a Google Spreadsheet and that’s some pretty cool shit.

  17. Vasudev Ram

    Python is a good entry point too. And very popular and getting more so.Plug for my Python course (with testimonials):https://jugad2.blogspot.com

  18. Vasudev Ram

    Right, both Python and JS-related areas you mentioned pay well.Yes, my course works well. But I have only one standardized Python course offering as of now, although I do offer and have done one-off customized versions in the past. Working on broadening my standardized offerings to cater to more market segments up/down/across the chain.I think your beginner to beginner approach is good and can work too. Good luck.