Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

zzz.dog

Post reply on HN
Print view View original

51–60 of 96 posts

Re: Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

#51

Post by erikpukinskis »

Crinus wrote: post #36
yunyu wrote: post #32

Earlier quoted context omitted.

> Its geometries exist in 3D space, but are rendered as flat shapes.

So does pretty much every single 3D engine that renders to a flat surface, like a monitor. I think it is just a misconception stemming from the 90s (notice the influence of this engine) when anything non-polygonal (and sometimes, non-GPU accelerated, depending on who you asked and how misinformed they were) was considered as "pseudo 3D". But there is nothing pseudo here, if your scene data structures use three dimens…

If it helps, think of it as an “actual 3D” scene where objects are laid out in three dimension, but within each bounding box is just a 2D painting of that object. So wherever objects intersect they just act like flat sprites hitting each other. They also have flat (2D) lighting.

It’s very similar to a sprite based 3D engine.

For other “pseudo-3D” engines see Wolfenstein, or even Super Mario which has “actual 3D” parallax but 2D drawing within each layer.

Another example is Heretic (a Doom engine variant) which could fake looking up and down by warping tiles, but distortion increased the higher up you look.

In every case there really is real 3D projection. But it just doesn’t go all the way. It retains some 2D algorithms for some part of the rendering.

Re: Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

#52

Post by knolan »

kejaed wrote: post #10
anonu wrote: post #8

Are there similar libraries for charting and plotting data? That would be super useful for visualizing complex datasets - in a 3d space.

I found vpython extremely helpful for visualizing an aerodynamic model of one of our parachute systems at work https://vpython.org/

Is this something I can use locally or in Jupyter or do I have to use GlowScript?

Re: Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

#53

Post by dahart »

ehsankia wrote: post #2

Is it me, or that `addTo` api feels very strange. Creating new objects with no assignments, with the side effects of adding it to an illustration.

The name is non-standard, but the concept is absolutely normal for a 2D or 3D rendering API. You can think of the ‘addTo’ property as the item’s parent. In 3D APIs this is normally called an instance or transform node, and here the transform is combined with the shape type. Sometimes those are separate things, and they would each have a parent attribute. Some APIs do the assignment the other way, by adding children to the parent. Either way, my short answer is no, this doesn’t feel strange.

Re: Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

#54

Post by kejaed »

knolan wrote: post #52
kejaed wrote: post #10

Earlier quoted context omitted.

I found vpython extremely helpful for visualizing an aerodynamic model of one of our parachute systems at work https://vpython.org/

Is this something I can use locally or in Jupyter or do I have to use GlowScript?

This is a great question, the whole GlowScript vs. VPython thing is really confusing and I feel presented in a complicated way on their site. It works great in plain old Jupyter and also from plain old python. If you use it in non-Jupyter Python, it'll launch a web server and browser to play the animation.

Re: Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

#55

Post by Impossible »

dawhizkid wrote: post #28

Nice. I've been playing around with 2D Canvas for audio visualizations and looked into WebGL but was mortified by how complicated it was to render basic 3D shapes and just gave up.

The answer is always start with Three.js. Especially if you have no 3D graphics experience and just want to render basic shapes. Drawing a textured cube is relatively straight forward (https://github.com/mrdoob/three.js/blob/master/examples/webg...).

Re: Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

#56

Post by cr0sh »

erikpukinskis wrote: post #51
Crinus wrote: post #36

Earlier quoted context omitted.

So does pretty much every single 3D engine that renders to a flat surface, like a monitor. I think it is just a misconception stemming from the 90s (notice the influence of this engine) when anything non-polygonal (and sometimes, non-GPU accelerated, depending on who you asked and how misinformed they were) was considered as "pseudo 3D". But there is nothing pseudo here, if your scene data structures use three dimens…

If it helps, think of it as an “actual 3D” scene where objects are laid out in three dimension, but within each bounding box is just a 2D painting of that object. So wherever objects intersect they just act like flat sprites hitting each other. They also have flat (2D) lighting. It’s very similar to a sprite based 3D engine. For other “pseudo-3D” engines see Wolfenstein, or even Super Mario which has “actual 3D” para…

Back in the day it was also referred to as "2.5D"

https://en.wikipedia.org/wiki/2.5D

Also, the whole sprite thing was used in a lot of Amiga demos in the late-80s-early 90s and was termed "vector bobs":

http://www.pouet.net/prod.php?which=3583

http://www.pouet.net/prod.php?which=50417

Re: Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

#57

Post by cr0sh »

gnode wrote: post #39
Crinus wrote: post #36

Earlier quoted context omitted.

So does pretty much every single 3D engine that renders to a flat surface, like a monitor. I think it is just a misconception stemming from the 90s (notice the influence of this engine) when anything non-polygonal (and sometimes, non-GPU accelerated, depending on who you asked and how misinformed they were) was considered as "pseudo 3D". But there is nothing pseudo here, if your scene data structures use three dimens…

In conventional 3D graphics each pixel is painted in 3D and a depth test applied. Here, 2D shapes are ordered discretely to create a 3D effect. Instead of the per-pixel z-fighting you conventionally see in 3D graphics, here we see entire shapes cross each other. This method cannot correctly paint intersecting, or cyclically occluding shapes (without breaking them into smaller components). I think "pseudo" could refer…

The other thing - this engine does orthographic projection, which preserves (IIRC) the distance aspect between points without any distortion.

It's a commonly used projection method for when you don't want scaling issues, where the need for measurement accuracy is more important (such as for CAD drawings - which inherited it from the standard technique for 3D model projection from the regular 3-view top/plan/side of pencil/paper drafting).

Most ordinary 3D engines use a true perspective projection, where distance from the view camera (or view plane) is taken into account, which causes objects (and parts of objects) to look smaller as they recede from that plane.

Re: Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

#58

Post by roywiggins »

erikpukinskis wrote: post #51
Crinus wrote: post #36

Earlier quoted context omitted.

So does pretty much every single 3D engine that renders to a flat surface, like a monitor. I think it is just a misconception stemming from the 90s (notice the influence of this engine) when anything non-polygonal (and sometimes, non-GPU accelerated, depending on who you asked and how misinformed they were) was considered as "pseudo 3D". But there is nothing pseudo here, if your scene data structures use three dimens…

If it helps, think of it as an “actual 3D” scene where objects are laid out in three dimension, but within each bounding box is just a 2D painting of that object. So wherever objects intersect they just act like flat sprites hitting each other. They also have flat (2D) lighting. It’s very similar to a sprite based 3D engine. For other “pseudo-3D” engines see Wolfenstein, or even Super Mario which has “actual 3D” para…

The original PlayStation didn't even have real 3D texture mapping, it used linear transformations rather than perspective transformations.

Re: Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

#59

Post by needle0 »

Remembering Dogz and digging through the Wikipedia rabbit hole, I just learned that PF Magic [1], the developer for Dogz/Catz, were also responsible for the SNES 3D fighting game Ballz [2], and its programmer later went on to develop the open-ended experimental adventure game Facade [3]. I knew of the existence of all of them but didn't knew they were all connected!

[1]: https://en.wikipedia.org/wiki/PF_Magic

[2]: https://en.wikipedia.org/wiki/Ballz

[3]: https://en.wikipedia.org/wiki/Fa%C3%A7ade_(video_game)

Re: Zdog – Pseudo-3D JavaScript engine for Canvas and SVG

#60

Post by Crinus »

cr0sh wrote: post #57
gnode wrote: post #39

Earlier quoted context omitted.

In conventional 3D graphics each pixel is painted in 3D and a depth test applied. Here, 2D shapes are ordered discretely to create a 3D effect. Instead of the per-pixel z-fighting you conventionally see in 3D graphics, here we see entire shapes cross each other. This method cannot correctly paint intersecting, or cyclically occluding shapes (without breaking them into smaller components). I think "pseudo" could refer…

The other thing - this engine does orthographic projection, which preserves (IIRC) the distance aspect between points without any distortion. It's a commonly used projection method for when you don't want scaling issues, where the need for measurement accuracy is more important (such as for CAD drawings - which inherited it from the standard technique for 3D model projection from the regular 3-view top/plan/side of p…

Yes, but that again is not what would make something "not 3D" - orthographic projection is common in 3D graphics and even most game engines support it.
Post reply on HN