From 89deb070a9fa3d57eaadac48bd5f2cb9e4302ce5 Mon Sep 17 00:00:00 2001 From: Mandic <02mami1mma@hft-stuttgart.de> Date: Fri, 6 May 2022 09:56:53 +0000 Subject: [PATCH] Update ifsandmaterial.html --- public/X3DOMTutorial/ifsandmaterial.html | 221 ++++++++++++----------- 1 file changed, 117 insertions(+), 104 deletions(-) diff --git a/public/X3DOMTutorial/ifsandmaterial.html b/public/X3DOMTutorial/ifsandmaterial.html index 1972f08..244fa46 100644 --- a/public/X3DOMTutorial/ifsandmaterial.html +++ b/public/X3DOMTutorial/ifsandmaterial.html @@ -1,104 +1,117 @@ -<html> - -<head> - <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> - <title> indexed face set and material </title> - <link rel="stylesheet" type="text/css" href="x3dom.css"> - </link> -</head> - -<body> - <h1>indexed face set and material</h1> - <table width="100%" height="85%" border="0"> - <tr> - <td width="50%" align="center" valign="top" scope="col"> - <X3D id="shapedata" width="600px" height="600px" style="float:left"> - <Scene> - <Shape> - <!-- roof --> - <Appearance> - <Material diffuseColor="0.980, 0.502, 0.447"> </Material> - </Appearance> - <IndexedFaceSet solid="true" ccw="true" coordIndex=" 7 4 8 -1 4 5 8 -1 5 6 8 -1 6 7 8 -1"> - <Coordinate DEF="pointset" point="-1 0 1, 1 0 1, 1 0 -1, -1 0 -1, - -1 2 1, 1 2 1, 1 2 -1, -1 2 -1, 0 3 0 "> - </Coordinate> - </IndexedFaceSet> - </Shape> - <Shape> - <!-- wall --> - <Appearance> - <Material diffuseColor="0.753, 0.753, 0.753"> </Material> - </Appearance> - <IndexedFaceSet solid="true" ccw="true" coordIndex=" 0 1 5 4 -1 1 2 6 5 -1 2 3 7 6 -1 3 0 4 7 -1"> - <Coordinate USE="pointset"> - </Coordinate> - </IndexedFaceSet> - </Shape> - <Shape> - <!-- ground --> - <Appearance> - <Material diffuseColor="0.180, 0.280, 0.230"> </Material> - </Appearance> - <IndexedFaceSet solid="true" ccw="true" coordIndex=" 0 3 2 1 -1 "> - <Coordinate USE="pointset"> - </Coordinate> - </IndexedFaceSet> - </Shape> - </Scene> - </X3D> - </td> - <td width="50%" align="left" valign="top" scope="col"> - One shape has only ony appearance. If different colors for the building elements roof, wall and ground surfaces - shall be used, - we need to have different shape for these elements. However, they can share the same point set. The following - example uses different - Material for roo, wall, and ground surfaces. - <br> - <pre class="prettyprint"> - <X3D id="shapedata" width="600px" height="600px" style="float:left"> - <Scene> - <Shape> - <!-- roof --> - <Appearance> - <Material diffuseColor="0.980, 0.502, 0.447"> </Material> - </Appearance> - <IndexedFaceSet solid="true" ccw ="true" - coordIndex=" 7 4 8 -1 4 5 8 -1 5 6 8 -1 6 7 8 -1"> - <Coordinate DEF="pointset" point="-1 0 1, 1 0 1, 1 0 -1, -1 0 -1, - -1 2 1, 1 2 1, 1 2 -1, -1 2 -1, 0 3 0 " > - </Coordinate> - </IndexedFaceSet> - </Shape> - <Shape> - <!-- wall --> - <Appearance> - <Material diffuseColor="0.753, 0.753, 0.753"> </Material> - </Appearance> - <IndexedFaceSet solid="true" ccw ="true" - coordIndex=" 0 1 5 4 -1 1 2 6 5 -1 2 3 7 6 -1 3 0 4 7 -1"> - <Coordinate USE="pointset" > - </Coordinate> - </IndexedFaceSet> - </Shape> - <Shape> - <!-- ground --> - <Appearance> - <Material diffuseColor="0.180, 0.280, 0.230"> </Material> - </Appearance> - <IndexedFaceSet solid="true" ccw ="true" - coordIndex=" 0 3 2 1 -1 "> - <Coordinate USE="pointset" > - </Coordinate> - </IndexedFaceSet> - </Shape> - </Scene> - </X3D> - </pre> - </td> - </tr> - </table> - <script type="text/javascript" src="x3dom.js"></script> -</body> - -</html> \ No newline at end of file +<html> + +<head> + <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> + <title> indexed face set and material </title> + <link rel="stylesheet" type="text/css" href="x3dom.css"> + </link> + <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.1/styles/vs.min.css"> + <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.1/highlight.min.js"></script> + <script>hljs.highlightAll();</script> +</head> + +<body> + <h1>indexed face set and material</h1> + <table width="100%" height="85%" border="0"> + <tr> + <td width="50%" align="center" valign="top" scope="col"> + <X3D id="shapedata" width="600px" height="600px" style="float:left"> + <Scene> + <Shape> + <!-- roof --> + <Appearance> + <Material diffuseColor="0.980, 0.502, 0.447"> </Material> + </Appearance> + <IndexedFaceSet solid="true" ccw="true" coordIndex=" 7 4 8 -1 4 5 8 -1 5 6 8 -1 6 7 8 -1"> + <Coordinate DEF="pointset" point="-1 0 1, 1 0 1, 1 0 -1, -1 0 -1, + -1 2 1, 1 2 1, 1 2 -1, -1 2 -1, 0 3 0 "> + </Coordinate> + </IndexedFaceSet> + </Shape> + <Shape> + <!-- wall --> + <Appearance> + <Material diffuseColor="0.753, 0.753, 0.753"> </Material> + </Appearance> + <IndexedFaceSet solid="true" ccw="true" coordIndex=" 0 1 5 4 -1 1 2 6 5 -1 2 3 7 6 -1 3 0 4 7 -1"> + <Coordinate USE="pointset"> + </Coordinate> + </IndexedFaceSet> + </Shape> + <Shape> + <!-- ground --> + <Appearance> + <Material diffuseColor="0.180, 0.280, 0.230"> </Material> + </Appearance> + <IndexedFaceSet solid="true" ccw="true" coordIndex=" 0 3 2 1 -1 "> + <Coordinate USE="pointset"> + </Coordinate> + </IndexedFaceSet> + </Shape> + </Scene> + </X3D> + </p> + </td> + <td width="50%" align="left" valign="top" scope="col"> + One shape has only ony appearance. If different colors for the building elements roof, wall and ground surfaces + shall be used, + we need to have different shape for these elements. However, they can share the same point set. The following + example uses different + Material for roof, wall, and ground surfaces. + <br> + <pre> + <code class="language-html"> +<html> +<head> +<title> indexed face set and material </title> + <script type='text/javascript' src='http://www.x3dom.org/download/x3dom.js'> </script> + <link rel='stylesheet' type='text/css' href='http://www.x3dom.org/download/x3dom.css'></link> +</head> +<body> + <X3D id="shapedata" width="600px" height="600px" style="float:left"> + <Scene> + <Shape> + <!-- roof --> + <Appearance> + <Material diffuseColor="0.980, 0.502, 0.447"> </Material> + </Appearance> + <IndexedFaceSet solid="true" ccw ="true" + coordIndex=" 7 4 8 -1 4 5 8 -1 5 6 8 -1 6 7 8 -1"> + <Coordinate DEF="pointset" point="-1 0 1, 1 0 1, 1 0 -1, -1 0 -1, + -1 2 1, 1 2 1, 1 2 -1, -1 2 -1, 0 3 0 " > + </Coordinate> + </IndexedFaceSet> + </Shape> + <Shape> + <!-- wall --> + <Appearance> + <Material diffuseColor="0.753, 0.753, 0.753"> </Material> + </Appearance> + <IndexedFaceSet solid="true" ccw ="true" + coordIndex=" 0 1 5 4 -1 1 2 6 5 -1 2 3 7 6 -1 3 0 4 7 -1"> + <Coordinate USE="pointset" > + </Coordinate> + </IndexedFaceSet> + </Shape> + <Shape> + <!-- ground --> + <Appearance> + <Material diffuseColor="0.180, 0.280, 0.230"> </Material> + </Appearance> + <IndexedFaceSet solid="true" ccw ="true" + coordIndex=" 0 3 2 1 -1 "> + <Coordinate USE="pointset" > + </Coordinate> + </IndexedFaceSet> + </Shape> + </Scene> + </X3D> +</body> +</html> +</code> +</pre> + </td> + <script type="text/javascript" src="x3dom.js"></script> +</body> + +</html> -- GitLab