Basisobjekte
Hier findest du einige einfache Objekte, aus denen wir die meisten unserer Strukturen bauen werden.
Aus Gründen der Übersichtlichkeit verzichten wir hier bei Codebeispielen auf ein Grundgerüst. Die Beispiele sind auch jeweils "lebendig", d.h. du kannst sie mit der Maus bewegen!
Kugeln
- FPS0.00
- ANIM0.00
- TRAVERSE0.00
- SORT0.00
- RENDER0.30
- DRAW0.30
- #NODES:2
- #SHAPES:1
- #DRAWS:1
- #POINTS:625
- #TRIS:1,152
- #ACTIVE0
- #TOTAL0
- #LOADED0
- #FAILED0
<Shape>
<Appearance>
<Material diffuseColor="1 0 0"/>
</Appearance>
<Sphere radius="2"/>
</Shape>
Kugeln benötigen als einzige Angabe einen Radius, hier auf 2 gesetzt.
Kegel
- FPS0.00
- ANIM0.00
- TRAVERSE0.10
- SORT0.00
- RENDER0.20
- DRAW0.20
- #NODES:2
- #SHAPES:1
- #DRAWS:1
- #POINTS:98
- #TRIS:94
- #ACTIVE0
- #TOTAL0
- #LOADED0
- #FAILED0
<Shape>
<Appearance>
<Material diffuseColor="0 1 0"/>
</Appearance>
<Cone bottomRadius="2" height="4" />
</Shape>
Kegel benötigen sowohl einen Radius wie auch eine Höhe als Angaben.
Quader
- FPS0.00
- ANIM0.00
- TRAVERSE0.00
- SORT0.00
- RENDER0.30
- DRAW0.30
- #NODES:2
- #SHAPES:1
- #DRAWS:1
- #POINTS:24
- #TRIS:12
- #ACTIVE0
- #TOTAL0
- #LOADED0
- #FAILED0
<Shape>
<Appearance>
<Material diffuseColor="1 1 0"/>
</Appearance>
<Box size='2 4 6'/>
</Shape>
Zylinder
- FPS0.00
- ANIM0.00
- TRAVERSE0.10
- SORT0.00
- RENDER0.30
- DRAW0.30
- #NODES:2
- #SHAPES:1
- #DRAWS:1
- #POINTS:130
- #TRIS:124
- #ACTIVE0
- #TOTAL0
- #LOADED0
- #FAILED0
<Shape>
<Appearance>
<Material diffuseColor="0 1 1"/>
</Appearance>
<Cylinder height="3" radius="1.5"/>
</Shape>
Wie Kegel kommen Zylinder mit Radius und Höhe aus.
Text
Texte sind in 3D-Grafiken eher untypisch, aber es geht:
INFO: Time for setup and init of GL element no. 4: 20 ms.
INFO: activate FogBindable null/defaultX3DFogNode
INFO: register FogBindable null/defaultX3DFogNode
INFO: create new Fog for X3DFogNode-stack
INFO: activate ViewpointBindable null/defaultX3DViewpointNode
INFO: register ViewpointBindable null/defaultX3DViewpointNode
INFO: create new Viewpoint for X3DViewpointNode-stack
INFO: activate BackgroundBindable null/defaultX3DBackgroundNode
INFO: register BackgroundBindable null/defaultX3DBackgroundNode
INFO: create new Background for X3DBackgroundNode-stack
INFO: System ready.
INFO: activate NavigationInfoBindable null/defaultX3DNavigationInfoNode
INFO: register NavigationInfoBindable null/defaultX3DNavigationInfoNode
INFO: NavType: undefined
INFO: Switch to examine mode.
INFO: create new NavigationInfo for X3DNavigationInfoNode-stack
INFO: activate EnvironmentBindable null/defaultX3DEnvironmentNode
INFO: register EnvironmentBindable null/defaultX3DEnvironmentNode
INFO: create new Environment for X3DEnvironmentNode-stack
INFO: addEventListener for X3D.onDOMNodeInserted
INFO: addEventListener for X3D.onDOMNodeRemoved
INFO: webgl2 context found Vendor: WebKit Google Inc. (Google), Renderer: WebKit WebGL ANGLE (Google, Vulkan 1.3.0 (SwiftShader Device (LLVM 10.0.0) (0x0000C0DE)), SwiftShader driver), Version: WebGL 2.0 (OpenGL ES 3.0 Chromium), ShadingLangV.: WebGL GLSL ES 3.00 (OpenGL ES GLSL ES 3.0 Chromium), MSAA samples: 4 Extensions: EXT_clip_control, EXT_color_buffer_float, EXT_color_buffer_half_float, EXT_conservative_depth, EXT_depth_clamp, EXT_float_blend, EXT_polygon_offset_clamp, EXT_texture_compression_bptc, EXT_texture_compression_rgtc, EXT_texture_filter_anisotropic, EXT_texture_mirror_clamp_to_edge, EXT_texture_norm16, NV_shader_noperspective_interpolation, OES_draw_buffers_indexed, OES_sample_variables, OES_shader_multisample_interpolation, OES_texture_float_linear, OVR_multiview2, WEBGL_clip_cull_distance, WEBGL_compressed_texture_astc, WEBGL_compressed_texture_etc, WEBGL_compressed_texture_etc1, WEBGL_compressed_texture_s3tc, WEBGL_compressed_texture_s3tc_srgb, WEBGL_debug_renderer_info, WEBGL_debug_shaders, WEBGL_lose_context, WEBGL_multi_draw, WEBGL_polygon_mode, WEBGL_stencil_texturing
INFO: Initializing X3DCanvas for [x3dom-1747628673596-canvas]
WARNING: The width attribute is to be specified in pixels not in percent.
INFO: Inline X3D styles detected
INFO: Creating canvas for (X)3D element...
INFO: Time for setup and init of GL element no. 3: 15 ms.
INFO: activate FogBindable null/defaultX3DFogNode
INFO: register FogBindable null/defaultX3DFogNode
INFO: create new Fog for X3DFogNode-stack
INFO: activate ViewpointBindable null/defaultX3DViewpointNode
INFO: register ViewpointBindable null/defaultX3DViewpointNode
INFO: create new Viewpoint for X3DViewpointNode-stack
INFO: activate BackgroundBindable null/defaultX3DBackgroundNode
INFO: register BackgroundBindable null/defaultX3DBackgroundNode
INFO: create new Background for X3DBackgroundNode-stack
INFO: System ready.
INFO: activate NavigationInfoBindable null/defaultX3DNavigationInfoNode
INFO: register NavigationInfoBindable null/defaultX3DNavigationInfoNode
INFO: NavType: undefined
INFO: Switch to examine mode.
INFO: create new NavigationInfo for X3DNavigationInfoNode-stack
INFO: activate EnvironmentBindable null/defaultX3DEnvironmentNode
INFO: register EnvironmentBindable null/defaultX3DEnvironmentNode
INFO: create new Environment for X3DEnvironmentNode-stack
INFO: addEventListener for X3D.onDOMNodeInserted
INFO: addEventListener for X3D.onDOMNodeRemoved
INFO: webgl2 context found Vendor: WebKit Google Inc. (Google), Renderer: WebKit WebGL ANGLE (Google, Vulkan 1.3.0 (SwiftShader Device (LLVM 10.0.0) (0x0000C0DE)), SwiftShader driver), Version: WebGL 2.0 (OpenGL ES 3.0 Chromium), ShadingLangV.: WebGL GLSL ES 3.00 (OpenGL ES GLSL ES 3.0 Chromium), MSAA samples: 4 Extensions: EXT_clip_control, EXT_color_buffer_float, EXT_color_buffer_half_float, EXT_conservative_depth, EXT_depth_clamp, EXT_float_blend, EXT_polygon_offset_clamp, EXT_texture_compression_bptc, EXT_texture_compression_rgtc, EXT_texture_filter_anisotropic, EXT_texture_mirror_clamp_to_edge, EXT_texture_norm16, NV_shader_noperspective_interpolation, OES_draw_buffers_indexed, OES_sample_variables, OES_shader_multisample_interpolation, OES_texture_float_linear, OVR_multiview2, WEBGL_clip_cull_distance, WEBGL_compressed_texture_astc, WEBGL_compressed_texture_etc, WEBGL_compressed_texture_etc1, WEBGL_compressed_texture_s3tc, WEBGL_compressed_texture_s3tc_srgb, WEBGL_debug_renderer_info, WEBGL_debug_shaders, WEBGL_lose_context, WEBGL_multi_draw, WEBGL_polygon_mode, WEBGL_stencil_texturing
INFO: Initializing X3DCanvas for [x3dom-1747628673550-canvas]
WARNING: The width attribute is to be specified in pixels not in percent.
INFO: Inline X3D styles detected
INFO: Creating canvas for (X)3D element...
INFO: Time for setup and init of GL element no. 2: 22 ms.
INFO: activate FogBindable null/defaultX3DFogNode
INFO: register FogBindable null/defaultX3DFogNode
INFO: create new Fog for X3DFogNode-stack
INFO: activate ViewpointBindable null/defaultX3DViewpointNode
INFO: register ViewpointBindable null/defaultX3DViewpointNode
INFO: create new Viewpoint for X3DViewpointNode-stack
INFO: activate BackgroundBindable null/defaultX3DBackgroundNode
INFO: register BackgroundBindable null/defaultX3DBackgroundNode
INFO: create new Background for X3DBackgroundNode-stack
INFO: System ready.
INFO: activate NavigationInfoBindable null/defaultX3DNavigationInfoNode
INFO: register NavigationInfoBindable null/defaultX3DNavigationInfoNode
INFO: NavType: undefined
INFO: Switch to examine mode.
INFO: create new NavigationInfo for X3DNavigationInfoNode-stack
INFO: activate EnvironmentBindable null/defaultX3DEnvironmentNode
INFO: register EnvironmentBindable null/defaultX3DEnvironmentNode
INFO: create new Environment for X3DEnvironmentNode-stack
INFO: addEventListener for X3D.onDOMNodeInserted
INFO: addEventListener for X3D.onDOMNodeRemoved
INFO: webgl2 context found Vendor: WebKit Google Inc. (Google), Renderer: WebKit WebGL ANGLE (Google, Vulkan 1.3.0 (SwiftShader Device (LLVM 10.0.0) (0x0000C0DE)), SwiftShader driver), Version: WebGL 2.0 (OpenGL ES 3.0 Chromium), ShadingLangV.: WebGL GLSL ES 3.00 (OpenGL ES GLSL ES 3.0 Chromium), MSAA samples: 4 Extensions: EXT_clip_control, EXT_color_buffer_float, EXT_color_buffer_half_float, EXT_conservative_depth, EXT_depth_clamp, EXT_float_blend, EXT_polygon_offset_clamp, EXT_texture_compression_bptc, EXT_texture_compression_rgtc, EXT_texture_filter_anisotropic, EXT_texture_mirror_clamp_to_edge, EXT_texture_norm16, NV_shader_noperspective_interpolation, OES_draw_buffers_indexed, OES_sample_variables, OES_shader_multisample_interpolation, OES_texture_float_linear, OVR_multiview2, WEBGL_clip_cull_distance, WEBGL_compressed_texture_astc, WEBGL_compressed_texture_etc, WEBGL_compressed_texture_etc1, WEBGL_compressed_texture_s3tc, WEBGL_compressed_texture_s3tc_srgb, WEBGL_debug_renderer_info, WEBGL_debug_shaders, WEBGL_lose_context, WEBGL_multi_draw, WEBGL_polygon_mode, WEBGL_stencil_texturing
INFO: Initializing X3DCanvas for [x3dom-1747628673496-canvas]
WARNING: The width attribute is to be specified in pixels not in percent.
INFO: Inline X3D styles detected
INFO: Creating canvas for (X)3D element...
INFO: Time for setup and init of GL element no. 1: 16 ms.
INFO: activate FogBindable null/defaultX3DFogNode
INFO: register FogBindable null/defaultX3DFogNode
INFO: create new Fog for X3DFogNode-stack
INFO: activate ViewpointBindable null/defaultX3DViewpointNode
INFO: register ViewpointBindable null/defaultX3DViewpointNode
INFO: create new Viewpoint for X3DViewpointNode-stack
INFO: activate BackgroundBindable null/defaultX3DBackgroundNode
INFO: register BackgroundBindable null/defaultX3DBackgroundNode
INFO: create new Background for X3DBackgroundNode-stack
INFO: System ready.
INFO: activate NavigationInfoBindable null/defaultX3DNavigationInfoNode
INFO: register NavigationInfoBindable null/defaultX3DNavigationInfoNode
INFO: NavType: undefined
INFO: Switch to examine mode.
INFO: create new NavigationInfo for X3DNavigationInfoNode-stack
INFO: activate EnvironmentBindable null/defaultX3DEnvironmentNode
INFO: register EnvironmentBindable null/defaultX3DEnvironmentNode
INFO: create new Environment for X3DEnvironmentNode-stack
INFO: addEventListener for X3D.onDOMNodeInserted
INFO: addEventListener for X3D.onDOMNodeRemoved
INFO: webgl2 context found Vendor: WebKit Google Inc. (Google), Renderer: WebKit WebGL ANGLE (Google, Vulkan 1.3.0 (SwiftShader Device (LLVM 10.0.0) (0x0000C0DE)), SwiftShader driver), Version: WebGL 2.0 (OpenGL ES 3.0 Chromium), ShadingLangV.: WebGL GLSL ES 3.00 (OpenGL ES GLSL ES 3.0 Chromium), MSAA samples: 4 Extensions: EXT_clip_control, EXT_color_buffer_float, EXT_color_buffer_half_float, EXT_conservative_depth, EXT_depth_clamp, EXT_float_blend, EXT_polygon_offset_clamp, EXT_texture_compression_bptc, EXT_texture_compression_rgtc, EXT_texture_filter_anisotropic, EXT_texture_mirror_clamp_to_edge, EXT_texture_norm16, NV_shader_noperspective_interpolation, OES_draw_buffers_indexed, OES_sample_variables, OES_shader_multisample_interpolation, OES_texture_float_linear, OVR_multiview2, WEBGL_clip_cull_distance, WEBGL_compressed_texture_astc, WEBGL_compressed_texture_etc, WEBGL_compressed_texture_etc1, WEBGL_compressed_texture_s3tc, WEBGL_compressed_texture_s3tc_srgb, WEBGL_debug_renderer_info, WEBGL_debug_shaders, WEBGL_lose_context, WEBGL_multi_draw, WEBGL_polygon_mode, WEBGL_stencil_texturing
INFO: Initializing X3DCanvas for [x3dom-1747628673451-canvas]
WARNING: The width attribute is to be specified in pixels not in percent.
INFO: Inline X3D styles detected
INFO: Creating canvas for (X)3D element...
INFO: Time for setup and init of GL element no. 0: 39 ms.
INFO: activate FogBindable null/defaultX3DFogNode
INFO: register FogBindable null/defaultX3DFogNode
INFO: create new Fog for X3DFogNode-stack
INFO: activate ViewpointBindable null/defaultX3DViewpointNode
INFO: register ViewpointBindable null/defaultX3DViewpointNode
INFO: create new Viewpoint for X3DViewpointNode-stack
INFO: activate BackgroundBindable null/defaultX3DBackgroundNode
INFO: register BackgroundBindable null/defaultX3DBackgroundNode
INFO: create new Background for X3DBackgroundNode-stack
INFO: System ready.
INFO: activate NavigationInfoBindable null/defaultX3DNavigationInfoNode
INFO: register NavigationInfoBindable null/defaultX3DNavigationInfoNode
INFO: NavType: undefined
INFO: Switch to examine mode.
INFO: create new NavigationInfo for X3DNavigationInfoNode-stack
INFO: activate EnvironmentBindable null/defaultX3DEnvironmentNode
INFO: register EnvironmentBindable null/defaultX3DEnvironmentNode
INFO: create new Environment for X3DEnvironmentNode-stack
INFO: addEventListener for X3D.onDOMNodeInserted
INFO: addEventListener for X3D.onDOMNodeRemoved
INFO: webgl2 context found Vendor: WebKit Google Inc. (Google), Renderer: WebKit WebGL ANGLE (Google, Vulkan 1.3.0 (SwiftShader Device (LLVM 10.0.0) (0x0000C0DE)), SwiftShader driver), Version: WebGL 2.0 (OpenGL ES 3.0 Chromium), ShadingLangV.: WebGL GLSL ES 3.00 (OpenGL ES GLSL ES 3.0 Chromium), MSAA samples: 4 Extensions: EXT_clip_control, EXT_color_buffer_float, EXT_color_buffer_half_float, EXT_conservative_depth, EXT_depth_clamp, EXT_float_blend, EXT_polygon_offset_clamp, EXT_texture_compression_bptc, EXT_texture_compression_rgtc, EXT_texture_filter_anisotropic, EXT_texture_mirror_clamp_to_edge, EXT_texture_norm16, NV_shader_noperspective_interpolation, OES_draw_buffers_indexed, OES_sample_variables, OES_shader_multisample_interpolation, OES_texture_float_linear, OVR_multiview2, WEBGL_clip_cull_distance, WEBGL_compressed_texture_astc, WEBGL_compressed_texture_etc, WEBGL_compressed_texture_etc1, WEBGL_compressed_texture_s3tc, WEBGL_compressed_texture_s3tc_srgb, WEBGL_debug_renderer_info, WEBGL_debug_shaders, WEBGL_lose_context, WEBGL_multi_draw, WEBGL_polygon_mode, WEBGL_stencil_texturing
INFO: Initializing X3DCanvas for [x3dom-1747628673390-canvas]
WARNING: The width attribute is to be specified in pixels not in percent.
INFO: Inline X3D styles detected
INFO: Creating canvas for (X)3D element...
INFO: Found 5 X3D and nodes...
INFO: X3DOM version 1.8.1, Revison 0c742a1a981f8c0a9cbb7059f36c3a6c4cb9fec6, Date Fri Sep 27 18:22:15 2019 +0200
- FPS0.00
- ANIM0.00
- TRAVERSE0.10
- SORT0.00
- RENDER0.20
- DRAW0.20
- #NODES:2
- #SHAPES:1
- #DRAWS:1
- #POINTS:4
- #TRIS:2
- #ACTIVE0
- #TOTAL0
- #LOADED0
- #FAILED0
<Shape>
<Text string="Hallo Welt!" />
</Shape>
Die Schrift lässt sich auch formatieren:
<Shape>
<Text string="Hallo Welt!">
<FontStyle family="TYPEWRITER" style="BOLDITALIC" size="2">
</Text>
</Shape>
Hier wird die Schriftart TYPEWRITER ausgewählt und die Schrift fett (bold) und kursiv (italic) gemacht - auch wenn es nicht in jedem Browser funktioniert. Mit BOLD und ITALIC kann das auch jeweils einzeln gemacht werden.
Für Sonderzeichen gibt es Code, der an HTML erinnert: ' für ein ', " für ein '', & für ein & und \\ für ein \.