# Turtle Graphics

**URL:** <https://discourse.processing.org/t/turtle-graphics/45672>\
**Category:** p5.js\
**Created:** [January 27, 2025, 5:23pm UTC](https://discourse.processing.org/t/turtle-graphics/45672 "2025-01-27T17:23:31Z")\
**Posts on this page:** 15\
**Page:** 2

<div class="post-metadata">

**Author:** ![svan](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@svan](https://discourse.processing.org/u/svan)\
**Post date:** [January 29, 2025, 2:41am UTC](https://discourse.processing.org/t/turtle-graphics/45672/21 "2025-01-29T02:41:07Z")

</div>

Nice addition. _noLoop()_ should save it from being overdrawn which was the main reason I was using recursion. A simple loop is less code and appears to work just as well. Thanks for telling us.

---

<div class="post-metadata">

**Author:** ![quark](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/quark/32/26_2.png) [@quark](https://discourse.processing.org/u/quark)\
**Post date:** [January 29, 2025, 2:29pm UTC](https://discourse.processing.org/t/turtle-graphics/45672/22 "2025-01-29T14:29:02Z")

</div>

TG has two tasks called `circle` and `oval` that can be used to draw polygons. This sketch shows TG creating six polygons with 3-8 sides.

https://editor.p5js.org/quark-js/full/o-uPOhidk

You can see the code [here](https://editor.p5js.org/quark-js/sketches/o-uPOhidk)

To see my collection of TG examples click [here](https://editor.p5js.org/quark-js/collections/oE91nQe3H)

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [January 29, 2025, 2:47pm UTC](https://discourse.processing.org/t/turtle-graphics/45672/23 "2025-01-29T14:47:02Z")

</div>

Shouldn’t this turtle library be in the “Gallery” category instead like others before? 🥴

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [January 29, 2025, 2:48pm UTC](https://discourse.processing.org/t/turtle-graphics/45672/24 "2025-01-29T14:48:18Z")

</div>

> [@quark](#):
>
> This is too much processing so what I do is store the results of every _completed_ task on an offscreen buffer then on each frame copy this to the main display.

Nice work on this project!

I did something similar here in my effort to draw a Fractal tree one line at a time:

> [@Stepping Through a Fractal Tree](https://discourse.processing.org/t/stepping-through-a-fractal-tree/45272):
>
> Stepping through a fractal tree using a thread. A PGraphic is updated in a thread one line at a time and displayed in draw(). // Stepping through a Fractal Tree // A PGraphic is updated in a thread one line at a time and displayed in draw() // // Author: GLV // Date: 2024-09-29 // Code from references below were used and adapted. // Code references: // https://www.geeksforgeeks.org/y-fractal-tree-in-python-using-turtle/ // Turtle Graphics in Processing // Natalie Freed, February 2013 // h…

`:)`

---

<div class="post-metadata">

**Author:** ![quark](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/quark/32/26_2.png) [@quark](https://discourse.processing.org/u/quark)\
**Post date:** [January 29, 2025, 3:10pm UTC](https://discourse.processing.org/t/turtle-graphics/45672/25 "2025-01-29T15:10:23Z")

</div>

@glv I saw your fractal tree example and gave it a ❤ at the time. It was your post that gave me the idea of trying my hand at creating a turtle graphics library.

The original turtle graphics was created in the late 1960s and included into the Logo programming language. It was designed to control an actual robot that held a pen. I wanted something that showed the turtle’s path as it moved.

---

<div class="post-metadata">

**Author:** ![svan](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@svan](https://discourse.processing.org/u/svan)\
**Post date:** [January 29, 2025, 4:21pm UTC](https://discourse.processing.org/t/turtle-graphics/45672/26 "2025-01-29T16:21:08Z")

</div>

I first learned about Turtle Graphics when @winterchan inquired about the Harriss spiral:[Generate the Harriss Fractal](https://discourse.processing.org/t/generate-the-harriss-fractal/44990) in this forum. When I researched it TurtleGraphics was one of the ways it was first drawn and I was impressed at how something so complicated could be drawn by something so simple. That technique inspired the work that I have posted here and has been ported to other languages: [https://rosettacode.org/wiki/Harriss\_Spiral](https://rosettacode.org/wiki/Harriss_Spiral) , which brings me to my next question: Would you be able to draw a Harriss Fractal with your new creation?

---

<div class="post-metadata">

**Author:** ![quark](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/quark/32/26_2.png) [@quark](https://discourse.processing.org/u/quark)\
**Post date:** [January 29, 2025, 4:53pm UTC](https://discourse.processing.org/t/turtle-graphics/45672/27 "2025-01-29T16:53:40Z")

</div>

> [@svan](#):
>
> Would you be able to draw a Harriss Fractal with your new creation?

To be honest I am not certain.

I did see the discussion about the Harriss spiral . The example in the first link (gif image) and the code examples in the second link all create and display the spiral as a single step. The animation in the gif is due to changing the initial starting values and the depth of recursion.

Using TG would require the spiral gradually ‘grow’ from nothing which is a much more challenging problem.

I will have to give it more thought 🤔

---

<div class="post-metadata">

**Author:** ![quark](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/quark/32/26_2.png) [@quark](https://discourse.processing.org/u/quark)\
**Post date:** [January 29, 2025, 6:08pm UTC](https://discourse.processing.org/t/turtle-graphics/45672/29 "2025-01-29T18:08:57Z")

</div>

The code sample is incomplete - I found this at [https://wiki.secretgeek.net/harriss-spiral](https://wiki.secretgeek.net/harriss-spiral)

 ![Screenshot 2025-01-29 at 18.06.33](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/3X/5/d/5d5e980145381955e56a0c279c5b88705411493c.png)

---

<div class="post-metadata">

**Author:** ![svan](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@svan](https://discourse.processing.org/u/svan)\
**Post date:** [January 29, 2025, 10:40pm UTC](https://discourse.processing.org/t/turtle-graphics/45672/31 "2025-01-29T22:40:59Z")

</div>

I’d be interested to know if you can find a non web based, stand-alone editor that will run this code. In my experience it usually has to be modified a little to run in more recent editors. The website has a ‘run’ button, but it has a few problems at the ‘slow’ speed (‘faster’ speeds look ok). Nonetheless if you have a few minutes to watch the turtle draw in slow motion it gives insight into the technique used. The turtle advances in a straight line in successively shorter distances after heading changes and ninety degree arcs are drawn in reverse, ie endPt to startPt for that segment.

**Output for reference slow speed:**

 ![slo](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/3X/c/d/cd0537d78d54ded7494c593b910b5f6a1b9639e8.jpeg)

---

<div class="post-metadata">

**Author:** ![quark](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/quark/32/26_2.png) [@quark](https://discourse.processing.org/u/quark)\
**Post date:** [January 30, 2025, 9:45am UTC](https://discourse.processing.org/t/turtle-graphics/45672/32 "2025-01-30T09:45:08Z")

</div>

I have moved this discussion because it doesn’t really fit any single p5js category. Unfortunately the category descriptions are simple one liners that don’t give real guidance.

I started this topic to give users a chance to play with the library and highlight any issues or enhancements or ideas that might improve the library or its documentation. I am happy with the way the discussion is going because the feedback shows how users might want to use the library, I am already thinking about adding a `spiral` task 🤔

The examples I have provided are not really gallery items, I created them to test different features of the library and I included them to encourage users to try it out so I could get feedback.

Testing has not revealed any bugs so far but I am still working on the github documentation. When it is complete I will make a formal release announcement in the library topic and submit it to Processing to be accepted as a contributed library.

As for the Harriss spiral, I will have a go at recreating it using this library and if I succeed then it will be posted as a gallery item.

Thanks for all your posts and keep them coming. 👍😁

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [January 30, 2025, 3:22pm UTC](https://discourse.processing.org/t/turtle-graphics/45672/33 "2025-01-30T15:22:31Z")

</div>

> [@glv](#):
>
> My opinion on this is keep the development of this project here in this topic and post the final (never really final…) project in the gallery.

> [@quark](#):
>
> I have moved this discussion because it doesn’t really fit any single p5js category.

There’s also sub-category “Development” for asking about howtos & tips to develop 3rd-party libraries and addons for Processing.

---

<div class="post-metadata">

**Author:** ![quark](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/quark/32/26_2.png) [@quark](https://discourse.processing.org/u/quark)\
**Post date:** [January 30, 2025, 4:15pm UTC](https://discourse.processing.org/t/turtle-graphics/45672/34 "2025-01-30T16:15:28Z")

</div>

Here are the three categories and their descriptions

**p5.js**

- Discussions about p5.js programs and development

**p5.js \>\> Development**

- How to develop p5.js and p5.js Libraries

**p5.js \>\> libraries**

- Questions and discussions about p5.js Libraries

It seems to me that there is justification to have this discussion in any of these categories \>\> sub-categories. It all depends on what is meant by “p5.js Libraries” (notice the capital L). The description for the development sub category makes me think that it relates only those [libraries approved by p5js](https://p5js.org/libraries/) for inclusion on the website.

Turtle Graphics is already a library, the only thing lacking is in the area of documentation and examples so hasn’t yet been submitted to p5.js

It seems to me that the current category, p5.js is just fine for this discussion and that we have moved seriously off-topic so can we drop this please.

For those reading this discussion I am hoping you might try out Turtle Graphics and let me know how you got on with it…

Thanks in advance for any comments, ideas … related turtle graphics in general and this library in particular.

---

<div class="post-metadata">

**Author:** ![svan](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@svan](https://discourse.processing.org/u/svan)\
**Post date:** [January 30, 2025, 9:31pm UTC](https://discourse.processing.org/t/turtle-graphics/45672/35 "2025-01-30T21:31:02Z")

</div>

Any way to make that UserGuide a .pdf?

Does the library have ‘arc’; I couldn’t find it.

---

<div class="post-metadata">

**Author:** ![quark](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/quark/32/26_2.png) [@quark](https://discourse.processing.org/u/quark)\
**Post date:** [January 31, 2025, 9:11am UTC](https://discourse.processing.org/t/turtle-graphics/45672/36 "2025-01-31T09:11:08Z")

</div>

> [@svan](#):
>
> Does the library have ‘arc’; I couldn’t find it.

An arc is simply a part of the circumference of a circle or ellipse. The `circle(...)` and `oval('...')` both have a parameter called `extent` which specifies the length of arc in degrees.

> [@svan](#):
>
> Any way to make that UserGuide a .pdf?

A very good question - there are tools out there to convert html to pdf I will investigate when I get a chance.

---

<div class="post-metadata">

**Author:** ![quark](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/quark/32/26_2.png) [@quark](https://discourse.processing.org/u/quark)\
**Post date:** [February 2, 2025, 8:40pm UTC](https://discourse.processing.org/t/turtle-graphics/45672/37 "2025-02-02T20:40:58Z")

</div>

> [@svan](#):
>
> Any way to make that UserGuide a .pdf?

There are many tools to convert the html to pdf but the best ones and not free. The best free option is html2pdf but for such a large web page the pdf created was huge (65Mb) and the text size was massive for the page.

> [@svan](#):
>
> Would you be able to draw a Harriss Fractal with your new creation?

I had to add a small additional feature to the library to make it possible - but now I have solved it 😀

You can see it [here](https://discourse.processing.org/t/harriss-spiral-with-turtle-graphics/45699)

[Previous page](https://discourse.processing.org/t/turtle-graphics/45672.md?page=1)