Skip to content

Instantly share code, notes, and snippets.

@andreasplesch

andreasplesch/x3dom_simple_opaque_with_transparency.html

Last active February 13, 2023 15:52
Show Gist options
  • Save andreasplesch/ee36e45ed9a3ffbea32ab9d3a0131270 to your computer and use it in GitHub Desktop.
Save andreasplesch/ee36e45ed9a3ffbea32ab9d3a0131270 to your computer and use it in GitHub Desktop.
Download ZIP
Transparency modes
Raw
x3dom_simple_opaque_with_transparency.html
<html>
<head>
<title>SIMPLE TRANSPARENCY ISSUE</title>
<script type='text/javascript' src='https://63ea5bdf9bdc170008f7b53e--x3dom.netlify.app/x3dom.debug.js'> </script>
<link rel='stylesheet' type='text/css' href='https://www.x3dom.org/download/x3dom.css'></link>
<style type="text/css">
html,body{height:100%;margin:0;padding:0}
x3d{
width:100%;
height:100%;
display:block;
overflow: hidden
}
</style>
</head>
<body>
<x3d>
<scene id="rootscene">
<Viewpoint description='Top View' position='0 10 0' orientation='1 0 0 -1.5708' DEF='Viewpoint1'>
</Viewpoint>
<Viewpoint description='Duplicates' position='0 0 10' DEF='Viewpoint2'>
</Viewpoint>
<Transform translation='0.5 0 0'>
<Shape>
<Appearance>
<DepthMode DEF='noDepth' enableDepthTest='false'></DepthMode>
<Material diffuseColor='1 0.1 0.1' specularColor='1 1 1' transparency="0.5">
</Material>
</Appearance>
<Sphere >
</Sphere>
</Shape>
</Transform>
<Transform translation='-0.5 0 0'>
<Shape>
<Appearance>
<DepthMode USE='noDepth'></DepthMode>
<Material diffuseColor='0.1 1 0.1' specularColor='1 1 1' transparency="0.5">
</Material>
</Appearance>
<Sphere >
</Sphere>
</Shape>
</Transform>
<Transform translation='0 0 -1'>
<Shape>
<Appearance>
<DepthMode USE='noDepth'></DepthMode>
<Material diffuseColor='0.1 0.1 1' specularColor='1 1 1' transparency="0.5">
</Material>
</Appearance>
<Sphere >
</Sphere>
</Shape>
</Transform>
<Transform translation='0 0 2'>
<Shape>
<Appearance DEF='pseudoOpaque'>
<Material diffuseColor='0.1 0.3 1' specularColor='1 1 1' transparency="0.01">
</Material>
</Appearance>
<Sphere >
</Sphere>
</Shape>
</Transform>
</scene>
</x3d>
</body>
</html>
Raw
x3dom_simple_realopaque_with_transparency.html
<html>
<head>
<title>SIMPLE TRANSPARENCY ISSUE</title>
<script type='text/javascript' src='https://www.x3dom.org/download/dev/x3dom.debug.js'> </script>
<link rel='stylesheet' type='text/css' href='https://www.x3dom.org/download/x3dom.css'></link>
<style type="text/css">
html,body{height:100%;margin:0;padding:0}
x3d{
width:100%;
height:100%;
display:block;
overflow: hidden
}
</style>
</head>
<body>
<x3d>
<scene id="rootscene">
<Viewpoint description='Top View' position='0 10 0' orientation='1 0 0 -1.5708' DEF='Viewpoint1'>
</Viewpoint>
<Viewpoint description='Duplicates' position='0 0 10' DEF='Viewpoint2'>
</Viewpoint>
<Transform translation='0.5 0 0'>
<Shape>
<Appearance>
<DepthMode DEF='noDepthWrite' readonly='true'></DepthMode>
<Material diffuseColor='1 0.1 0.1' specularColor='1 1 1' transparency="0.5">
</Material>
</Appearance>
<Sphere >
</Sphere>
</Shape>
</Transform>
<Transform translation='-0.5 0 0'>
<Shape>
<Appearance>
<DepthMode USE='noDepthWrite'></DepthMode>
<Material diffuseColor='0.1 1 0.1' specularColor='1 1 1' transparency="0.5">
</Material>
</Appearance>
<Sphere >
</Sphere>
</Shape>
</Transform>
<Transform translation='0 0 -1'>
<Shape>
<Appearance>
<DepthMode USE='noDepthWrite'></DepthMode>
<Material diffuseColor='0.1 0.1 1' specularColor='1 1 1' transparency="0.5">
</Material>
</Appearance>
<Sphere >
</Sphere>
</Shape>
</Transform>
<Transform translation='0 0 2'>
<Shape>
<Appearance DEF='realOpaque'>
<Material diffuseColor='0.1 0.3 1' specularColor='1 1 1'>
</Material>
</Appearance>
<Sphere >
</Sphere>
</Shape>
</Transform>
</scene>
</x3d>
</body>
</html>
Raw
x3dom_simple_transparency.html
<html>
<head>
<title>SIMPLE TRANSPARENCY ISSUE</title>
<script type='text/javascript' src='https://www.x3dom.org/download/dev/x3dom.debug.js'> </script>
<link rel='stylesheet' type='text/css' href='https://www.x3dom.org/download/x3dom.css'></link>
<style type="text/css">
html,body{height:100%;margin:0;padding:0}
x3d{
width:100%;
height:100%;
display:block;
overflow: hidden
}
</style>
</head>
<body>
<x3d>
<scene id="rootscene">
<Viewpoint description='Top View' position='0 10 0' orientation='1 0 0 -1.5708' DEF='Viewpoint1'>
</Viewpoint>
<Viewpoint description='Duplicates' position='0 0 10' DEF='Viewpoint2'>
</Viewpoint>
<Transform translation='0.5 0 0'>
<Shape>
<Appearance>
<DepthMode DEF='noDepth' enableDepthTest='false'></DepthMode>
<Material diffuseColor='1 0.1 0.1' specularColor='1 1 1' transparency="0.5">
</Material>
</Appearance>
<Sphere >
</Sphere>
</Shape>
</Transform>
<Transform translation='-0.5 0 0'>
<Shape>
<Appearance>
<DepthMode USE='noDepth'></DepthMode>
<Material diffuseColor='0.1 1 0.1' specularColor='1 1 1' transparency="0.5">
</Material>
</Appearance>
<Sphere >
</Sphere>
</Shape>
</Transform>
<Transform translation='0 0 -1'>
<Shape>
<Appearance>
<DepthMode USE='noDepth'></DepthMode>
<Material diffuseColor='0.1 0.1 1' specularColor='1 1 1' transparency="0.5">
</Material>
</Appearance>
<Sphere >
</Sphere>
</Shape>
</Transform>
</scene>
</x3d>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment