Matsemann / impossible-objects

Using math to make objects that look different / optical illusions
https://matsemann.github.io/impossible-objects/
287 stars 13 forks source link

SVG paths not being displayed, npm run watch doesnt exit #2

Open TheWanderer1983 opened 5 years ago

TheWanderer1983 commented 5 years ago

Hello, I'm on ubuntu 18.04 I've cloned the repo and i've built it without error. I then run the command npm run watch which gets to this output and doesnt exit back to console.

> webpack --config webpack.config.dev.js

webpack is watching the files…

Hash: bee9fbf0ed3f4fb6ffa3
Version: webpack 4.19.1
Time: 933ms
Built at: 28/10/2018 11:20:58 am
  Asset      Size  Chunks             Chunk Names
main.js  3.11 MiB    main  [emitted]  main
Entrypoint main = main.js
[./src/ImpossibleCalculator.js] 1.77 KiB {main} [built]
[./src/Renderer.js] 5.53 KiB {main} [built]
[./src/exporter.js] 493 bytes {main} [built]
[./src/index.js] 5.63 KiB {main} [built]
[./src/intersector.js] 1.14 KiB {main} [built]
[./src/lineFunctions.js] 1.84 KiB {main} [built]
[./src/svgCalc.js] 4.73 KiB {main} [built]

After doing that I can open the index.html file in the src folder which displays this. index

None of the other defined functions are displayed ( flower/circle, batman/superman etc) Also when I copy(window.objFile) in console, It only copies the first function (circule/triangle). copywindow.txt

Matsemann commented 5 years ago

Hi, cool that you're checking out my project! The project isn't exactly made to be useful for others, so beware of gotchas :)

The watch is supposed to not exit, as when you make changes to the code it will then watch the files and rebuild the project, so you can just refresh the browser.

As for the defined functions, you control which function is displayed by changing the usingDef variable her: https://github.com/Matsemann/impossible-objects/blob/master/src/index.js#L112

Edit that variable to something else, for instance supermanvsbatman, make sure watch is running, and refresh your browser and you should see it!

TheWanderer1983 commented 5 years ago

Hey Matsemann, Thank you for putting these files online. I'm a fan of Kokichi Sugihara illusions, I have a number of his earlier works. I had really wanted to get my hands on some of his illusions published in the paper "Topology-Disturbing Objects: A New Class of 3D Optical Illusion", but I coudln't find any 3d printables, or any for sale. I was looking at thingiverse the other day and I noticed you had put one online. Even better, you had provided code to generate your own.

Out of interest, I would like to try and generate ones like this, this and this. In the 3dfile folder you have a "squareoverlapping" model. However, I don't see any function for it in your software. Is your software capable of generating these overlap style illusions or did you manually create this one in blender?

What are the limitations of generating these illusions? How much of the paper did you implement?

These sort of questions probably aren't best placed in the issues section of github. Can I email you?

Regards Dylan

Matsemann commented 5 years ago

The software is capable to calculate those shapes also (at least the first two, the third one I will have to think more about how is made hehe).

The squareoverlapping was made using this code, I just made it before cleaning everything up and didn't write a nice way to reuse it. But it should be easy to recreate using the triangle and M functions here: https://github.com/Matsemann/impossible-objects/blob/master/src/lineFunctions.js However, after generating the lines, some tweaking is needed. To hide some parts from some angles, the height will need to be adjusted. This I did manually in Blender.

The reason I didn't include the shape, is because it didn't look so good in real life. With two eyes, your brain sees that one cylinder is closer/higher than the other. It looks good on camera, though!

So you could make one of your examples, by just decomposing them into multiple paths. Three parts I think: 1: line from one angle, and line with curve from other. 2: half circle from both sides. 3: Half circle and line. Color coded on top of the figure from his paper:

decomposed

Then after calculating these curves, you will then have to adjust the height so that the curved line hides some parts of the other. You may have to adjust their position as well, depending on how you place the lines when doing the calculations.

TheWanderer1983 commented 5 years ago

I 3d printed the squareoverlapping model. I see what you are talking about. Some of the other illusions on thingiverse (Cube illusion for example) suffer from same problem due to Stereopsis. Only really works when you close one eye and line it up just right.

Matsemann commented 5 years ago

Yep. But many of those I made actually work quite well in real life, as the differences are not as extreme as the squareoverlapping one.

I also tried printing some of the others on Thingiverse. Mine often look better in real life, think it's because mine are correctly calculated, not approximated by hand by trial and error.

I think mine worked well at the exhibition. I got hold of a spotlight, so I got bright light directly from above. That helped a lot with fooling the eyes a bit more, as the shadows didn't give as much away.