FLARToolKit スタートガイド
必要なもの
・Adobe Flash CS3 以降
・FLARToolKit
・Papervision3D (rev.814 以降)
・Web カメラ
・印刷したマーカー & マーカーデータ
ダウンロード
めんどいので一式をまとめたものを置いときました。はい。
http://saqoosha.net/lab/FLARToolKit/FLARToolKit-starter-kit.zip
追記(2009/2/8 1:50):ぎゃー、マーカーの PDF 入れ忘れてた。いれといた & マーカーだけアップしたのでこれをお使いくだせい。
イントロダクション
Papervision3D が使える人なら非常に簡単。サンプルのメイン部分はほぼ Papervinios3D の設定だけ。使えない人もこのサンプルはめっちゃシンプルなので難しくない。大丈夫。
ただ、1 点だけ注意。座標系が Papervision3D とちょっと違います。Papervision3D でレンダリングするのでグローバル座標系はもちろん左手座標系なんだけど、マーカーにのっかるオブジェクトは↓の図みたいなかんじで、マーカーを正面に見たときに右手座標系になる。 上方向が +X、右方向が +Y、手前方向が +Z になる。(追記 2009/3/2:すいませんめっちゃ間違ってました、、、)

サンプルソースの解説
手順を追って書くほど難しくないのでソースを細かく解説。SimpleCube.as がメインで、その他のソースは特に見る必要ナッシング。なので SimpleCube.as を説明していきます。
17 行目
this.init('Data/camera_para.dat', 'Data/flarlogo.pat');
FLARToolKit を初期化します。第 1 引数にはカメラ補正ファイルへのパス、これは FLARToolKit に付属のものを指定しておけば OK。第 2 引数はマーカーのパターン定義ファイル、これは使用するマーカーに対応するパターン定義ファイルを指定。flarlogo.pat てのは flarlogo-marker.pdf 用。
20 行目
protected override function onInit():void {
init 呼んだあと、初期化が問題なく終わると最終的にこの関数が呼び出される。3D オブジェクトの設定はこの中ですればいい。パターンファイルが存在しなかったり Web カメラが接続されてないとこれが呼ばれるまでにエラーが出る。
24, 25 行目
var wmat:WireframeMaterial = new WireframeMaterial(0xff0000, 1, 2); this._plane = new Plane(wmat, 80, 80);
マーカーが正常に認識できているか確認しやすいように、マーカーと全く同じサイズの Plane を作ってみる。赤色、2px のライン。80 てのがマーカーのサイズ。80mm。
26 行目
this._plane.rotationX = 180;
さっき書いたように座標系が違うのでこっち向ける。
27 行目
this._baseNode.addChild(this._plane);
通常、Papervision3D では Scene3D に addChild しますが、FLARToolKit ではマーカーに追従して 3D オブジェクトを動かすために特別なノードに addChild する必要があります。それが _baseNode。これに addChild することで自動的にマーカーに追従して動くようになります。
36, 37 行目
var fmat:FlatShadeMaterial = new FlatShadeMaterial(light, 0xff22aa, 0x75104e); this._cube = new Cube(new MaterialsList({all: fmat}), 40, 40, 40);
マーカーの上に Cube をのっけてみます。ピンク色。サイズは 40mm x 40mm x 40mm。マーカーの半分のサイズ。
38 行目
this._cube.z = 20;
Cube は原点中心に作られるので、+Z 方向、つまりマーカー上方向に 20 移動させると、マーカーにちょうどのっかってるようになる。
動かしてみる
SimpleCube.fla を開いてパブリッシュすると Web カメラからの画像が表示されます。Web カメラつないでないとエラー出ます。つないでるのに絵が出ないってひとは右クリック→設定→カメラアイコン、で適当なカメラを選んでください。(MacBook とかの内蔵カメラは USB Video Class Video っていう名前になってます。)
印刷されたマーカー全体がカメラに写るようにするとオブジェクトが表示されます。マーカーにぴったりくっついてますね。ほら、簡単でしょう?
まとめ
サンプルを見てわかるようにマーカーに追従してオブジェクトを動かすってだけなら、Papervision3D でオブジェクトを作るコードを書くだけでできちゃうから、みんなも FLARToolKit はじめようー。みたいな。こんなんでいいすか?






2009/02/02 at 17:58:32
tks.that so cool.
2009/02/03 at 00:02:28
Thanks for giving us a whole new wonderful world!
2009/02/03 at 01:38:37
Thx. Very Cool…though I am having issues detecting the pattern. Is there anything specific I need to do in order to detect the printed marker? The capture is working so I can see the video, however, none of the PV3D objects are showing and it appears that pattern is not being detected. ( Latest Version of PV3D is installed ). Thanks in advance!
2009/02/03 at 02:03:35
Steve,
Is the room dark?
It’s very important to adjust the light. illumination.
Adjust the light to get better contrast for the marker.
2009/02/03 at 14:34:59
tks
2009/02/05 at 00:45:28
Thank you so much for your work and your sources man !
Keep the good work !
2009/02/05 at 03:12:50
Simply Amazing, good job.
2009/02/05 at 06:11:37
This is really great. What did you use to create the .PAT file? I can’t fine a utility to do it, and if I want to create different ones, I am not sure what process to go through. Thanks for your hard work!
2009/02/05 at 10:41:18
To create original .pat file, use this site.
http://flash.tarotaro.org/blog/2008/12/14/artoolkit-marker-generator-online-released/
He improved my marker generator AIR application.
http://saqoosha.net/2008/06/05/676/
2009/02/05 at 17:10:34
flarlogo-marker
2009/02/06 at 05:05:44
Downloaded latest svn version and it does not compile, there are typos in FLARVersion.as (displaced stuff) which is easy to fix
2009/02/06 at 06:00:41
Just cant make it work : ( Do you make your pattern and then write over the flarlogo.pat with it?????
2009/02/09 at 13:15:47
Really impressive! As of now, is it possible for different markers to represent different infomation?
2009/02/09 at 19:20:48
Hi,
what about away3D version of flartoolKit ?
2009/02/11 at 03:13:13
[...] 이것으로 3차원 공간의 카메라 위치를 계산하도록 한다. 소스코드와 사용법(Papervision 3D 예)이 공개되어 있다. 아래와 같이 만들어진 판을 들고 [...]
2009/02/11 at 23:55:10
it’s so cool!!
2009/02/17 at 16:50:44
Thanx man,
、最終的にポートをありがとうフラッシュ
(sorry for my(google’s translate service) bad japanese)
2009/02/18 at 07:56:00
thank you
It’s so great!!
I’ve changed the marker and it works.
But I don’t find how to change the 3d Object.
2009/02/20 at 01:20:00
Funtastic :)
2009/02/21 at 19:27:25
hi, thank you for this good stuff.
I have a quick question is that I want to change the cube’s height w/ a random number in a enterframe function but seems that cube only apply the large number and won’t transform to small again.
Thanks for ur help.
2009/02/22 at 00:48:11
thank you saqoosha for this cool kit.
Is it possible to use two different markers with two different 3d animations at same time?
2009/02/22 at 04:24:19
Thank you this is really great, I wanted to know if anyones knows how to create that hole animation on with the stating up guide.
email me at almog@almogdesign.net
2009/02/24 at 22:50:31
Hi, cannot download the starter kit, download keeps breaking off… can you please upload this starter kit to to mediafire or rapidshare? Thanks for the cool work, really looking forward to to using FLART :)
2009/03/03 at 02:49:25
inspiring..!!! thanks!
2009/03/05 at 19:12:09
I replaced the Flarlogo.pat with some other logo with same name.Its not working,should it work with any other pat file with different content but same name as in path?
2009/03/06 at 01:33:59
Could you explain how to display a different 3D object besides the primitive cube? I have looked through some of your other projects source code and you use a lot of .dae models but your .as files are not as simple as the ones in this start-up guide. Thanks.
2009/03/06 at 14:23:43
maybe someone can help me. i’ve got this all set up and compiling fine, and i can run other flartoolkit demos online just fine. when i build the demo, though, the marker just never seems to be detected. i just don’t see any change, except that memory goes up whenever there is ANY marker on the screen ( i guess system detecting a black square and trying to read it?) any thoughts? thanks so much.
drMikey
2009/03/08 at 01:09:22
Hi
this all looks realy great but im new here and want to ask if there is an complete howto for noobs like me?
would be realy nice because i realy want to learn something about this
2009/03/08 at 13:46:31
Hello! Nice tutorial !!
How i apply the ’smooth’ propertie to a bitmap texture ? give a code line of this please ?
thanks a lot!!
2009/03/09 at 21:20:59
非常感谢!希望能越做越好
2009/03/10 at 01:48:33
hey saqoosha!
first off — FLARToolkit is GREAT. so nice to have computer vision available in the browser!
i just finished up a small framework called FLARManager that makes using FLARToolkit simpler. you can find it here:
http://words.transmote.com/?p=10
it decouples FLARToolkit from Papervision3D, so you can use FLARToolkit for things totally non-pv3d related (though you can still use it with pv3d!); it can track multiple instances of multiple patterns; and a bunch of other good stuff.
please check it out!
2009/03/10 at 08:07:04
This is super cool if I can get it to work. Can you do a quick starting video? It would be very useful for people who likes to watch rather than read.
2009/03/11 at 00:46:12
Hi!!! very nice work!!!!! its amazing! I’m trying to play with the code ..and it is beautifull!!!!…just a question: there is a way to redirect the complete video(webcam + 3d objects) to external devices (like dv cam)just to record all the animation?..its possible????
thanks!!!
lellosan
2009/03/11 at 02:42:58
How do you make the model file ?, in the examples you use .DAT file format but the papervision works around .DAE what are the difference ?
pete
2009/03/11 at 20:30:29
1st of all great work, i have been playing around with the FLARToolkit for the last week. I have a question however, i am loading in a 3D scene, but it doesn’t align correctly with the marker, when i move the marker the projected scene doesn’t stick, the alignment looks way off. How do i make the scene stick to the marker?
If anyone has any suggestions i would really appreciate some advice/help.
2009/03/12 at 00:36:59
Really great work Saqoosha :o
Is there someone who tested with Sandy3D or others flash 3D engines instead of PV3D :x ?
2009/03/12 at 03:20:12
Great work, I’m loving it and so far all is working great. Only thing is I want to change the line
var fmat:FlatShadeMaterial = new FlatShadeMaterial(light, 0xff22aa, 0×75104e);
to something that will allow for a jpg file to be the texture instead of the flat color. I’ve tried numerous other ways but just can’t get it to work! Any help anyone! pls!
2009/03/14 at 19:29:51
hi, is customizable? i try to change a object but i need an hand to do it….so if i want to put a text ox another ed object from 3dstudio max how can i do? thanks a lot!!:)
2009/03/14 at 19:30:35
hi, is customizable? i try to change a object but i need an hand to do it….so if i want to put a text ox another 3d object from 3dstudio max how can i do? thanks a lot!!:)
2009/03/15 at 17:05:26
[...] 盾を装備しました。 おかげさまで防御力が20くらいアップしました。ありがとうございます。 盾って意外と思いのですね。 で、初FLARToolKitを触りました。 Saqoosha先生のFLARToolKit スタートガイドを熟読し、その記事中の一式ファイルをダウンロードしました。 [...]
2009/03/15 at 23:25:21
how i can change the objet? in this case is a cube if i would to put my 3dstudio object ? i export my 3dstudio in .DAE but i don’t know how i put this .dae!
2009/03/17 at 13:24:46
dino, you should check out flarmanager, it really makes hooking up models from different formats quite easy. also check out this post describing how to import multiple file formats to papervision.
http://marcpelland.com/2009/01/29/using-papervision-object-parsers
2009/03/17 at 19:38:03
hi, joe i’m not have more skills abput flartoolkit. could i see how i link the file .dae? in this flartoolkit starter file i added this function
protected override function onInit():void {
super.onInit();
var object:DAE = new DAE();
object.load(’some_collada_file.dae’);
_baseNode.addChild(object);
}
on the Simplecube.as, but doesn’t works….
2009/03/18 at 22:55:45
hi, we have an animation that’s working well, but it’s very sensitive to moving the marker. It there a way to set this type of sensitivity?
2009/03/20 at 02:49:40
anybody help me how i can export .dae file on ed studio max? i try to export but i can see only the poligon and not a texture…!! thanx
2009/03/20 at 02:49:55
anybody help me how i can export .dae file on 3d studio max? i try to export but i can see only the poligon and not a texture…!! thanx
2009/03/30 at 19:45:48
Hi, I’ve downloaded the files and published the .fla file without any changes, but nothing will load on the screen. The webcam is connected, and i did [right-click => setting => Camera] and the setting is correct, but it still just shows a blank black screen.
How can I get this to work?
2009/03/31 at 04:38:54
my flartoolkit works offline but when i try to publish online the swf doesn’t start…anybody can help me?
2009/04/01 at 06:38:56
My problem is that the swf will only run in the directory it is created in. Even moving everything to a new location fails. How can I put my project up on the web?
2009/04/01 at 21:59:44
Never mind. Newbie mistake on my part. It’s working fine now.
2009/04/03 at 06:05:26
great work guys…
need to trace something when the 3d object its on scene… any advise?
2009/04/08 at 22:09:06
Hi,
Congratulations for this great job;) I would like to know how can I
change the object? In this exemple is a pink cube, but if I want to put a 3D object? Wat do I have to do and how? thanks a lot:)
2009/04/09 at 15:35:43
[...] 使用指导(可惜是日文的):http://saqoosha.net/flartoolkit/start-up-guide/ 然后就有了下面的一些DEMO: [...]
2009/04/10 at 00:18:35
[...] よし、来年の年賀状これでいこ!ってできんのか?俺。。。 とりあえずSaqooshaさんのところから、、、 (0) [...]
2009/04/10 at 15:42:13
[...] 乗せると以下のようになります。 PV3DtoFLARToolkit 上 : -Z軸 下: +Z軸 右 : +Y軸 左 : -Y軸 正面 : -X軸 奥 : +X軸 座標関連はSaqoosha.net :: FLARToolKit スタートガイドを参考にさせていただいています。 [...]
2009/04/12 at 03:46:44
Hi! great article. now i’m trying to make “plane” with movie material. it works, but i dont know how to play animation in my movie only when marker is detected and pause when not detected. Please give some idea, please please please))
2009/04/14 at 21:52:28
Hi again,
Is it possible to load a SWF file or a FLV file into the FLAR application?! thanks a lot:)
2009/04/15 at 05:42:01
Hi Renata, I think it is possible, try making a texture in the library with a movieclip, and load the texture into your model in pv3d
2009/04/15 at 06:15:07
Nice I will try to do this, just in case works I will telt you know;)
But, how can I load a 3D animated (.md2 file format.) in the gihyo examples. thanks a lot again :)
2009/04/21 at 03:04:39
mike w, how did you worked that out? i also have the same problem
thanks :)
2009/04/21 at 03:48:23
Hi Dino,
Did you solve your problem? I’m having the exact same issue. The app works fine on my PC, but on my webserver the webcam security question doesn’t even pop-up..
Thanks!
2009/04/21 at 18:23:56
diogo, if you discover what the problem is please post it here, im also trying to figure how to take this thing online
2009/04/30 at 01:25:53
WOW! how can I get the the moment which the marker is recognized and my graphics appear on monitor?
2009/05/05 at 17:16:38
i wanna to know how can i add one more marker and 3D obj on a same stage.
thz a lot!
2009/05/10 at 09:17:16
col: 9 Error: Access of possibly undefined property useProjectionMatrix through a reference with static type org.libspark.flartoolkit.pv3d:FLARCamera3D.
this is the error msg I get…how can I fix it??? any ideas?
2009/05/15 at 03:17:04
Guys, when I compile .swf this error comes up:
TriangleMesh3D.as, Line 275
TriangleMesh3D.as, Line 276
TriangleMesh3D.as, Line 277
It’s urgen, can someone help me whit this .. publish setting is fine .. etc .. Don’t know were to look at it.
Thx.
2009/05/19 at 16:31:37
hi, is it possible to display a movieclip instead of a 3d object?
2009/05/19 at 23:41:44
lol
i`m afraid few questions get answered here.
I have some super simple questions.
how was this fla made? is there a link to the .as files that are in the folder?
I`m trying to understand the basics.
Once again, thanx saqoosha for the starter kit!
2009/05/20 at 22:40:28
Hello!! Does anyone have any coding for switching designs using a combo box? I keep getting error TypeError: Error #1010: A term is undefined and has no properties.
at MethodInfo-2194()
2009/05/25 at 19:03:03
Hi,
I’m sorry but my english is very bad,
i used for few days the FLARtoolkit to realised an Augmented Reality
project. It works very good but i would like to do a new thing. I
explain :
I would like to import a 3D object in my scene without the pattern and
an other 3D object with a pattern (AR) and if we move the 3D object
with his pattern the first 3D object get the direction, turn around
him, in the direction of the pattern, where i move my pattern.
I think i can use the function “get Direction()” like this :
firstobject.RotationY += detector.getDirection()
But my 3Dobject move in all direction but not in the direction of the
pattern.
So if you have an idea or a correction to my code or a new explain of
my project answer me.
Thanks.
2009/05/27 at 00:58:36
[...] FLARToolKit マーカーから物体が現れるんじゃなくて、マーカーの位置に物体を移動させたい。 (ご本人様による解説) その物体とは、BigDog! このアニメーションの方が時間がかかってい [...]
2009/06/02 at 23:23:37
Hey guys im trying to do this with a movie clip on a 3d cube, ive tried using a videostreammaterial and a standard bitmapdata, for the movie clip texture however both times the cube just doesnt render, i know its streaming the video as i get audio and i know the tracker works as a cube using flatshadematerial works
any ideas?
source code is visible at http://www.zombievsshark.co.uk/arvideo.txt
thanks in advance
2009/06/03 at 02:30:38
^^^ ignore this, was calling the papervision init before the video init, doh!
2009/06/05 at 12:51:55
Hey guys…..
has anyone figured out the issue with taking this online…..i seem to be having the same problem as Dino and Mike W. Any help would be great, cheers guys.
2009/06/06 at 06:02:54
Hey christian and all,
I’ve been working on this for the last semester of school and am unable to embed the flash video (.swf) in a webpage. I don’t know if it’s my html that’s the problem or what, but if you try to access the .swf directly it works great. I don’t know what the problem is there. For example instead of going to http://www.test.com/index.html you could go to http://www.test.com/ar/testAR.swf and it will load the video. I know this is long, but I’ve been working on getting multiple markers working and it doesn’t want to work if anyone is interested I can send some source code out there.
2009/06/09 at 00:38:41
hello plz can u help me to download flartoolkit?i can’t do it and i don’t know why! :(:(:( thnks a looooooot
2009/06/09 at 22:57:34
Hi,
I have a problem. I opened the flar toolkit starter and it works fine, then I tried to import .dae object, and I can load it but without the texture. I’m using Fl CS4 and blender to create dae. I don’t want to use material list. Is it possible to use different 3d software, that works with flar?
2009/06/13 at 00:43:02
Thank you to do an great effor on creating FLARTOOLKIT, it’s really help me to do my artwork! I’m come from Tiwan. And if I finish my work, I’ll share it to you! Thank you again!
2009/06/16 at 18:52:33
@ amish, I use 3DS max 9 with the Collada plugin and export to .DAE it works a treat just use an XML editor to correct your paths for your materials.
2009/06/17 at 02:03:48
@ Jamie, could you send me the code, and the object? I’ve tried with dae, and collada parsers and just don’t know why i can’t run it. I’ve downloaded few ready projects, but non of them worked with textures on my machine. alpuzyna(at)gmail(dot)com
2009/06/25 at 10:30:14
Hello, I have CS3 professional and I have tried tpo open the flartoolkit flash componet up but I keep getting an error. unexpected format when I try to open this file. Can some one tell me how to get this working. I need some assistance I am new to this.
2009/07/10 at 10:06:08
Thanks!!!!
2009/07/14 at 10:57:56
hello, i´m a brazillian programmer, i´m sorry but my english is poor… Can You help me? I need more explications about how create other forms with papervision3d and flartoolkit, or how i can to create this models in other program and export to the flartoolkit, thanks…
2009/07/20 at 17:09:36
Thnx for everything!!! But when i tried it on windows OS it worked perfectly, but when it was running on a Mac OS the camera stayed black. Is there something else i need to know?
2009/07/24 at 21:12:20
Hey
Thanks for sharing your works. Amazing..
I like to know the possibility of making the 3d Object interactive i added click even listener it works fine with papervision but not when implemented in FLAR Im using AS3/CS4
Any help fingers crossed
2009/08/19 at 17:14:26
Hi Saqoosha you did a good job here! ;)
My only problem here is that I can’t get the FLARToolkit files from the repository (I use tortoiseSVN). It is asking for username and password…how can I do?
kore wa yabai! boku o tasukete kudasai…;)
2009/09/08 at 22:40:51
how to add your own collada model, for us newbies..
scroll down the discussion part..
http://www.vimeo.com/3780791
2009/09/21 at 01:50:54
hi! how do you add more than 1 object?
my aim is to have 2 identical objects at the same time with 2 identical pattern images
2009/10/04 at 03:37:32
Hi! Very excited about FLARToolkit but I’m having the same issue mentioned above when I publish the .swf:
1067: Implicit coercion of a value of type org.papervision3d.core.geom.renderables:Vertex3D to an unrelated type org.papervision3d.core.geom:Vertex3D.
2009/10/04 at 06:06:06
My mistake. It turns out I had a 1.5 version in my class path. I simply went into preferences > actionscript > actionscript 3.0 settings to get rid of the file.
Off to make some interactive experiences! :)
Thanks.
2009/10/21 at 16:24:28
I want to change the cube by a sphere what to do could you response.
2009/10/23 at 23:11:47
[...] FLARToolKit スタートガイド|Saqoosha.net [...]
2009/10/25 at 14:58:05
Dear Saqoosha,
Your job is great.Can it Detect the natural marker?
2009/11/24 at 03:26:46
Thank you so much. Love this tutorial very much. This is a really good start for me to learn FlarToolkit.
2009/11/27 at 17:36:38
Thanks a lot man for sharing your knowledge with us. This world needs more people like you.
One
2009/12/01 at 21:32:51
Hey Everyone,
I’m using the startup files as a template. I’m having troubles importing a custom pattern. The only pattern it will recognise is saqoosha’s. I’m using the torataro generator? Any ideas?
Cheers,
2009/12/08 at 03:41:27
marker generator
2009/12/15 at 18:39:05
what should i do to include animated 3d model? just create loop animation .dae model?
2009/12/16 at 03:04:04
To get the examples working on the server you need to add the following mime types to your server:
.dae text/xml
.pat text/plain
.dat text/xml
Or you can simply change the .dae .pat .dat file extensions to xml. You will need to modify the file extensions in the code as well.
2009/12/21 at 01:03:48
[...] のFLARToolKit スタータキット [...]
2010/01/16 at 20:19:38
Hi,
This has made AR so simple.
Can you also help me in porting this to Nokia N97?
I tried to publish this to Flash lite as is, but it doesnt seem to work.
Would appreciate any help.
Thanks.
2010/01/26 at 23:59:44
[...] FLARToolKit スタートアップガイド [...]
2010/02/05 at 17:04:03
Hi everybody!
Could anyone please tell me that how should i place a model(3D Display object which does not associated with any marker) right after the last marker ?. I have tried x,y and z coordinates of last marker to map my model next to it but it does not help me. Please give me a solution as soon as possible. I have been dying for it last two days.
Note : I am using flar manager for multiple marker.