Saya sedang mencoba belajar tentang AR. Library yang saya coba pertama kali adalah ARToolKit. Tutorial ARToolKit yang cukup lengkap untuk pemula dapat ditemukan di sini. Tetapi melihat keterbatasan dari ARToolKit dan pengembangannya, akhirnya saya mencari-cari lib lain yang dapat saya pelajari. Akhirnya saya menemukan FLARToolKit.
Selanjutnya saya mulai mempelajari FLARManager, framework yang di dalamnya telah ada lib untuk tracking sekaligus ada 3D framework. FLARManager mendukung FLARToolKit sebagai tracking lib dan beberapa 3D framework untuk rendering model 3D yang ingin saya tampilkan.
Alat yang saya gunakan adalah:
- FlashDevelop sebagai IDE
- Adobe Flex sebagai compiler
- FLARManager sebagai framework untuk AR
Pada awalnya saya menggunakan source code yang saya dapatkan mentah-mentah, namun hasilnya tidak memuaskan. Warna dasar dari collada yang saya gunakan tidak dapat ditampilkan dengan baik. Solusinya harus membuat tekstur material untuk ditempelkan di collada.
Teman saya menganjurkan untuk menggunakan method load() yang dimiliki class DAE. Tetapi masalahnya, class DAE adalah milik Papervision (PV3D), sementara source code menggunakan Away3D. Setelah berpusing ria memodifikasi kode MultiMarkerMultiCollada.as yang awalnya menggunakan Away3D, untuk diubah menjadi menggunakan Papervison, akhirnya saya menyerah.
Saya mencoba solusi lain:
Di dalam folder Example dari FLARManager, ada contoh kode yang digunakan untuk papervision, yaitu FLARManagerTutorial_Collada_PV3D.as. Saya mencoba memodifikasi kode di dalamnya, yang awalnya hanya untuk 1 marker menjadi multimarker, menggunakan acuan kode di dalam MultiMarkerMultiCollada.as, dan berhasil... Akhirnya saya bisa menampilkan multi collada menggunakan multi marker dengan PaperVision.
Kode hasil modifikasi saya mirip dengan yang ada di lOOney dOOdle. Karena MultiMarkerMultiCollada.as yang saya jadikan acuan adalah hasil modifikasi dari kode lOOney dOOdle.
Kuncinya ada di fungsi-fungsi berikut:
private function onMarkerAdded (evt:FLARMarkerEvent) :void
{
trace("["+evt.marker.patternId+"] added");
//this.modelContainer.visible = true;
//this.activeMarker = evt.marker;
if (evt.marker.patternId == 0) {
markerAdded(0);
this.activeMarker = evt.marker;
}
if (evt.marker.patternId == 1) {
markerAdded(1);
this.activeMarker1 = evt.marker;
}
if (evt.marker.patternId == 2) {
markerAdded(2);
this.activeMarker2 = evt.marker;
}
}
private function onMarkerUpdated (evt:FLARMarkerEvent) :void
{
trace("["+evt.marker.patternId+"] updated");
//this.modelContainer.visible = true;
//this.activeMarker = evt.marker;
if (evt.marker.patternId == 0) {
markerAdded(0);
this.activeMarker = evt.marker;
}
if (evt.marker.patternId == 1) {
markerAdded(1);
this.activeMarker1 = evt.marker;
}
if (evt.marker.patternId == 2) {
markerAdded(2);
this.activeMarker2 = evt.marker;
}
}
private function onMarkerRemoved (evt:FLARMarkerEvent) :void
{
trace("["+evt.marker.patternId+"] removed");
//this.modelContainer.visible = false;
//this.activeMarker = null;
if (evt.marker.patternId == 0) {
markerRemoved(0);
}
if (evt.marker.patternId == 1) {
markerRemoved(1);
}
if (evt.marker.patternId == 2) {
markerRemoved(2);
}
this.activeMarker = null;
this.activeMarker1 = null;
this.activeMarker2 = null;
}
private function onEnterFrame (evt:Event) :void {
// apply the FLARToolkit transformation matrix to the Cube.
if (this.activeMarker) {
this.modelContainer.transform = PVGeomUtils.convertMatrixToPVMatrix(this.activeMarker.transformMatrix);
}
if (this.activeMarker1) {
this.modelContainer1.transform = PVGeomUtils.convertMatrixToPVMatrix(this.activeMarker1.transformMatrix);
}
if (this.activeMarker2) {
this.modelContainer2.transform = PVGeomUtils.convertMatrixToPVMatrix(this.activeMarker2.transformMatrix);
}
// update the Papervision3D view.
this.renderEngine.render();
}
private function markerAdded(markerId:int):void
{
switch(markerId) {
case 0: {
if (modelContainer.visible == false) {
modelContainer.visible = true;
break;
} else {
break;
}
}
case 1: {
if (modelContainer1.visible == false) {
modelContainer1.visible = true;
break;
} else {
break;
}
}
case 2: {
if (modelContainer2.visible == false) {
modelContainer2.visible = true;
break;
} else {
break;
}
}
}
}
private function markerRemoved(markerId:int):void
{
switch(markerId) {
case 0: {
if (modelContainer.visible == true) {
modelContainer.visible = false;
break;
} else {
break;
}
}
case 1: {
if (modelContainer1.visible == true) {
modelContainer1.visible = false;
break;
} else {
break;
}
}
case 2: {
if (modelContainer2.visible == true) {
modelContainer2.visible = false;
break;
} else {
break;
}
}
}
}
File collada yang saya gunakan sebagai contoh saya dapatkan dari internet, untuk objek mario saya masih menggunakan contoh collada dari sini
Thanks to: Phat Cool atas sharing ilmunya
Tlong diperjelas dong tutorialnya,. step-Bystep
BalasHapuskalo bisa dikasih skrensot jg,.
masih bingung,. maklum newbie
om, itu load DAE nya gmn ya?? kok gw unknown asset type terus ya??? pake kek gini ni load modelnya
BalasHapus[Embed(source="../resources/assets/assets/models/earthlg.dae", mimeType="application/octet-stream")]
private var earth:Class;
var model:DAE = new DAE();
model.load(earth);
kok g bisa di load ya model nya?? itu knp?? -___-
kalo pke PV3D colladanya lebih jelas ya?
BalasHapusMas, Bisa diupload file lengkapnya . .yang udah diGanti dari Away3D jadi Papervision3D . .
BalasHapusTerima kasih . .