News: Support the forums via Fractalforums.com Online Store
 
*
Welcome, Guest. Please login or register. April 25, 2014, 02:30:33 AM


Login with username, password and session length



Pages: [1] 2   Go Down
  Print  
Share this topic on DiggShare this topic on FacebookShare this topic on GoogleShare this topic on RedditShare this topic on StumbleUponShare this topic on Twitter
Author Topic: new WebGL application to explore 3D fractals  (Read 5853 times)
0 Members and 1 Guest are viewing this topic.
DrColossus
Forums Newbie
*
Posts: 7


« on: January 19, 2012, 04:45:03 PM »

Me and two friends developed this WebGL application to explore raymarched 3D fractals in your browser over the last couple of months.

You can try it for yourself here: http://projekte.sinnpirat.de/fraktal/

It's running almost entirely on the GPU in GLSL, which means that we are limited by 16bit float precision.
At the moment we only fully support Google Chrome in Windows and we recommend a GTX 460 or better, the Intel HD3000 is probably the minimum requirement.

EDIT: The Windows version of Firefox currently crashes when ANGLE is enabled (ANGLE is a graphics layer that maps WebGL to DirectX on Windows machines)
We are still trying to figure out why that happens, and why our sliders do not show up in Firefox under Windows.

To disable ANGLE, type "about:config" (without the quotes) into your adress bar and set "webgl.prefer-native-gl" to true.



If the framerate gets too low, you can choose a higher "undersampling" value and/or disable shadows.

Undersampling means that we distribute the workload of a single frame over multiple frames to reduce inputlag.
This results in a lower resolution while moving the camera, which gets gradually higher over time.
After a full frame has been rendered we start taking more samples (up to 16) per pixel to reduce aliasing artifacts.

The depth of field, distance fog and exposure settings can be changed without rerendering the image since they are postprocessing features.
Click on the "Help" button to view the controls.

Let me know if you experience any issues or have ideas for improvement smiley

Here are some images for those that are unable to run it themselves:













« Last Edit: January 21, 2012, 02:12:12 PM by DrColossus » Logged
cKleinhuis
Administrator
Fractal Senior
*******
Posts: 5276


formerly known as 'Trifox'


WWW
« Reply #1 on: January 19, 2012, 05:50:36 PM »

nice, need to try it out at home, my computer at work doesnt suport glsl sad
Logged

---

divide and conquer - iterate and rule - chaos is No random!
cbuchner1
Fractal Phenom
******
Posts: 440


« Reply #2 on: January 19, 2012, 06:16:16 PM »


Wow, thanks for sharing this.

Christian
Logged
Syntopia
Fractal Bachius
*
Posts: 579



syntopiadk
WWW
« Reply #3 on: January 19, 2012, 06:17:33 PM »

Nice images - and good to see more people in the GLSL camp!

It works in Chrome with my Geforce 310M (laptop), but the undersampling does not converge properly - the samples seems to be wrongly offset.

On Firefox, I get no image when undersampling is enabled, and the Mandelbulb doesn't work, but the Quaternion Julia, and the Mandelbox works. I have to turn the ANGLE webgl layer off, though, otherwise Firefox just crashes.
Logged
DrColossus
Forums Newbie
*
Posts: 7


« Reply #4 on: January 19, 2012, 09:10:06 PM »

Nice images - and good to see more people in the GLSL camp!

It works in Chrome with my Geforce 310M (laptop), but the undersampling does not converge properly - the samples seems to be wrongly offset.

On Firefox, I get no image when undersampling is enabled, and the Mandelbulb doesn't work, but the Quaternion Julia, and the Mandelbox works. I have to turn the ANGLE webgl layer off, though, otherwise Firefox just crashes.


Thanks, none of us had wrote a shader or a single line of Javascript before we started this project and we had quite some issues with different browsers and versions.

Do the undersampling issues happen with the latest version of Chrome under Windows on your 310M?

It seems that the texture sampling coordinates vary quite a bit from system to system, for example the Y-dimension when sampling from a texture had to be reversed under OSX when we tested it.
When we do our undersampling, we actually render lowres images (that are used to construct a fullres image later on) into a fullres texture.



When using 4x undersampling, only every fourth ray is rendered into a small image.
The distortion then happens when we rearrange the pixels to display the final picture since we need to sample them from the above image.

I'm not sure if we're able to fix this in the coming few weeks since exams are coming up and the current WebGL implementation in different browsers is far from final :/
Logged
ker2x
Fractal Molossus
**
Posts: 706


WWW
« Reply #5 on: January 20, 2012, 02:17:11 AM »

it crash my firefox, and here is what i see in chrome, windows 7, GTX 470 :



PS : it works with undersamping to OFF  grin
« Last Edit: January 20, 2012, 02:19:43 AM by ker2x » Logged

often times... there are other approaches which are kinda crappy until you put them in the context of parallel machines
(en) http://www.blog-gpgpu.com/ , (fr) http://www.keru.org/ ,
Sysadmin & DBA @ http://www.over-blog.com/
David Makin
Global Moderator
Fractal Senior
******
Posts: 2189



Makin' Magic Fractals
WWW
« Reply #6 on: January 20, 2012, 05:00:50 AM »

Doesn't work in WebKit for OSX at all, works in Firefox for OSX at around 14-16fps when moving around provided that undersampling is disabled.
Card here is an ATI Radeon HD 5870 and it's a dual 6-core MacPro.
Can't see any way to change the FoV ?
Logged

The meaning and purpose of life is to give life purpose and meaning.

http://www.fractalgallery.co.uk/
"Makin' Magic Music" on Jango
subblue
Conqueror
*******
Posts: 111



WWW
« Reply #7 on: January 20, 2012, 08:48:04 AM »

Very nice. I like the DOF feature. Under-sampling doesn't work here either.
Logged

www.subblue.com - a blog exploring mathematical and generative graphics
Syntopia
Fractal Bachius
*
Posts: 579



syntopiadk
WWW
« Reply #8 on: January 20, 2012, 09:05:57 AM »

Just tried on a GTX570 in another machine and I get the same results as before.
My results are very different from ker2x's, though.


* test.jpg (54.13 KB, 1023x509 - viewed 180 times.)
Logged
DarkBeam
Global Moderator
Fractal Senior
******
Posts: 1650


The spaghetti formula coder


« Reply #9 on: January 20, 2012, 09:38:41 AM »

Strange, am I the only one that sees it perfectly working? wink
Logged

Formulas are never too much (?)

ker2x
Fractal Molossus
**
Posts: 706


WWW
« Reply #10 on: January 20, 2012, 10:51:11 AM »

Just tested in chrome on my linux ubuntu 10.04LTS, with a GTX 460M, i see the blueish background but no fractal sad
I'm learning GLGL and WebGL, so i'll take a look at the source code and see if i can find any bug (unlikely, but i have to try).
Logged

often times... there are other approaches which are kinda crappy until you put them in the context of parallel machines
(en) http://www.blog-gpgpu.com/ , (fr) http://www.keru.org/ ,
Sysadmin & DBA @ http://www.over-blog.com/
DrColossus
Forums Newbie
*
Posts: 7


« Reply #11 on: January 20, 2012, 12:18:38 PM »

Can't see any way to change the FoV ?

I just added a FOV slider on my machine, it'll be on the server in a couple of hours.


It is really weird that there are issues with nvidia cards, i'm using a GTX580 (290.53 drivers, Chrome 16.0.912.75m) myself and can't seem to reproduce those artifacts, please try it again using the latest graphics card drivers and Chrome version so i can make sure it's not a driver/browser issue.

For those experiencing distortion when undersampling: Please try this version and see if it improves anything http://dl.dropbox.com/u/6556492/Raymarching/index.html

I'd really like to get rid of those errors and appreciate any help!
Logged
Rathinagiri
Fractal Fertilizer
*****
Posts: 361


« Reply #12 on: January 20, 2012, 01:43:01 PM »

It works great in my Chrome (Win7)

I wish to see it in real 3D with left and right eye images.
Logged
subblue
Conqueror
*******
Posts: 111



WWW
« Reply #13 on: January 20, 2012, 01:54:24 PM »

For those experiencing distortion when undersampling: Please try this version and see if it improves anything http://dl.dropbox.com/u/6556492/Raymarching/index.html
That fixes the undersampling on my machine (OSX, ATI 4850) smiley

The latest stable version of Chrome for OSX has a bug in the cos function (!!) - I reported it last September... I'm using this for compatibility in my shaders:
Code:
#define HALFPI 1.570796
#define cos(a) sin(a + HALFPI)
Logged

www.subblue.com - a blog exploring mathematical and generative graphics
Syntopia
Fractal Bachius
*
Posts: 579



syntopiadk
WWW
« Reply #14 on: January 20, 2012, 02:17:48 PM »

I just added a FOV slider on my machine, it'll be on the server in a couple of hours.

It is really weird that there are issues with nvidia cards, i'm using a GTX580 (290.53 drivers, Chrome 16.0.912.75m) myself and can't seem to reproduce those artifacts, please try it again using the latest graphics card drivers and Chrome version so i can make sure it's not a driver/browser issue.

For those experiencing distortion when undersampling: Please try this version and see if it improves anything http://dl.dropbox.com/u/6556492/Raymarching/index.html

I'd really like to get rid of those errors and appreciate any help!


Tried the dropbox version, and it still fails (both Firefox (without ANGLE)  and Chrome) - but looks different now.

chrome://version/ = 16.0.912.75 (Official Build 116452) m (Vista, 32bit)

GTX570 drivers are version: 285.62 (Oct 2011) - these are the latest official ones - yours must be beta drivers, right?
Logged
Pages: [1] 2   Go Down
  Print  
 
Jump to:  


Related Topics
Subject Started by Replies Views Last post
Towards a general recipe to explore new fractals? 3D Fractal Generation knighty 12 2013 Last post May 04, 2010, 10:45:55 PM
by reesej2
WebGL Programming ker2x 5 1095 Last post August 25, 2011, 10:33:17 PM
by David Makin
How to Explore other peoples projects? Mandelbulb 3d Pangaea 7 598 Last post March 01, 2012, 05:01:21 PM
by Alef
Explore Film Arthur Stammet 0 128 Last post May 04, 2013, 10:46:19 PM
by Arthur Stammet
The best way to explore a Fragmentarium hybrid... Animations Showcase (Rate My short Animation) « 1 2 » 3dickulus 18 560 Last post August 17, 2013, 10:44:08 PM
by 3dickulus

Powered by MySQL Powered by PHP Powered by SMF 1.1.19 | SMF © 2013, Simple Machines

Valid XHTML 1.0! Valid CSS! Dilber MC Theme by HarzeM
Page created in 0.436 seconds with 27 queries. (Pretty URLs adds 0.02s, 2q)