Learn first example of X3DOM

07 May 2020 - viridi - Sparisoma Viridi

Following result is obtained based on this tutorial.

using this code

<x3d width='200px' height='200px'> 
	<scene> 
		<transform translation='0 0 7'>
			<shape> 
			 <appearance> 
				 <material diffuseColor='0 0.5 1'></material> 
			 </appearance> 
			 <sphere></sphere> 
			</shape> 
		</transform> 
	</scene> 
</x3d> 

It can be also

using this one

<script>
	var x3d = document.createElement("x3d");
	var scene = document.createElement("scene");
	var transform = document.createElement("transform");
	var shape = document.createElement("shape");
	var appearance = document.createElement("appearance");
	var material = document.createElement("material");
	var sphere = document.createElement("sphere");
	
	x3d.setAttribute("width","200px");
	x3d.setAttribute("height", "200px");
	transform.setAttribute("translation", "0 0 7");
	material.setAttribute("diffuseColor", "0 0.5 1");
	
	document.body.append(x3d);
	x3d.append(scene);
	scene.append(transform);
	transform.append(shape);
	shape.append(appearance);
	appearance.append(material);
	shape.append(sphere);
</script>

For integration with pText, the second approach is better, since some codes can be hidden in some functions.