Web Analytics Made Easy -
StatCounter Simple 3D raycasting engine in DHTML - CodingForum

Announcement

Collapse
No announcement yet.

Simple 3D raycasting engine in DHTML

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Simple 3D raycasting engine in DHTML

    http://www.elephantsneverforget.co.u...editor/gme.asp (probably I.E only. There's nothing that should stop it from running in Moz and NS, but it's quite demanding so I imagine they'd choke..)

    Right, anyone have any ideas of how to make it faster?? I fudged it together really quickly so theres probably lots of room for improvement.

    Also, the the actual raycasting code is crap because I can't get Math.tan() to work properly.. (96 + (224-191)/tan(60)) should return about 115, but it's waaaaay off. Am I doing something wrong or is tan() broken (I.E 5.5).

    Anyways tell me what you think.. Is this the first real time 3D engine in javascript?

  • #2
    Anyone?

    Comment


    • #3
      Umm, nothing happens in Moz 1.1 Alpha? But the process manager is saying that Mozilla is using 85%-95% of my total CPU usage after idling on the page, which implies something is going on.

      Anyway, the only thing I see immediately offhand to increase performance is in the beginning of controls():

      !peek( ((x-(SinTable[ang]*mov))/grid) ,((y-(CosTable[ang]*mov))/grid) ) ){press=true;x = x - (SinTable[ang] * mov); y = y - (CosTable[ang] * mov)}

      You have x-SinTable[ang]*mov and y-CosTable[ang]*mov twice each.
      I doubt your unnecessary grouping parantheses hurt performance any, but I'm pretty sure it would be faster to perform that calculation once, store it in a variable, and use that variable twice instead.

      Mozilla has a builtin code-profiler in Tools --> Web Development --> Javascript Debugger

      I would suggest making it work in Mozilla, then extensively use this tool to optimize code.
      jasonkarldavis.com

      Comment


      • #4
        Got it working(ish) in Mozilla!

        Something is wrong with this line:
        rend +="<div style='position:absolute;top:"+(100-(ds/2))+";left:"+(n*scale)+";background-color:"+color+"'><table cellspacing=0 cellpadding=0 border=0 width="+(strwidth)+" height="+ds+" bgcolor="+color+"><tr><td></td></tr></table></div>";

        Mozilla is ignoring the table BGCOLOR, I think. Either that or something is wrong with my formatting? I dunno.. Anyway, I've turned the table border on and now everything is displayed. It's just REEEAAALLY slow. Like 10x slower than IE atleast!

        I'll change controls(), and play around with the Moz debugger. I had an idea of how to do texture mapping too..

        Comment


        • #5
          http://www.elephantsneverforget.co.u...ditor/gme2.asp

          Now with (sort of) texturemapping.. It's the worst possible way of doing it, but it looks interesting ish anyway.. This version is a bit faster than the other one I think..

          I had a go at doing stairs, but couldn't get them to be positioned correctly on the Y coordinate.

          The formula is wallY=(100-(distance/2));

          So everything appears in the center on the Y coordinate. Which means that instead of stairs appearing on the floor they kind of float in mid air.. Any ideas?

          Comment

          Working...
          X