Update README.md

README.md

@@ -2,11 +2,12 @@
 
 [A 3D web-based complex function grapher](https://hemisemidemipresent.github.io/complex3/)
 
-![](https://media.discordapp.net/attachments/699781597515481159/932949769142288474/unknown.png?width=600&height=300)
+<img src="https://github.com/hemisemidemipresent/complex3/blob/main/imgs/Re-Im.png" height=600/>
+
 
 > example of a Re-Im plot
 
-![](https://media.discordapp.net/attachments/699781597515481159/932951742486818866/unknown.png?width=600&height=300)
+<img src="https://github.com/hemisemidemipresent/complex3/blob/main/imgs/Mod-Arg.png" height=600/>
 
 > example of a Mod-Arg plot
 
@@ -16,55 +17,42 @@ Uses a custom rust expression parser and evaluator (in `./rust`) compiled to was
 
 -   ### Expandable function input box
 
-    ![](https://media.discordapp.net/attachments/699781597515481159/932952744669618196/unknown.png?width=532&height=57)
-
-    ![](https://media.discordapp.net/attachments/699781597515481159/932953635560775680/unknown.png)
-
-    > for this to update you have to press the Load button
+    > for the function to update you have to press the Load button
 
 -   ### Different types of Plots
 
-    ![](https://media.discordapp.net/attachments/699781597515481159/932953830725922816/unknown.png)
+    <img src="https://github.com/hemisemidemipresent/complex3/blob/main/imgs/select_plot.png"/>
 
     > for this to update you have to press the Load button
 
 -   ### (Rough) control over how many vertices loaded
 
-    ![](https://media.discordapp.net/attachments/699781597515481159/932954030588690482/unknown.png)
-
     > for this to update you have to press the Load button
 
 -   ### Autorotate on/off
 
-    ![](https://media.discordapp.net/attachments/699781597515481159/932961738108850216/unknown.png)
-
 -   ### Glassy/Shiny surface on/off
 
-    ![](https://media.discordapp.net/attachments/699781597515481159/932962790711365642/unknown.png)
-
     When shine is on:
 
-    ![](https://media.discordapp.net/attachments/699781597515481159/932962092514967592/unknown.png?width=600&height=274)
+    <img src="https://github.com/hemisemidemipresent/complex3/blob/main/imgs/shine.png"/>
 
-    > Note: This might not accurately represent how real life translucent shiny surfaces work, and there may be issues on devices with less great GPUs
 
--   ### If you dont like B/W with Re-Im/Im-Re plots
+    > Note: This might not accurately represent how real life translucent shiny surfaces work, and there may be issues on devices with less great GPUs
 
-    ![](https://media.discordapp.net/attachments/699781597515481159/932971032665554944/unknown.png)
+-   ### Colored Re-Im/Im-Re plots
 
 -   ### Lower Left Buttons
 
-    ![](https://media.discordapp.net/attachments/699781597515481159/932963119192481822/unknown.png)
-
     the book icon hides/shows the topleft tab
 
-    the camera icon **exports the graph as a .png**
+    ~~the camera icon exports the graph as a .png~~
 
 ## Purpose
 
 I saw cool stuff like this graph from [this youtube video](https://www.youtube.com/watch?v=3qEJeP6qQGA):
 
-![](https://media.discordapp.net/attachments/699781597515481159/932950259175424020/unknown.png?width=600&height=317)
+<img src="https://github.com/hemisemidemipresent/complex3/blob/main/imgs/youtube.png"/>
 
 but there is no easy way to render such Mod-Arg plots. So the objective of this is to create an optimized way to graph 3D complex plots **on the web** (snappily).
 
@@ -73,14 +61,15 @@ but there is no easy way to render such Mod-Arg plots. So the objective of this
 -   [ ] cut off after certain height option
 -   [ ] Export to a `.stl` file 3D printing (probably defer [this](https://github.com/eligrey/FileSaver.js/) or smth)
 -   [ ] Opacity, Saturation, Value option
+-   [ ] Export to an image - ~~compromised performance by adding `preserveDrawingBuffer: true` to renderer~~ re-renders with `preserveDrawingBuffer: true`, exports image, and re-render with `preserveDrawingBuffer: false`
+
 
 ### Done
 
 -   [x] Logarithmic height option
 -   [x] Hide title option
 -   [x] Add an option for how many points u want in a mesh (aka how good is your device)
 -   [x] Mod-Arg, Im-Re plot
--   [x] Export to an image - ~~compromised performance by adding `preserveDrawingBuffer: true` to renderer~~ re-renders with `preserveDrawingBuffer: true`, exports image, and re-render with `preserveDrawingBuffer: false`
 -   [x] Optimize reloading
 -   [x] shiny/glassy surface option
 
@@ -94,32 +83,32 @@ For example for the given function $f(x+iy) = w+iv$
 -   a Im-Re plot, on the other hand takes the imaginary component of the output $v$ and uses that as the height of the surface at a given point. the real part $w$ is sigmoid-ed to B/W value
 -   a Mod-Arg plot takes the **modulus** as the height and the **argument**:
 
-![](https://media.discordapp.net/attachments/699781597515481159/932965860870586478/unknown.png)
+<img src="https://github.com/hemisemidemipresent/complex3/blob/main/imgs/mod_arg_explanation.png"/>
 
 ## examples
 
 note: for functions with asymptotes/large changes in gradient it is necessary to increase the "How good is your device" to a value higher, perhaps 10 but 25 is better
 
-![](https://media.discordapp.net/attachments/699781597515481159/932969004719562772/unknown.png?width=600&height=300)
+<img src="https://github.com/hemisemidemipresent/complex3/blob/main/imgs/tan_z.png"/>
 
 > $\tan(z)$ (`tan(z)`), Mod-Arg
 
-![](https://media.discordapp.net/attachments/699781597515481159/932970020332527616/unknown.png?width=600&height=300)
+<img src="https://github.com/hemisemidemipresent/complex3/blob/main/imgs/gamma_z.png"/>
 
 > $\Gamma(z)$ (`gamma(z)`), Mod-Arg
 
-![](https://media.discordapp.net/attachments/699781597515481159/932970810426163231/unknown.png?width=600&height=300)
+<img src="https://github.com/hemisemidemipresent/complex3/blob/main/imgs/sec_z.png"/>
 
 > $\sec(z)$ (`sec(z)`), Re-Im, colored
 
-![](https://media.discordapp.net/attachments/699781597515481159/932972496720904252/unknown.png?width=600&height=300)
+<img src="https://github.com/hemisemidemipresent/complex3/blob/main/imgs/sinh_z.png"/>
 
 > $\sinh(z)$ (`sinh(z)`), Mod-Arg
 
-![](https://media.discordapp.net/attachments/699781597515481159/932975183021637662/unknown.png?width=600&height=300)
+<img src="https://github.com/hemisemidemipresent/complex3/blob/main/imgs/asinh_z.png"/>
 
 > $4sin^{-1}\frac{z}{4}$ (`4asin(z/4)`), Re-Im
 
-![](https://media.discordapp.net/attachments/699781597515481159/932975915703627796/unknown.png?width=600&height=300)
+<img src="https://github.com/hemisemidemipresent/complex3/blob/main/imgs/fn_1.png"/>
 
 > `1/(1+(z/5)^2)`, Re-Im, colored, you can see the 2 asymptotes at z=±i that causes the radius of convergence to be 1