Last year I wrote a quick page about filling a circle on a grid[1]. As this one of the fastest pages I've implemented, I wanted to write down what I did.
- Org mode
- Vue
- Scope - cut circle outline section
- Input / output of diagram
- Add more diagrams
- YAGNI for abstractions; wait until I actually need it
- Willing to copy/paste, discover the pattern
- Polish, including draggable marker instead of slider
Sometimes I want to find find all grid locations in a circular area. For example, if a player is standing in a field and we want to know every tile the player can toss a ball to, we'll want to find all locations within a certain distance: #+begin_export html <figure> <svg viewBox="-0.55 -0.55 20.2 10.2"> <a-tiles v-bind:filled="in_circle(radius)" v-bind:cols="20" v-bind:rows="10"/> <a-circle v-bind:center="center" v-bind:radius="radius"/> <a-radius v-bind:center="center" v-bind:radius="radius"/> <a-center v-bind:center="center" v-bind:snap-to-grid="true"/> </svg> <figcaption>Circular fill to radius {{radius.toFixed(2)}}</figcaption> </figure> #+end_export How can we implement this?