|
From: <ma...@us...> - 2011-12-09 21:09:00
|
Revision: 561
http://openautomation.svn.sourceforge.net/openautomation/?rev=561&view=rev
Author: mayerch
Date: 2011-12-09 21:08:54 +0000 (Fri, 09 Dec 2011)
Log Message:
-----------
Add check boxes to show nodes and/or wall lines
Modified Paths:
--------------
JSFloorPlan/trunk/index.html
JSFloorPlan/trunk/jsfloorplan.js
JSFloorPlan/trunk/jsfloorplan_example_helper.js
Modified: JSFloorPlan/trunk/index.html
===================================================================
--- JSFloorPlan/trunk/index.html 2011-12-09 17:28:37 UTC (rev 560)
+++ JSFloorPlan/trunk/index.html 2011-12-09 21:08:54 UTC (rev 561)
@@ -83,6 +83,17 @@
</tr>
<tr>
<td>
+ Zeige Nodes: <input type="checkbox" name="showNodes" />
+ </td><td>
+ Zeige Walls: <input type="checkbox" name="showWallLines" />
+ </td><td>
+ </td><td>
+ </td><td>
+ </td><td>
+ </td>
+ </tr>
+ <tr>
+ <td>
Transparenz: <select size="1" name="fillOpacity">
<option value="0.1">0.1 - sehr transparent</option>
<option value="0.2">0.2</option>
Modified: JSFloorPlan/trunk/jsfloorplan.js
===================================================================
--- JSFloorPlan/trunk/jsfloorplan.js 2011-12-09 17:28:37 UTC (rev 560)
+++ JSFloorPlan/trunk/jsfloorplan.js 2011-12-09 21:08:54 UTC (rev 561)
@@ -77,7 +77,6 @@
$.get('floorplan01.xml', parseXMLFloorPlan, 'xml');
}
var floor;
-var floorCount = -1;
// this array will contain all vertices to show in the svg
var vertices = Array();
@@ -85,7 +84,7 @@
// the corresponding vertices
var lines = Array();
// infos about the building
-var buildingProperties = new Object;
+var buildingProperties = { floor: [], Object3D: new THREE.Object3D() };
var imageCenter = new Object;
var noFloorplan = true;
@@ -93,6 +92,9 @@
{
noFloorplan = false;
+ var floorCount = -1;
+ var heightOfGround = 0; // the base level of the current floor
+
// basic check if the document seems right
// this could be avoided if the XML file would be validated
// with a DTD
@@ -120,9 +122,16 @@
return alert( "ERROR: Not a valid floor plan! " +
"Expected: 'floor', found '" + floor.tagName + "'" );
+ floorCount++;
+ buildingProperties.floor[floorCount] = {};
+
var floorName = floor.getAttribute('name');
+ buildingProperties.floor[floorCount].name = floorName;
+
var floorheight = floor.getAttribute('height');
- floorCount++;
+ buildingProperties.floor[floorCount].height = floorheight;
+ buildingProperties.floor[floorCount].heightOfGround = heightOfGround;
+
lines[floorCount] = new Array;
var floorWallsStart = floorWalls.length;
@@ -153,6 +162,9 @@
// accessable objects
// => derive the necessary information
+ // group all elements on this floor
+ var Object3D = new THREE.Object3D();
+
// add the information to each node to which nodes it's connected to
for( var j = floorWallsStart; j < floorWalls.length; j++ )
{
@@ -162,11 +174,19 @@
floorNodes[ floorWalls[j].start ].neighbour.push( j+1 );
floorNodes[ floorWalls[j].end ].neighbour.push( -j-1 );
}
+
+ var nodeGroup = new THREE.Object3D(); nodeGroup.name = 'nodeGroup';
for( var id in floorNodes )
{
// calculate the vectors showing to the neighbours
var vectors = new Array();
var start = floorNodes[id];
+
+ // show them on request as spheres
+ var sphere = new THREE.Mesh( new THREE.SphereGeometry(0.1, 4, 4), sphereMaterial);
+ sphere.position = new THREE.Vector3( start.x, start.y, heightOfGround );
+ nodeGroup.add(sphere);
+
for( var j=0; j<floorNodes[id].neighbour.length; j++ )
{
var vec = new Object;
@@ -247,10 +267,19 @@
vertices.push( vertex );
}
} // end for( var id in floorNodes )
+ Object3D.add( nodeGroup );
// show walls
+ var wallGroup = new THREE.Object3D(); wallGroup.name = 'wallGroup';
for( var j = floorWallsStart; j<floorWalls.length; j++ )
{
+ var vs = floorNodes[ floorWalls[j].start ];
+ var ve = floorNodes[ floorWalls[j].end ];
+ var lineGeo = new THREE.Geometry();
+ lineGeo.vertices.push( new THREE.Vertex( new THREE.Vector3( vs.x, vs.y, heightOfGround ) ) );
+ lineGeo.vertices.push( new THREE.Vertex( new THREE.Vector3( ve.x, ve.y, heightOfGround ) ) );
+ wallGroup.add( new THREE.Line( lineGeo, lineMaterial ) );
+
var s1 = vertices[ floorWalls[j].startVertex[0] ];
var e1 = vertices[ floorWalls[j].endVertex [0] ];
var s2 = vertices[ floorWalls[j].startVertex[1] ];
@@ -273,6 +302,14 @@
lines[floorCount].push( Array(floorWalls[j].startVertex[1],floorWalls[j].endVertex[1]) );
}
} // end for( j=0; j<floorWalls.length; j++ )
+ Object3D.add( wallGroup );
+
+ buildingProperties.floor[floorCount].Object3D = Object3D;
+ buildingProperties.floor[floorCount].nodeGroup = nodeGroup;
+ buildingProperties.floor[floorCount].wallGroup = wallGroup;
+ buildingProperties.Object3D.add( Object3D ); // add / link; note: we use that JavaScript is not copying objects but uses ref counting on them here!
+
+ heightOfGround += floorheight;
} // end floor
buildingProperties.x_center = (buildingProperties.x_max - buildingProperties.x_min) / 2;
@@ -410,6 +447,8 @@
if( noFloorplan ) return;
noSetup = false;
+ scene.add( buildingProperties.Object3D );
+
var showFloor = showStates.showFloor;
for( var i=0; i<lines[showFloor].length; )
@@ -515,6 +554,10 @@
var $container = $('#top_level');
// attach the render-supplied DOM element
$container.append(renderer.domElement);
+
+ // Init after the scene was set up
+ selectChange( 'showNodes' );
+ selectChange( 'showWallLines' );
}
function show3D( rotation, tilt )
Modified: JSFloorPlan/trunk/jsfloorplan_example_helper.js
===================================================================
--- JSFloorPlan/trunk/jsfloorplan_example_helper.js 2011-12-09 17:28:37 UTC (rev 560)
+++ JSFloorPlan/trunk/jsfloorplan_example_helper.js 2011-12-09 21:08:54 UTC (rev 561)
@@ -51,7 +51,7 @@
// create a WebGL renderer, camera
// and a scene
-var renderer = new THREE.WebGLRenderer();
+var renderer = new THREE.WebGLRenderer({antialias: true});
var camera = new THREE.PerspectiveCamera(
VIEW_ANGLE,
ASPECT,
@@ -113,6 +113,8 @@
cube.position = new THREE.Vector3(50,50,50);
//scene.add( cube );
+var lineMaterial = new THREE.LineBasicMaterial( { color: 0x0099ff, linewidth: 2 } );
+
// create a point light
var pointLight = new THREE.PointLight( 0xFFFFFF );
@@ -200,6 +202,7 @@
{
$('input').change(function(e){
showStates[ e.target.name ] = e.target.checked;
+ selectChange( e.target.name );
show3D( roll, tilt );
}).each(function(){
showStates[ this.name ] = this.checked; // init
@@ -215,6 +218,28 @@
createSlider();
}
+function selectChange( name )
+{
+ switch( name )
+ {
+ case 'showNodes':
+ $( buildingProperties.floor ).each( function(){
+ THREE.SceneUtils.traverseHierarchy( this.nodeGroup, function( object ) {
+ object.visible = showStates['showNodes'];
+ });
+ });
+ break;
+
+ case 'showWallLines':
+ $( buildingProperties.floor ).each( function(){
+ THREE.SceneUtils.traverseHierarchy( this.wallGroup, function( object ) {
+ object.visible = showStates['showWallLines'];
+ });
+ });
+ break;
+ }
+}
+
var toggle = false;
var animation;
function my_click()
This was sent by the SourceForge.net collaborative development platform, the world's largest Open Source development site.
|