[x3d-public] Appearance of Geometry in HTML

[Roy Walmsley]

Thanks, Leonard.

 

From: Leonard Daly [mailto:Leonard.Daly at realism.com] 
Sent: 14 August 2017 18:09
To: Roy Walmsley <roy.walmsley at ntlworld.com>
Cc: 'X3D Public' <x3d-public at web3d.org>
Subject: Re: [x3d-public] Appearance of Geometry in HTML

 

Roy,

Note that CSS is generally not rich enough at this time to handle of kinds of 3D appearance. However, I think it may be sufficiently robust to handle this one.

The problem (as stated) is how would one texture a Box using just CSS.

At this time there is no implementation that handles this, so these answers are potential at this time.

The background-image property is the first one that comes to mind. It is the most comment CSS image property. It could be defined to correctly texture-wrap a 3D shape. Using a background-image, HTML text or other HTML objects could be added to the cube. CSS also supports limited image filtering that may be useful. W3Schools has a page that discusses images interaction with CSS for HTML at https://www.w3schools.com/css/css3_images.asp.

It gets harder if you need to map specific image coordinates to specific vertices. There is nothing in CSS (as currently defined) that will do this well. There is some beginnings of this with background-position and background-attachment (see https://www.w3schools.com/css/css_background.asp for more details).

background-color could be used as the equivalent to diffuseColor. There is no current equivalent to specularColor or emissiveColor.


Leonard Daly


P.S. I should add that when I brought this idea up before, but phrased as having a Shape node contain all geometry and appearance properties; it was discussed that putting everything into a single node gave up the flexibility of reuse. This time I am asking about putting all of the appearance into CSS, which is designed for reuse.








HI Leonard,

 

I’m having trouble understanding (due to my inexperience) why you wouldn’t need an ImageTexture node. I’m hoping you can help me here.

 

Consider the following simple example.

 

I have a cube, and want to use an image as a texture. I’m doing this in an X3D scene graph incorporated into an HTML listing. I can easily specify the Box node for the shape. How would I specify the texture image as CSS?

 

My partial listing might be:

 

<Shape>

  <Box></Box>

  <ImageTexture url=’”myImage.png”’></ImageTexture>

</Shape>

 

Your proposal suggests that the HTML portion might be:

<Shape class=”myBoxClass”>

  <Box></Box>

</Shape>

 

What would go into the CSS portion to call up the image?

 

Shape.myBoxClass {

????

}

 

Thanks in advance,

 

Roy

 

From: x3d-public [mailto:x3d-public-bounces at web3d.org] On Behalf Of Leonard Daly
Sent: 14 August 2017 16:21
To: X3D Public  <mailto:x3d-public at web3d.org> <x3d-public at web3d.org>
Subject: [x3d-public] Appearance of Geometry in HTML

 

If HTML/CSS world, the appearance of an element is (ideally) set in the appropriate style definitions for the element using a combinations of classes, ids, tags, and hierarchy. This includes it's edge effects (border style, corner rounding, padding) and internal appearance (color, background color, gradients, fonts, etc.). 

Using the same environment (HTML/CSS) and adding the 3D dimension (and maybe second cameras, markers, etc.) should the appearance of objects (geometry) be controlled by the appropriate style definitions? Why or why not?

If CSS+1D style definitions are used, then there is no need to any appearance nodes (Material, ImageTxture, etc.). It might be done as <Shape class='sign speedLimit'><IndexedFaceSet ...></Shape>. The classes would add the black border, yellow background, text color, etc.

The disadvantage is that some geometries may be require an extremely complex vertex (or face) assignment for this to be practical.

This method does align nicely with HTML and allows HTML tools and concepts to be carried over to 3D/VR/AR/xR.

 

-- 
Leonard Daly
3D Systems & Cloud Consultant
LA ACM SIGGRAPH Chair
President, Daly Realism - Creating the Future 

 

-- 
Leonard Daly
3D Systems & Cloud Consultant
LA ACM SIGGRAPH Chair
President, Daly Realism - Creating the Future 

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://web3d.org/pipermail/x3d-public_web3d.org/attachments/20170814/2d45c56d/attachment-0001.html>