[HN Gopher] Graphtoy
       ___________________________________________________________________
        
       Graphtoy
        
       Author : based2
       Score  : 221 points
       Date   : 2021-01-02 11:42 UTC (2 days ago)
        
 (HTM) web link (graphtoy.com)
 (TXT) w3m dump (graphtoy.com)
        
       | adriancooney wrote:
       | I absolutely adore this space. Adding the time dimension to
       | graphing tools is crazy powerful. I've done something similar a
       | while back that allows you to produce sound (shameless plug):
       | https://noise.sh (and previous discussion:
       | https://news.ycombinator.com/item?id=24441518)
        
       | jhncls wrote:
       | See also https://news.ycombinator.com/item?id=25574661 of a few
       | days ago.
        
       | mikewarot wrote:
       | It seems broken on Chrome Version 87.0.4280.88 (Official Build)
       | (64-bit)
        
         | amelius wrote:
         | Examples work but function-buttons seem broken on Firefox 84.0
         | (Linux, 64bit)
        
       | ellis0n wrote:
       | Happy New Year!
       | 
       | Amazing beautiful formulas, I'm surprised!
       | 
       | Thanks to Inigo and Rafael for a new cool tool!
       | 
       | PS: why do designers prefer gray colors UI, but there is no
       | alternative?
        
       | lligallo wrote:
       | Checkout this video by the author. It makes a full 3d complex
       | scene out of a math formula, with step by step explanation
       | https://youtu.be/8--5LwHRhjk
        
         | tconley wrote:
         | maybe i should have paid more attention in math class
        
           | Edmond wrote:
           | not quite the same but if you're into math as art, try
           | desmos:
           | 
           | https://www.desmos.com/calculator/ccoiiocfbw
        
             | rantwasp wrote:
             | this will blow your mind:
             | 
             | https://reddit.com/r/desmos/comments/gccqty/a_b%C3%A9zier_n
             | i...
             | 
             | source: https://www.desmos.com/calculator/nhyta2fb68
        
         | AceJohnny2 wrote:
         | Oh, it's Inigo Quilez
         | 
         | He's known as "iq" in Shader circles and is basically a god.
         | He's also the (co?)creator of Shadertoy.com
        
         | dmix wrote:
         | Watching this reminds me of trying to use the 'golden ratio'
         | and other mathy formulas in CSS typography and column grids to
         | get "perfect" alignments from scratch. For ex from film:
         | arranging the body to the min(d1, d2) alignment to the head
         | sphere.
         | 
         | But obviously this is on a whole other level of knowledge and
         | complexity.
        
         | devmunchies wrote:
         | He links to shadertoy[1] with the code. it looks like the code
         | is in C? how is it rendering in the browser?
         | 
         | [1]: https://www.shadertoy.com/view/WsSBzh
        
           | Netcob wrote:
           | You write GLSL, which is a shader language. Specifically, in
           | this case, you write code that determines the color of a
           | pixel given its coordinates (and some other input variables).
           | 
           | On Shadertoy, they use WebGL to create a little rendering
           | pipeline that in the simplest configuration renders two
           | triangles to form a rectangle, using your GLSL code. Since
           | it's WebGL (should be supported by all modern browsers,
           | mobile included), that code is executed directly on your GPU.
           | 
           | In more complex Shadertoy scenarios, you can do multiple
           | passes where you render to different buffers and then use
           | those buffers as textures in other passes. One of the uses of
           | that is keeping state between frames, which would not be
           | possible in a purely shader-based system otherwise. For
           | example, if you have some sort of player character you move
           | around the world, you may use one pixel to store the
           | position, another to store the rotation and so on. Or you can
           | use the image output from the previous frame as the input for
           | the next frame to compute IIR functions, simulate cellular
           | automatons and so on. I think by now you can even render to
           | cube maps and multiple viewports (for VR).
           | 
           | There's even a "sound" shader you can write that is called
           | once and then renders a waveform for one minute and then
           | plays that back while displaying the regular shader.
        
           | detaro wrote:
           | It's not C, it's GLSL shader language, which is used in the
           | browser through WebGL.
        
             | coldtea wrote:
             | > _it looks like the code is in C? how is it rendering in
             | the browser?_
             | 
             | Plus, C could be compiled into WASM with emscripten, and be
             | hooked to render on a Canvas or WebGL or something.
        
       | MichaelMoser123 wrote:
       | thanks! fun to multiply every function by sin(t), makes it come
       | alive.
        
       | timvisee wrote:
       | Man this is fun! Dusted off my graphical calculator to give this
       | formula a try.
       | 
       | https://www.youtube.com/watch?v=97T-Zw5Nyf0
       | 
       | Its interesting to see how fast the browser is versus this
       | calculator. Sorry for the unprofessional video.
        
       | [deleted]
        
       | Buttons840 wrote:
       | Anyone know of graphing software on the computer that can graph
       | arbitrary inequalities and logical expressions like the HP
       | Prime's advanced graphing can? [0] For example, if you say x^2 =
       | y it will draw a sideways parabola, top and bottom (yes, it's not
       | a function). Or if you say 10 = x^2 + y^2 it will draw a circle
       | without any gaps. Or if you say                   sin((1+sin(x+y)
       | )*asin(.5*(sin(x)+sin(y)))+(1+sin(x-y))*asin(.5*(cos(x)+cos(y))))
       | =0
       | 
       | it draws something like a chain link fence. [1] It works well on
       | a battery operated calculator, so a desktop computer should have
       | no trouble with it, but does the software exist?
       | 
       | [0]: https://www.youtube.com/watch?v=GAVqjBxFyXA [1]:
       | https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2F...
        
         | maxwelljoslyn wrote:
         | On HN a few days ago, I saw a Windows program which seemed like
         | it would do as you describe (and much more.)
         | 
         | But - curses - I didn't bookmark it, at least not in the normal
         | place. I'll look a little harder for you. If I don't
         | update/follow up on this comment, assume I didn't find it. :(
         | 
         | EDIT: Aha. It's called "EvalDraw." Cheers to user 'TeMPOral for
         | sharing.
         | 
         | https://news.ycombinator.com/item?id=25575775
        
           | TeMPOraL wrote:
           | Yup, I usually used EvalDraw in (x,y) mode to graph
           | inequalities. You have to remember though that equations like
           | x=y or x-y = 0 represent a line - an infinitely thin object -
           | so EvalDraw will likely not draw you anything given such
           | input. You have to translate your equation into something
           | that has thickness. E.g. an f(x) = 0 into abs(f(x)) < 0.01
           | 
           | For instance, GP's example: (x,y) abs(sin((1+sin(x+y))
           | _asin(.5_ (sin(x)+sin(y)))+(1+sin(x-y)) _asin(.5_
           | (cos(x)+cos(y)))))<0.01
           | 
           | Draws a beautiful red chain-link fence on blue background.
           | 
           | If you can rewrite your formula to give you a value between 0
           | and 1, you'll get a nice color gradient. And then you can
           | have more direct control over colors using some of the things
           | I described in the linked comment.
        
         | mojomark wrote:
         | Have you tried the Wolfram Alpha app? I didn't try all of the
         | examples you posted, but graphing a circle works fine.
         | 
         | I use this app all the time to help me simplify expressions
         | (I'm an engineer - I use math, I love math, but I am no
         | mathematician, so I seek shortcuts where I can to save time).
         | 
         | 1.) Compute '10 = x^2 + y^2' with the Wolfram|Alpha website
         | (https://www.wolframalpha.com/input/?i=10+%3D+x%5E2+%2B+y%5E2)
         | or mobile app (wolframalpha:///?i=10+%3D+x%5E2+%2B+y%5E2).
        
           | Buttons840 wrote:
           | I was hoping to be able to utilize the incredible calculator
           | I possess, but it's a good suggestion even if it's not what
           | I'm hoping for.
        
         | bbkane wrote:
         | Maybe Sage? See http://utmost-sage-cell.org/sage:implicit-
         | functions-plot
        
         | interpol_p wrote:
         | If you have a mac the built in Grapher.app (in
         | Applications/Utilities) can graph those things. I pasted your
         | chain-link-fence example and it graphs fine
        
         | ttoinou wrote:
         | MathStudio on iOS is really good for that purpose
         | http://mathstud.io/apps/
         | 
         | I thought it was called SpaceTime before, not sure
        
         | Foobar8568 wrote:
         | HP Prime and some other calculators (at least one TI) is based
         | on GIAC XCas so here you go https://www-fourier.ujf-
         | grenoble.fr/~parisse/giac.html
        
         | lifthrasiir wrote:
         | GrafEq [1] from Pedagoguery Software is one of best-known
         | softwares that can handle a variety of implicit 2D plots (it's
         | a shareware, though). The algorithm for its earlier version is
         | based on generalized interval arithmetics and described in the
         | author's thesis [2]. I like it so much that reimplementing it
         | is one of my (ever-growing) longer-term projects...
         | 
         | [1] http://www.peda.com/grafeq/
         | 
         | [2] http://www.dgp.toronto.edu/~mooncake/thesis.pdf
        
         | dllu wrote:
         | I made an implicit plotter here:
         | https://daniel.lawrence.lu/blog/y2016m02d08/
         | 
         | Your function works fine here and my blog post contains many
         | examples of other cool functions to plot, including the
         | pathological                   exp(sin(x) + cos(y)) -
         | sin(exp(x+y)) = 0
         | 
         | My plotter is very slow, however; it uses random sampling
         | instead of any sort of clever interval arithmetic.
        
         | mkl wrote:
         | Desmos and GeoGebra can both do this (though GeoGebra has
         | little gaps in this particular example, and you'll need arcsin
         | rather than asin for both tools). If you want programming-
         | oriented, Sympy can do an okay job (asin), as can Numpy
         | (arcsin), but the latter involves more mucking about,
         | evaluating on a grid.
        
       ___________________________________________________________________
       (page generated 2021-01-04 23:03 UTC)