Facebook
Twitter
EmailFLAR Manager, Multi Marker Multi Collada
25 Apr 2010 3 Comments
in College, Tips Tags: 3D, 3D Studio, AR Toolkit, Augmented Reality, FLARManager, Marker
Marker
I ve been toying around with Augmented Reality a lot lately. I came across FLARManager which is the easiest way to implement AR. Somehow i haven’t found any code out there till now that displays multiple collada files on multiple markers. So, here is my implementation of the concept.
package {
import com.transmote.flar.FLARManager;
import com.transmote.flar.marker.FLARMarker;import com.transmote.flar.marker.FLARMarkerEvent;
import com.transmote.flar.utils.geom.FLARPVGeomUtils;
import flash.display.Sprite;
import flash.events.Event;
import org.libspark.flartoolkit.support.pv3d.FLARCamera3D;
import org.papervision3d.lights.PointLight3D;
import org.papervision3d.objects.DisplayObject3D;
import org.papervision3d.objects.parsers.DAE;import org.papervision3d.render.LazyRenderEngine;
import org.papervision3d.scenes.Scene3D;
import org.papervision3d.view.Viewport3D;
public class MultiMarkerMultiDae extends Sprite {
private var flarManager:FLARManager;
private var scene3D:Scene3D;
private var camera3D:FLARCamera3D;
private var viewport3D:Viewport3D;
private var renderEngine:LazyRenderEngine;
private var pointLight3D:PointLight3D;
private var activeMarker1:FLARMarker;
private var activeMarker2:FLARMarker;
private var activeMarker3:FLARMarker;
private var activeMarker:FLARMarker;
private var modelContainer:DisplayObject3D;
private var modelContainer1:DisplayObject3D;
private var modelContainer3:DisplayObject3D;
private var markerId:int;
public function MultiMarkerMultiDae ()
{
// pass the path to the FLARManager xml config file into the FLARManager constructor.
// FLARManager creates and uses a FLARCameraSource by default.
// the image from the first detected camera will be used for marker detection.
this.flarManager = new FLARManager("flar/flarConfig.xml");
// add FLARManager.flarSource to the display list to display the video capture.
this.addChild(Sprite(this.flarManager.flarSource));
// begin listening for FLARMarkerEvents.
this.flarManager.addEventListener(FLARMarkerEvent.MARKER_ADDED, this.onMarkerAdded);
this.flarManager.addEventListener(FLARMarkerEvent.MARKER_UPDATED, this.onMarkerUpdated);
this.flarManager.addEventListener(FLARMarkerEvent.MARKER_REMOVED, this.onMarkerRemoved);
// wait for FLARManager to initialize before setting up Papervision3D environment.
this.flarManager.addEventListener(Event.INIT, this.onFlarManagerInited);
}
private function onFlarManagerInited (evt:Event) :void
{
this.flarManager.removeEventListener(Event.INIT, this.onFlarManagerInited);
this.scene3D = new Scene3D();
// initialize FLARCamera3D with parsed camera parameters.
this.camera3D = new FLARCamera3D(this.flarManager.cameraParams);
this.viewport3D = new Viewport3D(this.stage.stageWidth, this.stage.stageHeight);
this.addChild(this.viewport3D);
this.renderEngine = new LazyRenderEngine(this.scene3D, this.camera3D, this.viewport3D);
this.pointLight3D = new PointLight3D();
this.pointLight3D.x = 1000;
this.pointLight3D.y = 1000;
this.pointLight3D.z = -1000;
// load the model.
// (this model has to be scaled and rotated to fit the marker; every model is different.)
var model1:DAE = new DAE(true, "model1", true);
model1.load("assets/model4.dae");
model1.rotationX = 0;
model1.rotationY = 0;
model1.rotationZ = 0;
model1.scale = 10;
// load the model.
// (this model has to be scaled and rotated to fit the marker; every model is different.)
var model2:DAE = new DAE(true, "model2", true);
model2.load("assets/model4.dae");
trace("model4 loaded");
model2.rotationX = 0;
model2.rotationY= 0;
model2.rotationZ = 0;
model2.scale = 10;
// load the model.
// (this model has to be scaled and rotated to fit the marker; every model is different.)
var model3:DAE = new DAE(true, "model3", true);
model3.load("assets/model4.dae");
model3.rotationX = 0;
model3.rotationY= 0;
model3.rotationZ = 0;
model3.scale = 10;
// // create a container for the model, that will accept matrix transformations.
// create a container for the model, that will accept matrix transformations.
this.modelContainer = new DisplayObject3D();
this.modelContainer.addChild(model1);
this.modelContainer.visible = false;
this.scene3D.addChild(this.modelContainer);
this.modelContainer1 = new DisplayObject3D();
this.modelContainer1.addChild(model2);
this.modelContainer1.visible = false;
this.scene3D.addChild(this.modelContainer1);
this.modelContainer3 = new DisplayObject3D();
this.modelContainer3.addChild(model3);
this.modelContainer3.visible = false;
this.scene3D.addChild(this.modelContainer3);
//------------------------------------------------------------------------- ---------
this.addEventListener(Event.ENTER_FRAME, this.onEnterFrame);
}
private function onMarkerAdded (evt:FLARMarkerEvent) :void
{
trace("["+evt.marker.patternId+"] added");
if(evt.marker.patternId == 1)
{
trace("Pattern 1 Added");
markerAdded(1);
this.activeMarker1 = evt.marker;
}
if(evt.marker.patternId == 2)
{
trace("Pattern 2 Added");
markerAdded(2);
this.activeMarker2 = evt.marker;
}
if(evt.marker.patternId == 3)
{
trace("Pattern 3 Added");
markerAdded(3);
this.activeMarker3 = evt.marker;
}
this.activeMarker = evt.marker;
}
private function onMarkerUpdated (evt:FLARMarkerEvent) :void
{
trace("["+evt.marker.patternId+"] updated");
if(evt.marker.patternId == 1)
{
trace("Pattern 1 Updated");
markerAdded(1);
this.activeMarker1 = evt.marker;
}
if(evt.marker.patternId == 2)
{
trace("Pattern 2 Updated");
markerAdded(2);
this.activeMarker2 = evt.marker;
}
if(evt.marker.patternId == 3)
{
trace("Pattern 3 Updated");
markerAdded(3);
this.activeMarker3 = evt.marker;
}
}
private function onMarkerRemoved (evt:FLARMarkerEvent) :void {
trace("["+evt.marker.patternId+"] removed");
if(evt.marker.patternId == 1)
{
trace("Pattern 1 Removed");
markerRemoved(1);
}
if(evt.marker.patternId == 2)
{
trace("Pattern 2 Removed");
markerRemoved(2);
}
if(evt.marker.patternId == 3)
{
trace("Pattern 3 Removed");
markerRemoved(3);
}
this.activeMarker = null;
this.activeMarker1 = null;
this.activeMarker2 = null;
this.activeMarker3 = null;
}
private function onEnterFrame (evt:Event) :void {
// apply the FLARToolkit transformation matrix to the Cube.
if (this.activeMarker) {
this.modelContainer.transform = FLARPVGeomUtils.convertFLARMatrixToPVMatrix(this.activeMarker.transformMatrix);
}
if (this.activeMarker1) {
this.modelContainer.transform = FLARPVGeomUtils.convertFLARMatrixToPVMatrix(this.activeMarker1.transformMatrix);
}
if (this.activeMarker2) {
this.modelContainer1.transform = FLARPVGeomUtils.convertFLARMatrixToPVMatrix(this.activeMarker2.transformMatrix);
}
if (this.activeMarker3) {
this.modelContainer3.transform = FLARPVGeomUtils.convertFLARMatrixToPVMatrix(this.activeMarker3.transformMatrix);
}
// // apply the FLARToolkit transformation matrix to the Cube.
this.renderEngine.render();
}
//EVENTS FOR ADDED MARKER
private function markerAdded(markerId:int):void
{
trace(markerId);
var x:int = markerId;
switch(x)
{
case 1:
{
trace("1 Yeah");
if(modelContainer1.visible==false)
{
modelContainer1.visible=true;
break;
}
else
break;
}
case 2:
{
if(modelContainer.visible==false)
{
modelContainer.visible=true;
break;
}
else
break;
}
case 3:
{
trace("1 Yeah");
if(modelContainer3.visible==false)
{
modelContainer3.visible=true;
break;
}
else
break;
}
}
}
private function markerRemoved(markerId:int):void
{
var x:int = markerId;
switch(x)
{
case 1:
{
if(modelContainer1.visible==true)
{
modelContainer1.visible=false;
break;
}
else
break;
}
case 2:
{
if(modelContainer.visible==true)
{
modelContainer.visible=false;
break;
}
else
{
break;
}
}
case 3:
{
if(modelContainer3.visible==true)
{
modelContainer3.visible=false;
break;
}
else
break;
}
}
}
}
}Just link back to me if you use this code. Here is the example of how the code works. Download the marker here.
If it does not load, click here.
