Upgrade to Pro — share decks privately, control downloads, hide ads and more …

A-Frameでお手軽WebAR

shinjism
July 30, 2017
Research
1
4.1k

 A-Frameでお手軽WebAR

2017.7.22 ARコンテンツ作成勉強会 #AR_Fukuoka のハンズオン資料
2017.8.30 JSライブラリのアップデートに伴い資料を更新

shinjism

July 30, 2017
Tweet

More Decks by shinjism

See All by shinjism
OpenCVでつくろうARスタンプアプリ for iOS
shinjism
0
130
ARコンテンツ作成勉強会：VuforiaでつくるスマホAR+VRアプリ
shinjism
0
720
個人的にお気に入りのVuforia公式サンプル #AR_Fukuoka
shinjism
0
93
日本語でおk？
shinjism
0
220

Other Decks in Research

See All in Research
Introducing Research Units of Matsuo-Iwasawa Laboratory
matsuolab
0
1.4k
論文読み会 KDD2024 | Relevance meets Diversity: A User-Centric Framework for Knowledge Exploration through Recommendations
cocomoff
0
120
データサイエンティストをめぐる環境の違い 2024年版〈一般ビジネスパーソン調査の国際比較〉
datascientistsociety
PRO
0
820
ニュースメディアにおける事前学習済みモデルの可能性と課題 / IBIS2024
upura
3
700
Composed image retrieval for remote sensing

satai
2
130
文化が形作る音楽推薦の消費と、その逆
kuri8ive
0
210
20240918 交通くまもとーく 未来の鉄道網編（太田恒平）
trafficbrain
0
380
第79回 産総研人工知能セミナー 発表資料
agiats
2
180
The Fellowship of Trust in AI
tomzimmermann
0
160
テキストマイニングことはじめー基本的な考え方からメディアディスコース研究への応用まで
langstat
1
150
言語と数理の交差点：テキストの埋め込みと構造のモデル化 (IBIS 2024 チュートリアル)
yukiar
4
940
Weekly AI Agents News! 10月号 論文のアーカイブ
masatoto
1
410

Featured

See All Featured
The World Runs on Bad Software
bkeepers
PRO
66
11k
Rails Girls Zürich Keynote
gr2m
94
13k
How to Think Like a Performance Engineer
csswizardry
22
1.2k
Code Review Best Practice
trishagee
65
17k
Designing Experiences People Love
moore
138
23k
Large-scale JavaScript Application Architecture
addyosmani
510
110k
A better future with KSS
kneath
238
17k
Why Our Code Smells
bkeepers
PRO
335
57k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
49k
Why You Should Never Use an ORM
jnunemaker
PRO
54
9.1k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
8
1.2k
Build your cross-platform service in a week with App Engine
jlugia
229
18k

Transcript

  1. "'SBNFͰ͓खܰ8FC"3 "3ίϯςϯπ࡞੒ษڧձ "3@'VLVPLB

  2. ᶄ $MPOFPSEPXOMPBEΛΫϦοΫ ᶃ Լه63-ʹΞΫηε IUUQTHJUIVCDPNTIJOKJTN8FC"34BNQMF ᶅ %PXOMPBE;*1ΛΫϦοΫͯ͠μ΢ϯ ϩʔυͨ͠;*1ϑΝΠϧΛσεΫτοϓͳ Ͳͷ෼͔Γ΍͍͢৔ॴʹల։ ͸͡Ίʹ

    d͜ͷࢿྉͰ࢖༻͢Δσʔλͷμ΢ϯϩʔυ d

  3. • 1$͔ΒΞΫηε 1$಺ଂ PS64#઀ଓͷ8FCΧϝϥ͕ඞཁ https://arjs-sample.glitch.me/ • εϚʔτϑΥϯ͔ΒΞΫηε ݱࡏɺҰ෦"OESPJEͷΈӾཡՄ ͪ͜Βͷ23ίʔυ͔Βˠ ࠓ೔ͷςʔϚ

    d׬੒ΠϝʔδΛମݧ͢Δ d

  4. ࠓ೔ͷςʔϚ d׬੒ΠϝʔδΛମݧ͢Δ d • 8FCΧϝϥ͕ىಈͨ͠Βӈͷ ϚʔΧʔʹ͔͟͢ • ίϯςϯπ͕දࣔ͞ΕͨΒ஍ٿ ·ͨ͸μοΫΛΫϦοΫ͢Δ ˰

    ஍ٿͱμοΫ͕ճస • ಉ͘͡"3@'VLVPLBͷจࣈΛ ΫϦοΫ͢Δ ˰ 8FCϖʔδ͕։͘

  5. ໨࣍ d"'SBNFͷ֓ཁͱ։ൃ४උ d • ඞཁͳ΋ͷΛ֬ೝ͠Α͏ • "'SBNFͬͯͳʹʁ • ։ൃͷ४උΛ͠Α͏ •

    ͓͓͖͍͑ͯͨ͞ϙΠϯτ • ٿମΛදࣔ͠Α͏ • ը૾ΛషΓ෇͚Α͏ • %ϞσϧΛදࣔ͠Α͏ • ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ • ΠϯλϥΫγϣϯΛ͚ͭΑ͏ • "3ۭؒʹදࣔ͠Α͏ • %ςΩετΛදࣔ͠Α͏ • +BWB4DSJQUͰΠϯλϥΫγϣϯ

  6. ໨࣍ d73ฤ d • ඞཁͳ΋ͷΛ֬ೝ͠Α͏ • "'SBNFͬͯͳʹʁ • ։ൃͷ४උΛ͠Α͏ •

    ͓͓͖͍͑ͯͨ͞ϙΠϯτ • ٿମΛදࣔ͠Α͏ • ը૾ΛషΓ෇͚Α͏ • %ϞσϧΛදࣔ͠Α͏ • ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ • ΠϯλϥΫγϣϯΛ͚ͭΑ͏ • "3ۭؒʹදࣔ͠Α͏ • %ςΩετΛදࣔ͠Α͏ • +BWB4DSJQUͰΠϯλϥΫγϣϯ

  7. ໨࣍ d73ฤ d • ඞཁͳ΋ͷΛ֬ೝ͠Α͏ • "'SBNFͬͯͳʹʁ • ։ൃͷ४උΛ͠Α͏ •

    ͓͓͖͍͑ͯͨ͞ϙΠϯτ • ٿମΛදࣔ͠Α͏ • ը૾ΛషΓ෇͚Α͏ • %ϞσϧΛදࣔ͠Α͏ • ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ • ΠϯλϥΫγϣϯΛ͚ͭΑ͏ • "3ۭؒʹදࣔ͠Α͏ • %ςΩετΛදࣔ͠Α͏ • +BWB4DSJQUͰΠϯλϥΫγϣϯ

  8. ໨࣍ d73ฤ d • ඞཁͳ΋ͷΛ֬ೝ͠Α͏ • "'SBNFͬͯͳʹʁ • ։ൃͷ४උΛ͠Α͏ •

    ͓͓͖͍͑ͯͨ͞ϙΠϯτ • ٿମΛදࣔ͠Α͏ • ը૾ΛషΓ෇͚Α͏ • %ϞσϧΛදࣔ͠Α͏ • ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ • ΠϯλϥΫγϣϯΛ͚ͭΑ͏ • "3ۭؒʹදࣔ͠Α͏ • %ςΩετΛදࣔ͠Α͏ • +BWB4DSJQUͰΠϯλϥΫγϣϯ

  9. ໨࣍ d73ฤ d • ඞཁͳ΋ͷΛ֬ೝ͠Α͏ • "'SBNFͬͯͳʹʁ • ։ൃͷ४උΛ͠Α͏ •

    ͓͓͖͍͑ͯͨ͞ϙΠϯτ • ٿମΛදࣔ͠Α͏ • ը૾ΛషΓ෇͚Α͏ • %ϞσϧΛදࣔ͠Α͏ • ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ • ΠϯλϥΫγϣϯΛ͚ͭΑ͏ • "3ۭؒʹදࣔ͠Α͏ • %ςΩετΛදࣔ͠Α͏ • +BWB4DSJQUͰΠϯλϥΫγϣϯ

  10. ໨࣍ d"3ฤ d • ඞཁͳ΋ͷΛ֬ೝ͠Α͏ • "'SBNFͬͯͳʹʁ • ։ൃͷ४උΛ͠Α͏ •

    ͓͓͖͍͑ͯͨ͞ϙΠϯτ • ٿମΛදࣔ͠Α͏ • ը૾ΛషΓ෇͚Α͏ • %ϞσϧΛදࣔ͠Α͏ • ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ • ΠϯλϥΫγϣϯΛ͚ͭΑ͏ • "3ۭؒʹදࣔ͠Α͏ • %ςΩετΛදࣔ͠Α͏ • +BWB4DSJQUͰΠϯλϥΫγϣϯ

  11. ඞཁͳ΋ͷΛ֬ೝ͠Α͏ ඞਢͷ΋ͷ • ϊʔτ1$ 8JO.BDͲͪΒͰ΋ • 8FCΧϝϥ 1$౥ࡌ·ͨ͸64#઀ଓ • 8FC73Λαϙʔτͨ͠8FCϒϥ΢β

    • 'JSFGPY IUUQTXXXNP[JMMBPSHKBGJSFGPYOFX • (PPHMF$ISPNF IUUQTXXXHPPHMFDPKQDISPNFCSPXTFSEFTLUPQJOEFYIUNM • )5.-΍ςΩετΛฤू͢ΔΤσΟλ • 'BDFCPPL·ͨ͸(JUIVCͷΞΧ΢ϯτ ͋Δͱخ͍͠΋ͷ • "OESPJE୺຤

  12. "'SBNFͬͯͳʹʁ

  13. "'SBNFͬͯͳʹʁ d"'SBNFͷ֓ཁ d • 8FCϒϥ΢β্Ͱಈ࡞͢Δ73ίϯςϯπ ͕खܰʹ࡞੒Ͱ͖ΔΦʔϓϯιʔεϑϨʔ ϜϫʔΫɻ • 8FC73ͱ͍͏࢓༷ʹج͖ͮɺ8FCٕज़ )5.-ͱ+BWB4DSJQU

    Ͱ73ίϯςϯπΛ ࡞੒ɻ • ಛผͳπʔϧ౳͸ෆཁɻ࠷௿Ͱ΋ςΩετ ΤσΟλͱ8FC73ରԠͷ8FCϒϥ΢β 'JSFGPY(PPHMF$ISPNF౳ ͕͋Ε͹Մɻ • )5$7JWFɺ0DVMVT3JGUͳͲଟ਺ͷ73 ϔουηοτΛαϙʔτɻ • ଞʹ΋1$͸΋ͪΖΜɺJ04΍"OESPJEͰ΋ 73ίϯςϯπͷମݧ͕Մೳɻ

  14. "'SBNFͬͯͳʹʁ d"'SBNFΛମݧͯ͠ΈΑ͏ d ᶃ "'SBNFͰݕࡧɺ·ͨ͸ɺ௚઀ IUUQTBGSBNFJPʹΞΫηε ᶄ )FMMP8FC73ΛΫϦοΫ

  15. "'SBNFͬͯͳʹʁ d"'SBNFΛମݧͯ͠ΈΑ͏ d υϥοάͰࢹ఺͕มΘΔɻ ্ԼࠨӈΩʔͰલޙࠨӈ ʹҠಈɻ શը໘දࣔ

  16. "'SBNFͬͯͳʹʁ d"'SBNFΛମݧͯ͠ΈΑ͏ d &YBNQMFTͷத͔Β ͍Ζ͍ΖΫϦοΫମݧ

  17. εϚʔτϑΥϯͰ΋ମݧͯ͠ΈΑ͏ J04"OESPJE "'SBNFͬͯͳʹʁ d"'SBNFΛମݧͯ͠ΈΑ͏ d

  18. "'SBNFͬͯͳʹʁ d"'SBNFΛମݧͯ͠ΈΑ͏ d εϚϗͷ޲͖΍ υϥοάͰࢹ఺ ͕มΘΔɻ εςϨΦදࣔ

  19. "'SBNFͬͯͳʹʁ d"'SBNFͷυΩϡϝϯτ d ެࣜαΠτ • IUUQTBGSBNFJP ެࣜυΩϡϝϯτ • IUUQTBGSBNFJPEPDT ಈ࡞αϯϓϧू

    • IUUQTBGSBNFJPFYBNQMFT ίϯϙʔωϯτू • IUUQTBGSBNFJPBGSBNFSFHJTUSZ • IUUQTHJUIVCDPNBGSBNFWSBXFTPNFBGSBNF

  20. ։ൃͷ४උΛ͠Α͏

  21. ։ൃͷ४උΛ͠Α͏ d(MJUDIͱ͸ d )5.- +BWB4DSJQU ίʔσΟϯά ެ։ ಈ࡞֬ೝ Ξοϓϩʔυ ΤσΟλ౳Πϯετʔϧ

    αʔό؀ڥߏங ᶃ ᶄ ᶅ ᶆ "'SBNF੡ ίϯςϯπΛ ެ։͢Δ·Ͱ ௨ৗͷ৔߹ ख͕͔͔ؒΔʂ ͓͕͔͔ۚΔʂ

  22. ։ൃͷ४උΛ͠Α͏ d(MJUDIͱ͸ d (MJUDIΛ࢖͓͏ r (MJUDIͱ͸ • 8FCϒϥ΢β্Ͱ؆୯ɾखܰʹ8FCΞϓϦ έʔγϣϯΛߏஙͰ͖Δແྉ ݱࡏ

    ͷαʔϏεɻ • Πϯλʔωοτ্·ͨ͸ϩʔΧϧϚγϯ্ʹ αʔό؀ڥΛߏஙͤͣͱ΋"'SBNF੡ΞϓϦ ͷ࣮ߦ͕Մೳɻ • ίʔυΤσΟλΛඋ͓͑ͯΓɺ਺ଟ͘ͷαϯϓ ϧϓϩδΣΫτ͔Β೚ҙͷ΋ͷΛϦϛοΫε ίϐʔฤू ࣮ͯ͠ߦͰ͖Δɻ • (JUIVC·ͨ͸'BDFCPPLΞΧ΢ϯτ͕͋Ε͹ ͙͢ʹར༻Մೳɻ • ϓϩδΣΫτຖͷεϖʔε͕.#·ͰͳͲ ͷ੍໿͕͋ΔͨΊɺࠓͷͱ͜Ζࢼ࡞΍࣮ݧ޲͖ɻ

  23. ։ൃͷ४උΛ͠Α͏ d(MJUDIͱ͸ d )5.-+BWB4DSJQUͷ ίʔσΟϯά͔Β ެ։ɺಈ࡞֬ೝ·Ͱ 8FCϒϥ΢β಺Ͱ׬݁ ͔͠΋ແྉ 8FCϒϥ΢βͰ(MJUDI ΁ΞΫηε

    ᶃ "'SBNF੡ ίϯςϯπΛ ެ։͢Δ·Ͱ (MJUDIͷ৔߹ ᶄ

  24. ։ൃͷ४උΛ͠Α͏ d"'SBNFͷαϯϓϧΛ(MJUDI΁ίϐʔ d ᶃ ΫϦοΫ ᶄ ΫϦοΫ

  25. ։ൃͷ४උΛ͠Α͏ d"'SBNFͷαϯϓϧΛ(MJUDI΁ίϐʔ d ᶃ 7&34*0/Λબ୒ "3KTʹରԠ͍ͯ͠Δ࠷৽ όʔδϣϯ ᶅ SFNJYUIFTUBSUFSFYBNQMFPO(MJUDI ΛΫϦοΫ

    ᶄ (FUUJOH4UBSUFEΛΫϦοΫ

  26. ։ൃͷ४උΛ͠Α͏ d"'SBNFͷαϯϓϧΛ(MJUDI΁ίϐʔ d IUUQTHMJUDIDPNdBGSBNF͕։͍ͯΔ͜ͱΛ֬ೝ "'SBNF1SPKFDUͷϙοϓΞοϓ ΢Πϯυ΢͕දࣔ͞Ε͍ͯΔ͜ͱΛ ֬ೝ

  27. ։ൃͷ४උΛ͠Α͏ d"'SBNFͷαϯϓϧΛ(MJUDI΁ίϐʔ d 3FNJYZPVSPXO ΛΫϦοΫ

  28. ։ൃͷ४උΛ͠Α͏ d"'SBNFͷαϯϓϧΛ(MJUDI΁ίϐʔ d ࣗಈతʹ෇༩͞Εͨ ϓϩδΣΫτ໊ ίϐʔͨ͠ϑΝΠϧ͕ల։͞Ε͍ͯΔɻݱஈ֊Ͱ͸ɺ·ͩԾ ͷྖҬʹ͋Γ੍ݶ͕͋ΔͨΊɺαΠϯΠϯͯࣗ͠෼ͷྖҬͰ ѻ͑ΔΑ͏ʹ͢Δɻ

  29. ։ൃͷ४උΛ͠Α͏ d(MJUDI΁αΠϯΠϯ d ᶄ 4JOHJOXJUI'BDFCPPL·ͨ͸4JHOJOXJUI(JUIVCΛΫϦοΫɻ 'BDFCPPLͱ(JUIVCͷ͏ͪΞΧ΢ϯτΛॴ༗͍ͯ͠ΔํΛબͿɻ ྆ํॴ༗͍ͯ͠Δ৔߹͸޷͖ͳํͰ0,ɻ ᶃ 4JOHJOΛΫϦοΫ

  30. ։ൃͷ४උΛ͠Α͏ d(MJUDI΁αΠϯΠϯ d ᶃ Ϣʔβ໊͔ϝʔϧΞυϨεΛೖྗ ᶄ ύεϫʔυΛೖྗ ᶅ 4JOHJOΛΫϦοΫ ᶆ

    "VUIPSJ[F'PH$SFFL ΛΫϦοΫ (JUIVCͰ αΠϯΠϯ

  31. ։ൃͷ४උΛ͠Α͏ d(MJUDI΁αΠϯΠϯ d ᶃ ϝʔϧΞυϨε͔ి࿩൪߸Λೖྗ ᶄ ύεϫʔυΛೖྗ ᶅ ϩάΠϯΛΫϦοΫ ᶆ

    ˔˔˔ͱͯ͠ϩάΠϯ ΛΫϦοΫ 'BDFCPPL ͰαΠϯΠϯ

  32. ։ൃͷ४උΛ͠Α͏ d(MJUDI΁αΠϯΠϯ d αΠϯΠϯʹ੒ޭͨ͠Βࣗ෼ͷϓϩϑΟʔϧ ը૾͕දࣔ͞ΕΔ ͜ͷ޿͍ྖҬʹબ୒ͨ͠ϑΝΠϧͷ಺༰͕දࣔ ͞ΕΔɻίʔσΟϯά΋͜ͷྖҬͰߦ͏ɻ ΫϦοΫͯ͠ ϑΝΠϧબ୒

  33. ։ൃͷ४උΛ͠Α͏ dϓϩδΣΫτͷ࣮ߦͱ֬ೝ d ᶃ JOEFYIUNM ΛΫϦοΫ ᶄ JOEFYIUNMͷιʔείʔυΛ ֬ೝɻ αϯϓϧͷιʔείʔυ

  34. ։ൃͷ४උΛ͠Α͏ dϓϩδΣΫτͷ࣮ߦͱ֬ೝ d 4IPXΛΫϦοΫͯ͠ ϓϩδΣΫτΛ࣮ߦ

  35. ։ൃͷ४උΛ͠Α͏ dϓϩδΣΫτͷ࣮ߦͱ֬ೝ d IUUQTϓϩδΣΫτ໊HMJUDINF͕։͘ɻ J04"OESPJEͷϒϥ΢βͰ΋ಉ͡63-ʹ ΞΫηεͯ֬͠ೝͰ͖Δ

  36. <!DOCTYPE html> <html> <head> <title>Hello, WebAR! - A-Frame &amp; AR.js</title>

    <meta name="description" content="Hello, WebAR! - A-Frame &amp; AR.js"> <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script> </head> <body> <a-scene> <a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box> <a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere> <a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D"></a-cylinder> <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane> <a-sky color="#ECECEC"></a-sky> </a-scene> </body> </html> ։ൃͷ४උΛ͠Α͏ dϓϩδΣΫτͷ࣮ߦͱ֬ೝ d αϯϓϧͷίʔυ͸ͨͬͨ͜Ε͚ͩ ྘ͷ෦෼͕"'SBNFʹؔ܎͢Δهड़ɻ 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17.

  37. <!DOCTYPE html> <html> <head> <title>Hello, WebAR! - A-Frame &amp; AR.js</title>

    <meta name="description" content="Hello, WebAR! - A-Frame &amp; AR.js"> <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script> </head> <body> <a-scene> <a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box> <a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere> <a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D"></a-cylinder> <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane> <a-sky color="#ECECEC"></a-sky> </a-scene> </body> </html> ։ൃͷ४උΛ͠Α͏ dϓϩδΣΫτͷ࣮ߦͱ֬ೝ d +BWB4DSJQUͷϥΠϒϥϦΛಡΈࠐΉهड़ɻ ͜͜Ͱ͸"'SBNFͷػೳΛఏڙ͢ΔϥΠϒϥ ϦΛಡΈࠐΜͰ͍Δɻ 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17.

  38. <!DOCTYPE html> <html> <head> <title>Hello, WebAR! - A-Frame &amp; AR.js</title>

    <meta name="description" content="Hello, WebAR! - A-Frame &amp; AR.js"> <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script> </head> <body> <a-scene> <a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box> <a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere> <a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D"></a-cylinder> <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane> <a-sky color="#ECECEC"></a-sky> </a-scene> </body> </html> 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. ։ൃͷ४උΛ͠Α͏ dϓϩδΣΫτͷ࣮ߦͱ֬ೝ d BTDFOFʙBTDFOFͷؒʹ͸ Ծ૝ۭؒʹදࣔ͢Δ΋ͷΛهड़͢Δɻ

  39. <!DOCTYPE html> <html> <head> <title>Hello, WebAR! - A-Frame &amp; AR.js</title>

    <meta name="description" content="Hello, WebAR! - A-Frame &amp; AR.js"> <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script> </head> <body> <a-scene> <a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box> <a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere> <a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D"></a-cylinder> <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane> <a-sky color="#ECECEC"></a-sky> </a-scene> </body> </html> 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. ։ൃͷ४උΛ͠Α͏ dϓϩδΣΫτͷ࣮ߦͱ֬ೝ d

  40. <!DOCTYPE html> <html> <head> <title>Hello, WebAR! - A-Frame &amp; AR.js</title>

    <meta name="description" content="Hello, WebAR! - A-Frame &amp; AR.js"> <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script> </head> <body> <a-scene> <a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box> <a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere> <a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D"></a-cylinder> <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane> <a-sky color="#ECECEC"></a-sky> </a-scene> </body> </html> 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. ։ൃͷ४උΛ͠Α͏ dϓϩδΣΫτͷ࣮ߦͱ֬ೝ d

  41. ։ൃͷ४උΛ͠Α͏ dϓϩδΣΫτͷ࣮ߦͱ֬ೝ d λϒΛด࣮ͯ͡ߦதͷ ϓϩδΣΫτΛऴྃ

  42. ։ൃͷ४උΛ͠Α͏ dϓϩδΣΫτͷ࣮ߦͱ֬ೝ d ฤूը໘ͷλϒʹ໭͍ͬͯΕ͹0,

  43. ։ൃͷ४උΛ͠Α͏ dϓϩδΣΫτ໊ͷมߋ d ᶄ ֮͑΍͍͢ϓϩδΣΫτ໊ʹมߋ ଞͷϓϩδΣΫτ໊ͱॏෳ͠ͳ͍΋ͷ ᶃ ϓϩδΣΫτ໊ΛΫϦοΫ ᶅ &4$ΩʔͰϓϩδΣΫτ໊ͷมߋΛ

    ऴΘΔ

  44. ͓͓͖͍͑ͯͨ͞ϙΠϯτ

  45. ͓͓͖͍͑ͯͨ͞ϙΠϯτ dΑ͘࢖͏༻ޠ d 4DFOF γʔϯ ࡾ࣍ݩͷ෺ମΛ഑ஔ͢ΔԾ૝ۭؒͦͷ ΋ͷɻ $BNFSB Χϝϥ ࡾ࣍ݩͷԾ૝ۭؒΛͲ͔͜ΒݟΔ͔ɺ

    ࢹ఺Λઃఆ͢ΔͨΊͷ΋ͷɻγʔϯ಺ ʹσϑΥϧτͰඋΘ͍ͬͯΔɻ -JHIU ϥΠτ র໌͕ͳ͍ͱ҉ͯ͘Կ΋ݟ͑ͳ͍ͨΊɺ ޫݯͱͯ͠ϥΠτΛઃఆ͢Δɻγʔϯ ಺ʹσϑΥϧτͰඋΘ͍ͬͯΔɻ

  46. ͓͓͖͍͑ͯͨ͞ϙΠϯτ dΑ͘࢖͏༻ޠ d &OUJUZ ΤϯςΟςΟ ࡾ࣍ݩͷԾ૝ۭؒʹଘࡏ͢Δ෺ମɻ ओʹܗঢ়ͱ֎؍ͷ૊Έ߹ΘͤͰදݱ͞ ΕΔɻ 1SJNJUJWF ϓϦϛςΟϒ

    ٿମ΍ཱํମͳͲɺओʹجຊతͳܗঢ় ͷ෺ମΛ؆ܿͳखଓ͖Ͱѻ͍΍͘͢͠ ͨ΋ͷɻ

  47. ͓͓͖͍͑ͯͨ͞ϙΠϯτ d"'SBNFͷ࠲ඪܥ d "'SBNFͷ ࠲ඪܥ Z (-) X (+) Y

    (+) Z (+) Y (-) X (-) X: 0 Y: 0 Z: 0

  48. ͓͓͖͍͑ͯͨ͞ϙΠϯτ d"'SBNFͷҐஔɾճసɾॖई d 1PTJUJPO Ґஔ 9 : ;ͷॱʹεϖʔε۠੾Γ ͰҐஔΛࢦఆ ୯Ґϝʔτϧ

    3PUBUJPO ճస 9 : ;ͷॱʹεϖʔε۠੾Γ Ͱ֯౓Λࢦఆ ୯Ґ౓ 4DBMF ॖई 9 : ;ͷॱʹεϖʔε۠੾Γ Ͱഒ཰Λࢦఆ ୯Ґഒ ྫݪ఺͔Βӈʹϝʔτϧ  ྫ:࣠Λத৺ʹ›ճస  ྫج४ͱͳΔେ͖͞ͷഒ 

  49. ٿମΛදࣔ͠Α͏

  50. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d ᶃ JOEFYIUNM ΛΫϦοΫ ᶄ JOEFYIUNMͷιʔείʔυΛ ֬ೝɻ αϯϓϧͷιʔείʔυ

    ͜ͷྖҬͰίʔσΟϯάΛߦ͏ɻ

  51. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d <!DOCTYPE html> <html> <head> <title>Hello, WebAR! -

    A-Frame &amp; AR.js</title> <meta name="description" content="Hello, WebAR! - A-Frame &amp; AR.js"> <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script> </head> <body> <a-scene> <a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box> <a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere> <a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D"></a-cylinder> <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane> <a-sky color="#ECECEC"></a-sky> </a-scene> </body> </html> 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. ݱࡏɺ࠷৽όʔδϣϯ͸ ͳͷͰɺ͜ΕΑΓݹ͍৔߹͸มߋ͓ͯ͘͠ɻ

  52. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d <!DOCTYPE html> <html> <head> <title>Hello, WebAR! -

    A-Frame &amp; AR.js</title> <meta name="description" content="Hello, WebAR! - A-Frame &amp; AR.js"> <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script> </head> <body> <a-scene> <a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box> <a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere> <a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D"></a-cylinder> <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane> <a-sky color="#ECECEC"></a-sky> </a-scene> </body> </html> 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. BTDFOFʙBTDFOFͷத਎Λ࡟আ

  53. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d <!DOCTYPE html> <html> <head> <title>Hello, WebAR! -

    A-Frame &amp; AR.js</title> <meta name="description" content="Hello, WebAR! - A-Frame &amp; AR.js"> <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script> </head> <body> <a-scene> </a-scene> </body> </html> 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. BTDFOFʙBTDFOFͷதʹ ͜Ε͔Βඞཁͳ΋ͷΛهड़͍ͯ͘͠

  54. // 前略 <body> <a-scene> <a-sphere position="0 0 0" rotation="0 0

    0" scale="1 1 1" radius="1" color="blue"></a-sphere> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d X: 0 Y: 0 Z: 0 BTQIFSFʙBTQIFSFΛهड़͠ ٿମͷϓϦϛςΟϒΛ௥Ճɻ QPTJUJPOɺSPUBUJPOɺTDBMFͷ֤஋͸ YɺZɺ[ͷॱʹεϖʔε۠੾ΓͰهड़ɻ SBEJVT͸൒ܘͷ஋ ϝʔτϧ Λهड़ɻ DPMPSͰ৭Λهड़ɻ ˔DPQZBOEQBTUFUYUͷ <੨͍ٿମΛ ഑ஔ> ͔Βίϐϖɻ

  55. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d 4IPXΛΫϦοΫ࣮ͯ͠ߦ

  56. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d Կ΋ग़ͳ͍ɻ<$USM> <"MU> <J> ΩʔΛԡ͢ͱʜ

  57. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d "'SBNF*OTQFDUPS ʹ੾ΓସΘΔ

  58. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d ΧϝϥͷΞΠίϯΛ࣋ͭ BFOUJUZΛΫϦοΫ

  59. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d Χϝϥ͕બ୒ঢ়ଶʹɻ Α͘ݟΔͱٿମ͕ࢮ֯ͷ Ґஔʹ͋Δɻ

  60. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d QPTJUJPO͕ Ͱ ٿମͷਅ্ʹҐஔ͍ͯ͠Δ

  61. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d #BDLUP4DFOFΛΫϦοΫ

  62. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d Լ໼ҹΩʔΛԡ͠ଓ͚͍ͯΔͱʜ

  63. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d खલͷํ͔Βٿମ͕ݱΕΔɻ σϑΥϧτΧϝϥͷࢹ໺ʹٿମ͕ೖͬͯ͘Δ·Ͱɺ ΧϝϥΛखલํ޲΁Ҡಈͤͨ͜͞ͱʹΑΔ΋ͷɻ

  64. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d ฤूը໘ͷλϒʹ੾Γସ͑

  65. // 前略 <body> <a-scene> <a-sphere position="2 0 -5" rotation="0 0

    0" scale="1 1 1" radius="1.5" color="blue"></a-sphere> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d BTQIFSFʙBTQIFSFʹ͋Δ QPTJUJPOɺTDBMF ɺSBEJVT ɺDPMPS ͷ֤஋Λ͍Ζ͍Ζม͑ͯΈͯ͸࣮ߦ݁Ռ Λ֬ೝ͠ɺײ֮Λ͔ͭΉɻ

  66. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d ࣮ߦ݁Ռͷλϒʹ੾Γସ͑

  67. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d มߋͨ͠஋ʹΑͬͯٿମ͕ ༷ʑͳҐஔ΍େ͖͞ɺ৭Ͱ දࣔ͞ΕΔ͜ͱΛ֬ೝ

  68. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d ฤूը໘ͷλϒʹ੾Γସ͑

  69. // 前略 <body> <a-scene> <a-sphere position="0 0 0" rotation="0 0

    0" scale="1 1 1" radius="1" color="blue"></a-sphere> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. ٿମΛදࣔ͠Α͏ dٿମͷ഑ஔ d ׳Ε͖ͯͨΒBTQIFSFʙBTQIFSFͷ QPTJUJPOɺ SPUBUJPOɺ TDBMFɺSBEJVT͸ ্هઃఆʹ͓ͯ͘͠ɻ ޙͷ"3දࣔʹ޲͚ͯͷઃఆ

  70. // 前略 <body> <a-scene> <a-sphere position="0 0 0" rotation="0 0

    0" scale="1 1 1" radius="1" color="blue"></a-sphere> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. ٿମΛදࣔ͠Α͏ dΧϝϥͷ഑ஔ d ݱঢ়Ͱ͸૬มΘΒͣٿମ͕ݟ͑ͳ͍ͷͰΧϝϥ ͷελʔτҐஔΛมߋ͢Δɻ BTQIFSFʙBTQIFSFͷԼʹߦૠೖɻ

  71. // 前略 <body> <a-scene> <a-sphere position="0 0 0" rotation="0 0

    0" scale="1 1 1" radius="1" color="blue"></a-sphere> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. ٿମΛදࣔ͠Α͏ dΧϝϥͷ഑ஔ d BFOUJUZʙBFOUJUZΛ௥Ճͯ͠ΧϝϥػೳͷDBNFSBΛ௥Ճɻ σϑΥϧτΧϝϥɺࢹ఺มߋɺΩʔૢ࡞͕ແޮʹͳͬͯ͠·͏ͨΊɺ ࢹ఺มߋͷMPPLDPOUSPMTͱΩʔૢ࡞ͷXBTEDPOUSPMTΛ௥Ճɻ ٿମ͕ࢹ໺ʹೖΔҐஔʹQPTJUJPOΛઃఆɻ ˔DPQZBOEQBTUFUYUͷ <ΧϝϥΛ഑ஔ> ͔Βίϐϖɻ

  72. ٿମΛදࣔ͠Α͏ dΧϝϥͷ഑ஔ d ࣮ߦ݁Ռͷλϒʹ੾Γସ͑

  73. ٿମΛදࣔ͠Α͏ dΧϝϥͷ഑ஔ d ٿମ͕දࣔ ͞ΕͨΒ0,

  74. ٿମΛදࣔ͠Α͏ dΧϝϥͷ഑ஔ d ฤूը໘ͷλϒʹ੾Γସ͑

  75. ը૾ΛషΓ෇͚Α͏

  76. ը૾ΛషΓ෇͚Α͏ dషΓ෇͚Δը૾ͷΞοϓϩʔυ d ᶃ "TTFUT ΛΫϦοΫ ᶄ "EE"TTFU ΛΫϦοΫ ᶅ

    $PNQVUFSˠ ΛΫϦοΫ

  77. ը૾ΛషΓ෇͚Α͏ dషΓ෇͚Δը૾ͷΞοϓϩʔυ d ᶃ ࣄલʹμ΢ϯϩʔυɾల։ͨ͠ TBNQMFϑΥϧμ಺ͷFBSKQHΛ ΫϦοΫ ᶄ ։͘ΛΫϦοΫ

  78. ը૾ΛషΓ෇͚Α͏ dషΓ෇͚Δը૾ͷΞοϓϩʔυ d Ξοϓϩʔυͨ͠ϑΝΠϧͷαϜωΠϧ ͕දࣔ͞ΕͨΒ0,

  79. ը૾ΛషΓ෇͚Α͏ dٿମ΁ͷը૾ͷషΓ෇͚ d FBSKQHͷαϜωΠϧ ΛΫϦοΫ

  80. ը૾ΛషΓ෇͚Α͏ dٿମ΁ͷը૾ͷషΓ෇͚ d ᶃ $PQZ6SM ΛΫϦοΫ ᶄ &4$ΩʔΛԡͯ͠ ϙοϓΞοϓ΢Πϯυ΢ Λด͡Δ

  81. ը૾ΛషΓ෇͚Α͏ dٿମ΁ͷը૾ͷషΓ෇͚ d JOEFYIUNM ΛΫϦοΫ

  82. // 前略 <body> <a-scene> <a-sphere position="0 0 0" rotation="0 0

    0" scale="1 1 1" radius="1" color="blue"></a-sphere> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. ը૾ΛషΓ෇͚Α͏ dٿମ΁ͷը૾ͷషΓ෇͚ d Ξοϓϩʔυͨ͠ը૾Λ࢖༻ ͢ΔͨΊͷ४උΛߦ͏ɻ BTQIFSFʙBTQIFSF ͷ্ʹߦૠೖɻ

  83. // 前略 <body> <a-scene> <a-assets> </a-assets> <a-sphere position="0 0 0"

    rotation="0 0 0" scale="1 1 1" radius="1" color="blue"></a-sphere> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. ը૾ΛషΓ෇͚Α͏ dٿମ΁ͷը૾ͷషΓ෇͚ d BBTTFUTʙBBTTFUTΛهड़ɻ ͜ͷؒʹը૾΍%Ϟσϧʹؔ͢Δ৘ใΛ هड़͍ͯ͘͠ɻ

  84. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> </a-assets> <a-sphere

    position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" color="blue"></a-sphere> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. ը૾ΛషΓ෇͚Α͏ dٿମ΁ͷը૾ͷషΓ෇͚ d JNHΛهड़ͯ͠Ξοϓϩʔυͨ͠FBSKQHͷ࢖༻Λએݴɻ  JE͸Ұҙͷ໊শ  TSD͸ίϐʔ͓͍ͯͨ͠FBSKQHͷ63-ΛషΓ෇͚

  85. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> </a-assets> <a-sphere

    position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" color="blue"></a-sphere> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. ը૾ΛషΓ෇͚Α͏ dٿମ΁ͷը૾ͷషΓ෇͚ d ٿମʹը૾ΛషΓ෇͚ΔͨΊɺ৭ͷࢦఆ͸ෆཁʹͳΔɻ BTQIFSFʙBTQIFSFͷDPMPSΛ࡟আɻ

  86. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> </a-assets> <a-sphere

    position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. ը૾ΛషΓ෇͚Α͏ dٿମ΁ͷը૾ͷషΓ෇͚ d ୅ΘΓʹTSDΛ௥Ճͯ͠FBSKQHͷJEͱؔ࿈ ෇͚Δɻ͜͜Ͱ͸JEͷલʹγϟʔϓه߸  Λ͚ͭΔɻ

  87. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> </a-assets> <a-sphere

    position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. ը૾ΛషΓ෇͚Α͏ dٿମ΁ͷը૾ͷషΓ෇͚ d ٿମͱFBSKQH͕JEʹ Αͬͯؔ࿈෇͍ͨɻ

  88. ࣮ߦ݁Ռͷλϒʹ੾Γସ͑ ը૾ΛషΓ෇͚Α͏ dٿମ΁ͷը૾ͷషΓ෇͚ d

  89. ஍ٿ͕දࣔ͞ΕͨΒ0, ը૾ΛషΓ෇͚Α͏ dٿମ΁ͷը૾ͷషΓ෇͚ d

  90. ࣮ߦ݁ՌͷλϒΛดͯ͡ ฤूը໘ͷλϒ΁໭Δ ը૾ΛషΓ෇͚Α͏ dٿମ΁ͷը૾ͷషΓ෇͚ d

  91. %ϞσϧΛදࣔ͠Α͏

  92. %ϞσϧΛදࣔ͠Α͏ d࢖༻͢Δ%Ϟσϧ 0#+ ͷϑΝΠϧߏ੒ d 0#+ ܗঢ়Λද͢ϑΝΠϧ 1/(+1((*' ৭΍֎؍ɾ࣭ײΛද͢ը૾ ϑΝΠϧ

    ͭͷϑΝΠϧΛ͋Θͤͯ %ϞσϧΛදࣔ .5- ը૾ϑΝΠϧͷ৭͕ܗঢ় ͷͲͷҐஔʹ૬౰͢Δ͔ ؔ܎ੑΛද͢ϑΝΠϧ

  93. %ϞσϧΛදࣔ͠Α͏ d0#+ϑΝΠϧͱ1/(ϑΝΠϧͷΞοϓϩʔυ d ᶃ "TTFUT ΛΫϦοΫ ᶄ "EE"TTFU ΛΫϦοΫ ᶅ

    $PNQVUFSˠ ΛΫϦοΫ

  94. %ϞσϧΛදࣔ͠Α͏ d0#+ϑΝΠϧͱ1/(ϑΝΠϧͷΞοϓϩʔυ d ᶃ ࣄલʹμ΢ϯϩʔυɾల։ͨ͠ TBNQMFϑΥϧμ಺ͷEVDLPCKͱ EVDL@UFYUVSFQOHΛΫϦοΫ ᶄ ։͘ΛΫϦοΫ

  95. %ϞσϧΛදࣔ͠Α͏ d0#+ϑΝΠϧͱ1/(ϑΝΠϧͷΞοϓϩʔυ d Ξοϓϩʔυͨ͠ϑΝΠϧͷαϜωΠϧ ͕දࣔ͞ΕͨΒ0,

  96. %ϞσϧΛදࣔ͠Α͏ d.5-ϑΝΠϧͷฤूͱΞοϓϩʔυ d EVDLNUMʹը૾ϑΝΠϧͷ৔ॴΛ஌ΒͤΔඞཁ ͕͋ΔͨΊ63-Λௐ΂Δɻ EVDL@UFYUVSFQOHͷαϜωΠϧΛΫϦοΫɻ

  97. %ϞσϧΛදࣔ͠Α͏ d.5-ϑΝΠϧͷฤूͱΞοϓϩʔυ d ᶃ $PQZ6SM ΛΫϦοΫ ᶄ &4$ΩʔΛԡͯ͠ϙοϓ Ξοϓ΢Πϯυ΢Λด͡Δ

  98. %ϞσϧΛදࣔ͠Α͏ d.5-ϑΝΠϧͷฤूͱΞοϓϩʔυ d ࣄલʹμ΢ϯϩʔυɾల։ͨ͠TBNQMFϑΥϧμ ಺ͷEVDLNUMΛςΩετΤσΟλͰ։͘

  99. // 前略 newmtl body Ns 96.078431 Ka 1.000000 1.000000 1.000000

    Kd 0.800000 0.800000 0.000000 Ks 0.500000 0.500000 0.500000 Ke 0.000000 0.000000 0.000000 Ni 1.000000 d 1.000000 illum 2 map_Kd https://cdn.glitch.com/f87d2f49-ea88-4c64-bf8b- 9d0d5ba378e7%2Fduck_texture.png?1500398467350 14. 15. 16. 17. 18. 19. 20. 21. 22. 23. ࠷ޙͷߦͷNBQ@,EΑΓޙΖͷ63-Λ࡟আͯ͠ʜ %ϞσϧΛදࣔ͠Α͏ d.5-ϑΝΠϧͷฤूͱΞοϓϩʔυ d

  100. // 前略 newmtl body Ns 96.078431 Ka 1.000000 1.000000 1.000000

    Kd 0.800000 0.800000 0.000000 Ks 0.500000 0.500000 0.500000 Ke 0.000000 0.000000 0.000000 Ni 1.000000 d 1.000000 illum 2 map_Kd duck_textture.pngのURL 14. 15. 16. 17. 18. 19. 20. 21. 22. 23. ίϐʔ͓͍ͯͨ͠EVDL@UFYUVSFQOHͷ63-ΛషΓ෇͚ޙɺ EVDLNUMΛ্ॻ͖อଘ %ϞσϧΛදࣔ͠Α͏ d.5-ϑΝΠϧͷฤूͱΞοϓϩʔυ d

  101. ᶃ "TTFUT ΛΫϦοΫ ᶄ "EE"TTFU ΛΫϦοΫ ᶅ $PNQVUFSˠ ΛΫϦοΫ %ϞσϧΛදࣔ͠Α͏

    d.5-ϑΝΠϧͷฤूͱΞοϓϩʔυ d

  102. ᶃ ࣄલʹμ΢ϯϩʔυɾల։ͨ͠ TBNQMFϑΥϧμ͔Βฤूɾอଘ ࡁΈͷEVDLNUMΛΫϦοΫ ᶄ ։͘ΛΫϦοΫ %ϞσϧΛදࣔ͠Α͏ d.5-ϑΝΠϧͷฤूͱΞοϓϩʔυ d

  103. ͭͷϑΝΠϧ͕ἧ͍ͬͯΕ͹0, %ϞσϧΛදࣔ͠Α͏ d.5-ϑΝΠϧͷฤूͱΞοϓϩʔυ d

  104. %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d %ϞσϧΛࢀর͢ΔͨΊ63-Λௐ΂Δɻ EVDLPCKͷαϜωΠϧΛΫϦοΫɻ

  105. ᶃ $PQZ6SM ΛΫϦοΫ ᶄ &4$ΩʔΛԡͯ͠ϙοϓ Ξοϓ΢Πϯυ΢Λด͡Δ %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d

  106. ᶃ JOEFYIUNM ΛΫϦοΫ %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d

  107. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> </a-assets> <a-sphere

    position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. FBSKQHͷJNHͷ࣍ͷߦͰΞοϓϩʔυ ͨ͠EVDLPCKͷ࢖༻Λએݴ͢Δɻ %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d

  108. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj"

    src="duck.objのURL"></a-asset-item> </a-assets> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d BBTTFUJUFNʙBBTTFUJUFNΛهड़ɻ  JE͸Ұҙͷ໊শ  TSD͸ίϐʔ͓͍ͯͨ͠EVDLPCKͷ63-ΛషΓ෇͚

  109. ᶃ BTTFUTΛΫϦοΫ %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d

  110. %Ϟσϧʹؔ࿈෇͚Δը૾৘ใΛࢀর͢Δ ͨΊ63-Λௐ΂ΔɻEVDLNUMͷαϜωΠϧ ΛΫϦοΫɻ %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d

  111. ᶃ $PQZ6SM ΛΫϦοΫ ᶄ &4$ΩʔΛԡͯ͠ϙοϓ Ξοϓ΢Πϯυ΢Λด͡Δ %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d

  112. ᶃ JOEFYIUNM ΛΫϦοΫ %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d

  113. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj"

    src="duck.objのURL"></a-asset-item> </a-assets> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d EVDLPCKͷBBTTFUJUFNʙBBTTFUJUFNͷ࣍ͷ ߦͰΞοϓϩʔυͨ͠EVDLNUMͷ࢖༻Λએݴ͢Δɻ

  114. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj"

    src="duck.objのURL"></a-asset-item> <a-asset-item id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d BBTTFUJUFNʙBBTTFUJUFNΛهड़ɻ  JE͸Ұҙͷ໊শ  TSD͸ίϐʔ͓͍ͯͨ͠EVDLNUMͷ63-ΛషΓ෇͚

  115. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj"

    src="duck.objのURL"></a-asset-item> <a-asset-item id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d %ϞσϧͷදࣔͰඞཁͱͳΔϑΝΠϧ͸એݴ͕ͨ͠ɺ·ͩ ഑ஔʹؔ͢Δهड़͕ͳ͍ɻ %ϞσϧΛ഑ஔ͢ΔͨΊBTQIFSFʙBTQIFSFͷ Լʹߦૠೖ͠

  116. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj"

    src="duck.objのURL"></a-asset-item> <a-asset-item id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d BPCKNPEFMʙBPCKNPEFMΛ௥Ճɻ TSDʹ͸EVDLPCKͷJEΛɺNUMʹ͸EVDLNUMͷJEΛͦΕͧΕ ؔ࿈෇͚ΔɻJEͷઌ಄ʹ͸γϟʔϓه߸  Λ͚ͭΔ͜ͱɻ ˔DPQZBOEQBTUFUYUͷ <μοΫΛ഑ஔ> ͔Βίϐϖɻ

  117. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj"

    src="duck.objのURL"></a-asset-item> <a-asset-item id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d ഑ஔͨ͠%ϞσϧͱEVDLPCK͕JEʹΑͬͯ ؔ࿈෇͍ͨɻ

  118. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj"

    src="duck.objのURL"></a-asset-item> <a-asset-item id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d ಉ༷ʹ%ϞσϧͱEVDLNUM΋ؔ࿈෇͍ͨɻ

  119. 4IPXΛΫϦοΫ࣮ͯ͠ߦ %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d

  120. μοΫ͕දࣔ͞ΕͨΒ 0, %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷ഑ஔ d

  121. μοΫ͕ޙΖ޲͖ɻ લΛ޲͔͍ͤͨɻ %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷճస d

  122. ฤूը໘ͷλϒʹ੾Γସ͑ %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷճస d

  123. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj"

    src="duck.objのURL"></a-asset-item> <a-asset-item id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷճస d ޲͖Λม͑ΔͨΊʹBPCKNPEFMʙBPCKNPEFM ͷSPUBUJPOΛมߋ͢Δɻ

  124. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj"

    src="duck.objのURL"></a-asset-item> <a-asset-item id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 180 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷճస d :࣠ ਨ௚ํ޲ͷ࣠ Λ౓ճసͤͯ͞લ޲͖ʹɻ

  125. ࣮ߦ݁Ռͷλϒʹ੾Γସ͑ %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷճస d

  126. μοΫ͕લ޲͖ʹදࣔ ͞ΕͨΒ0, %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷճస d

  127. ࣮ߦ݁ՌͷλϒΛดͯ͡ ฤूը໘ͷλϒ΁໭Δ %ϞσϧΛදࣔ͠Α͏ d%Ϟσϧͷճస d

  128. ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏

  129. ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ dΞχϝʔγϣϯͷΠϝʔδ d ࣗస͢Δ஍ٿͷपғ ΛμοΫ͕ެస͢Δ Πϝʔδɻ ճసεϐʔυ͸ಉ͡ɻ μοΫ ஍ٿ

  130. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj"

    src="duck.objのURL"></a-asset-item> <a-asset-item id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 180 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. ஍ٿͱμοΫΛಉ͡଎౓Ͱɺಉ͡ํ޲ʹճసͤ͞ΔΊɺ ݸผͰ͸ͳ͘·ͱΊͯճస͍ͤͨ͞ɻ ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ dΞχϝʔγϣϯͷద༻ d

  131. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj"

    src="duck.objのURL"></a-asset-item> <a-asset-item id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 180 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 21. BTQIFSFʙBTQIFSFͱ BPCKNPEFMʙBPCKNPEFMͷ લޙʹߦͣͭૠೖͯ͠ ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ dΞχϝʔγϣϯͷద༻ d

  132. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj"

    src="duck.objのURL"></a-asset-item> <a-asset-item id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-entity> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 180 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 21. BFOUJUZʙBFOUJUZͰׅͬͯ·ͱΊΔɻ ͜ͷBFOUJUZʙBFOUJUZʹΞχϝʔγϣϯΛద༻͢Δ͜ ͱͰɺ·ͱ·Γͷߏ੒ཁૉͰ͋Δ஍ٿͱμοΫʹΞχϝʔγϣϯ ͕ద༻͞ΕΔɻ ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ dΞχϝʔγϣϯͷద༻ d

  133. // 前略 <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj" src="duck.objのURL"></a-asset-item> <a-asset-item

    id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-entity> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 180 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> // 以下省略 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. BFOUJUZʙBFOUJUZ಺ͷ࠷ॳʹ ߦૠೖͯ͠ ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ dΞχϝʔγϣϯͷద༻ d

  134. // 前略 <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj" src="duck.objのURL"></a-asset-item> <a-asset-item

    id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-entity> <a-animation attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 180 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> // 以下省略 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ dΞχϝʔγϣϯͷద༻ d BBOJNBUJPOʙBBOJNBUJPOΛهड़ɻ ˔DPQZBOEQBTUFUYUͷ <Ξχϝʔγϣϯͷద༻> ͔Βίϐϖɻ

  135. ͻͱ·ͣ4IPXΛΫϦοΫ ࣮ͯ͠ߦ ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ dΞχϝʔγϣϯͷద༻ d

  136. ஍ٿͱμοΫ͕ճస ͍ͯ͠Ε͹0, ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ dΞχϝʔγϣϯͷద༻ d

  137. μοΫ͕ޙΖ޲͖ʹ ճస͍ͯ͠Δɻ ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ dμοΫͷ޲͖Λมߋ d

  138. ฤूը໘ͷλϒʹ੾Γସ͑ ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ dμοΫͷ޲͖Λมߋ d

  139. // 前略 <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj" src="duck.objのURL"></a-asset-item> <a-asset-item

    id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-entity> <a-animation attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 180 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> // 以下省略 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ dμοΫͷ޲͖Λมߋ d μοΫΛਐߦํ޲΁޲͔͍ͤͨ

  140. // 前略 <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj" src="duck.objのURL"></a-asset-item> <a-asset-item

    id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-entity> <a-animation attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> // 以下省略 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ dμοΫͷ޲͖Λมߋ d :࣠ͷճసΛݩʹ΋Ͳ͢

  141. ࣮ߦ݁Ռͷλϒʹ੾Γସ͑ ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ dμοΫͷ޲͖Λมߋ d

  142. μοΫ͕લ޲͖Ͱ प͍ͬͯΕ͹0, ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ dμοΫͷ޲͖Λมߋ d

  143. ࣮ߦ݁ՌͷλϒΛดͯ͡ ฤूը໘ͷλϒ΁໭Δ ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ dμοΫͷ޲͖Λมߋ d

  144. // 前略 <a-entity> <a-animation attribute="rotation" from="0 0 0" to="0 360

    0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> // 以下省略 15. 16. 17. 18. 19. ΞχϝʔγϣϯΛ࢖ͬͯΈΑ͏ dΞχϝʔγϣϯͷղઆ d  BUUSJCVUFSPUBUJPO ճసʹ͍ͭͯͷΞχϝʔγϣϯ  GSPN Ξχϝʔγϣϯ։࢝࣌ͷճస֯౓ ›  UP Ξχϝʔγϣϯऴྃ࣌ͷճస֯౓ ›  EVS Ξχϝʔγϣϯ։͔࢝Βऴྃ·Ͱʹཁ͢Δ࣌ؒ ඵ ඵ୯ҐͰࢦఆ  FBTJOHMJOFBS ؇ٸͳ͠  SFQFBUUSVF ܁Γฦ͋͠Γ

  145. ΠϯλϥΫγϣϯΛ͚ͭΑ͏

  146. ΠϯλϥΫγϣϯΛ͚ͭΑ͏ dΫϦοΫݕ஌ϥΠϒϥϦͷಡΈࠐΈ d // 前略 <head> <title>Hello, WebAR! - A-Frame

    &amp; AR.js</title> <meta name="description" content="Hello, WebAR! - A-Frame &amp; AR.js"> <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script> </head> // 以下省略 3. 4. 5. 6. 7. 8. Ϛ΢εΫϦοΫݕ஌ʹରԠ͢ΔϥΠϒϥϦΛಡΈࠐΉɻ IFBEʙIFBE಺ͷ࠷ޙʹߦૠೖɻ

  147. ΠϯλϥΫγϣϯΛ͚ͭΑ͏ dΫϦοΫݕ஌ϥΠϒϥϦͷಡΈࠐΈ d // 前略 <head> <title>Hello, WebAR! - A-Frame

    &amp; AR.js</title> <meta name="description" content="Hello, WebAR! - A-Frame &amp; AR.js"> <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script> <script src="https://rawgit.com/mayognaise/aframe-mouse-cursor- component/master/dist/aframe-mouse-cursor-component.js"></script> </head> // 以下省略 3. 4. 5. 6. 7. 8. TDSJQUʙTDSJQUΛهड़ͯ͠BGSBNFNPVTFDVSTPSDPNQPOFOU ಡΈࠐΈɻ ˔DPQZBOEQBTUFUYUͷ <ΫϦοΫΛݕ஌͢ΔϥΠϒϥϦ> ͔Βίϐϖɻ

  148. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj"

    src="duck.objのURL"></a-asset-item> <a-asset-item id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-entity> <a-animation attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> <a-entity camera look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 21. 22. 23. ΠϯλϥΫγϣϯΛ͚ͭΑ͏ dΫϦοΫݕ஌ͷ༗ޮԽ d ϥΠϒϥϦΛಡΈࠐΜͩͷͰΫϦοΫͷݕ஌Λ༗ޮԽ͍ͨ͠ɻ DBNFSBΛ࣋ͭBFOUJUZʙBFOUJUZʹରͯ͠

  149. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj"

    src="duck.objのURL"></a-asset-item> <a-asset-item id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-entity> <a-animation attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> <a-entity camera mouse-cursor look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 21. 22. 23. ΠϯλϥΫγϣϯΛ͚ͭΑ͏ dΫϦοΫݕ஌ͷ༗ޮԽ d NPVTFDVSTPSΛ௥Ճ͠༗ޮԽ

  150. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj"

    src="duck.objのURL"></a-asset-item> <a-asset-item id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-entity> <a-animation attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> <a-entity camera mouse-cursor look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 21. 22. 23. ΠϯλϥΫγϣϯΛ͚ͭΑ͏ dΫϦοΫʹΑΔΞχϝʔγϣϯ։࢝ d ஍ٿ͔μοΫΛΫϦοΫͨ͠ΒΞχϝʔγϣϯΛ։͍࢝ͨ͠ɻ BBOJNBUJPOʙBBOJNBUJPOʹରͯ͠

  151. // 前略 <body> <a-scene> <a-assets> <img id="earth-jpg" src="ear.jpgのURL"> <a-asset-item id="duck-obj"

    src="duck.objのURL"></a-asset-item> <a-asset-item id="duck-mtl" src="duck.mtlのURL"></a-asset-item> </a-assets> <a-entity> <a-animation begin="click" attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> <a-entity camera mouse-cursor look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 21. 22. 23. ΠϯλϥΫγϣϯΛ͚ͭΑ͏ dΫϦοΫʹΑΔΞχϝʔγϣϯ։࢝ d CFHJOΛ௥Ճͯ͠Ξχϝʔγϣϯ։࢝৚݅ ΛDMJDL ΫϦοΫ࣌ ʹ͢Δɻ

  152. 4IPXΛΫϦοΫ࣮ͯ͠ߦ ΠϯλϥΫγϣϯΛ͚ͭΑ͏ dΫϦοΫʹΑΔΞχϝʔγϣϯ։࢝ d

  153. ஍ٿPSμοΫΛΫϦοΫͯ͠Ξχϝʔγϣϯ ͕ελʔτͨ͠Β0, ΠϯλϥΫγϣϯΛ͚ͭΑ͏ dΫϦοΫʹΑΔΞχϝʔγϣϯ։࢝ d

  154. ࣮ߦ݁ՌͷλϒΛดͯ͡ ฤूը໘ͷλϒ΁໭Δ ΠϯλϥΫγϣϯΛ͚ͭΑ͏ dΫϦοΫʹΑΔΞχϝʔγϣϯ։࢝ d

  155. "3ۭؒʹදࣔ͠Α͏

  156. "3ۭؒʹදࣔ͠Α͏ d"'SBNFʹΑΔ8FC"3ͷ࣮ݱ d "3KTͱ͸ • "'SBNF͸ຊདྷ8FC73ٕज़ɻ೥ʹ8FC"3ϥΠϒ ϥϦ"3KT͕ొ৔͠ɺ73͚ͩͰͳ͘"3΋਎ۙʹɻ • IUUQTHJUIVCDPNKFSPNFFUJFOOF"3KT •

    IUUQTHJUIVCDPNKFSPNFFUJFOOF"3KTUSFF NBTUFSBGSBNF • 8FC(-ٴͼ8FC35$ʹରԠ͍ͯ͠Ε͹εϚʔτϑΥϯ Ͱ΋ར༻Մೳ J04ͷ8FC35$ରԠ͸7FS͔Βͷ༧ఆ • +4"35PPM,JU ୅දత"3ϥΠϒϥϦ"35PPM,JUͷ +BWB4DSJQU൛ ʹΑΔϚʔΧʔܕͷ"3ɻ • "3KTͰར༻Ͱ͖ΔϚʔΧʔͷछྨ͸ز͔ͭ͋Δ͕ɺࠓճ ͸)JSPͱ͍͏λΠϓͷ"3ϚʔΧʔΛ࢖༻ɻ

  157. // 前略 <head> <title>Hello, WebAR! - A-Frame &amp; AR.js</title> <meta

    name="description" content="Hello, WebAR! - A-Frame &amp; AR.js"> <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script> <script src="https://rawgit.com/mayognaise/aframe-mouse-cursor- component/master/dist/aframe-mouse-cursor-component.js"></script> </head> // 以下省略 3. 4. 5. 6. 7. 8. 9. "3KTͷϥΠϒϥϦΛಡΈࠐΉɻ IFBEʙIFBE಺ͷ࠷ޙʹߦૠೖɻ "3ۭؒʹදࣔ͠Α͏ d"3KTͷϥΠϒϥϦಡΈࠐΈ d

  158. // 前略 <head> <title>Hello, WebAR! - A-Frame &amp; AR.js</title> <meta

    name="description" content="Hello, WebAR! - A-Frame &amp; AR.js"> <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script> <script src="https://rawgit.com/mayognaise/aframe-mouse-cursor- component/master/dist/aframe-mouse-cursor-component.js"></script> <script src="https://rawgit.com/jeromeetienne/AR.js/master/aframe/build/aframe- ar.js"></script> </head> // 以下省略 3. 4. 5. 6. 7. 8. 9. "3ۭؒʹදࣔ͠Α͏ d"3KTͷϥΠϒϥϦಡΈࠐΈ d TDSJQUʙTDSJQUΛهड़ͯ͠"3KTಡΈࠐΈɻ ˔DPQZBOEQBTUFUYUͷ <"3ʹରԠ͢ΔϥΠϒϥϦ> ͔Βίϐϖɻ

  159. // 前略 <body> <a-scene> // 中略 <a-entity> <a-animation begin="click" attribute="rotation"

    from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> <a-entity camera mouse-cursor look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 10. 11. 17. 18. 19. 20. 21. 22. 23. 24. 8FCΧϝϥ͔ΒϦΞϧλΠϜͷө૾Λऔಘͯ͠ϒϥ΢β্ʹ දࣔ͢ΔɻBTDFOFʙBTDFOFʹ "3ۭؒʹදࣔ͠Α͏ d8FCΧϝϥͷө૾Λදࣔ d

  160. // 前略 <body> <a-scene arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate: 30;

    canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 <a-entity> <a-animation begin="click" attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> <a-entity camera mouse-cursor look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 10. 11. 17. 18. 19. 20. 21. 22. 23. 24. "3ۭؒʹදࣔ͠Α͏ d8FCΧϝϥͷө૾Λදࣔ d BSKTͷهड़Λ௥Ճ͢Δɻ ˔DPQZBOEQBTUFUYUͷ <"3ϚʔΧʔͷಡऔ৚݅> ͔Βίϐϖɻ

  161. // 前略 <body> <a-scene arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate: 30;

    canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 <a-entity> <a-animation begin="click" attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> <a-entity camera mouse-cursor look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 10. 11. 17. 18. 19. 20. 21. 22. 23. 24. "3ۭؒʹදࣔ͠Α͏ d8FCΧϝϥͷө૾Λදࣔ d BSKT "3ϚʔΧʔಡΈऔΓͷͨΊͷ৚݅Λઃఆ͢Δ Լه͸ϞόΠϧσό Πε޲͚ͷෛՙΛ཈͑ͨઃఆ  TPVSDF5ZQFXFCDBN ˠ ΢ΣϒΧϝϥͷө૾Λ࢖༻͢Δ  EFUFDUJPO.PEFNPOP ˠ നࠇϞʔυͰϚʔΧʔݕग़Λߦ͏  NBY%FUFDUJPO3BUF ˠ ඵʹ͖ͭճͷϚʔΧʔݕग़ΛࢼΈΔ  DBOWBT8JEUI ˠ ϚʔΧʔݕग़ͷͨΊͷը૾ղ૾౓ ෯  DBOWBT)FJHIU ˠ ϚʔΧʔݕग़ͷͨΊͷը૾ղ૾౓ ߴ͞  EFCVH6*&OBCMFEGBMTF ˠ σόοά৘ใඇදࣔ

  162. // 前略 <body> <a-scene arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate: 30;

    canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 <a-entity> <a-animation begin="click" attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> <a-entity camera mouse-cursor look-controls wasd-controls position="0 0 5"></a-entity> </a-scene> </body> // 以下省略 10. 11. 17. 18. 19. 20. 21. 22. 23. 24. "3ۭؒʹදࣔ͠Α͏ d8FCΧϝϥͷө૾Λදࣔ d 8FCΧϝϥΛ࢖༻͢Δ͜ͱʹΑͬͯࢹ఺ૢ࡞΍Ωʔૢ࡞ɺ Ґஔͷݻఆ͕ෆཁʹͳΔͨΊɺMPPLDPOUSPMTɺXBTE DPOUSPMTɺQPTJUJPOΛ࡟আɻ

  163. // 前略 <body> <a-scene arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate: 30;

    canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 <a-entity> <a-animation begin="click" attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> <a-entity camera mouse-cursor></a-entity> </a-scene> </body> // 以下省略 10. 11. 17. 18. 19. 20. 21. 22. 23. 24. "3ۭؒʹදࣔ͠Α͏ d8FCΧϝϥͷө૾Λදࣔ d DBNFSBͱNPVTFDVSTPS͸࡟আͤͣ࢒ͯ͠ ͓͘͜ͱɻ

  164. 4IPXΛΫϦοΫ࣮ͯ͠ߦ "3ۭؒʹදࣔ͠Α͏ d8FCΧϝϥͷө૾Λදࣔ d

  165. "3ۭؒʹදࣔ͠Α͏ d8FCΧϝϥͷө૾Λදࣔ d ϒϥ΢βʹ8FCΧϝϥͷө૾͕ දࣔ͞ΕͨΒ0,ɻ ͜ͷஈ֊Ͱ͸ϚʔΧʔʹ͔͟͠ ͯ΋Կ΋දࣔ͞Εͳ͍ɻ

  166. "3ۭؒʹදࣔ͠Α͏ dө૾ͷॎԣൺΛௐ੔ d ؀ڥʹΑͬͯ͸ө૾ͷॎԣൺ ่͕Εͯ͠·͏৔߹͕͋Δͷ Ͱௐ੔͢Δɻ

  167. ࣮ߦ݁ՌͷλϒΛดͯ͡ ฤूը໘ͷλϒ΁໭Δ "3ۭؒʹදࣔ͠Α͏ dө૾ͷॎԣൺΛௐ੔ d

  168. // 前略 <body> <a-scene arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate: 30;

    canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 <a-entity> <a-animation begin="click" attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> <a-entity camera mouse-cursor></a-entity> </a-scene> </body> // 以下省略 10. 11. 17. 18. 19. 20. 21. 22. 23. 24. BTDFOFʙBTDFOFʹ "3ۭؒʹදࣔ͠Α͏ dө૾ͷॎԣൺΛௐ੔ d

  169. // 前略 <body> <a-scene embedded arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate:

    30; canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 <a-entity> <a-animation begin="click" attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> <a-entity camera mouse-cursor></a-entity> </a-scene> </body> // 以下省略 10. 11. 17. 18. 19. 20. 21. 22. 23. 24. "3ۭؒʹදࣔ͠Α͏ dө૾ͷॎԣൺΛௐ੔ d FNCFEEFEΛ௥Ճɻ͜ΕΛࢦఆ͠ͳ͍ͱ8FCΧϝϥ ͔Βͷө૾ͷॎԣൺ่͕ΕΔ͜ͱ͕͋Δɻ

  170. 4IPXΛΫϦοΫ࣮ͯ͠ߦ "3ۭؒʹදࣔ͠Α͏ dө૾ͷॎԣൺΛௐ੔ d

  171. 8FCΧϝϥͷө૾ͷॎԣൺ่͕ΕΔ ͜ͱͳ͘දࣔ͞Ε͍ͯΕ͹0,ɻ "3ۭؒʹදࣔ͠Α͏ dө૾ͷॎԣൺΛௐ੔ d

  172. ࣮ߦ݁ՌͷλϒΛดͯ͡ ฤूը໘ͷλϒ΁໭Δ "3ۭؒʹදࣔ͠Α͏ dө૾ͷॎԣൺΛௐ੔ d

  173. // 前略 <body> <a-scene embedded arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate:

    30; canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 <a-entity> <a-animation begin="click" attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> <a-entity camera mouse-cursor></a-entity> </a-scene> </body> // 以下省略 10. 11. 17. 18. 19. 20. 21. 22. 23. 24. "3ۭؒʹදࣔ͠Α͏ d"3ϚʔΧʔʹ͔ͯ͟͠ίϯςϯπදࣔ d ݱঢ়Ͱ͸8FCΧϝϥΛ"3ϚʔΧʔʹ͔ͯ͟͠΋ ίϯςϯπͱ"3ϚʔΧʔͷؔ࿈෇͚͕Ͱ͖͍ͯ ͳ͍ͨΊԿ΋ى͜Βͳ͍ɻ Ξχϝʔγϣϯ࣌ʹׅͬͨ஍ٿͱμοΫͷ·ͱ· ΓΛɺ"3ϚʔΧʔͱؔ࿈෇͚Δඞཁ͕͋Δɻ

  174. // 前略 <body> <a-scene embedded arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate:

    30; canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 <a-entity> <a-animation begin="click" attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> <a-entity camera mouse-cursor></a-entity> </a-scene> </body> // 以下省略 10. 11. 17. 18. 19. 20. 21. 22. 23. 24. 25. 26. "3ۭؒʹදࣔ͠Α͏ d"3ϚʔΧʔʹ͔ͯ͟͠ίϯςϯπදࣔ d ஍ٿͱμοΫͷ·ͱ·ΓBFOUJUZʙBFOUJUZͷ ্ԼʹͦΕͧΕߦͣͭૠೖͯ͠

  175. // 前略 <body> <a-scene embedded arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate:

    30; canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 <a-marker preset="hiro"> <a-entity> <a-animation begin="click" attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> </a-marker> <a-entity camera mouse-cursor></a-entity> </a-scene> </body> // 以下省略 10. 11. 17. 18. 19. 20. 21. 22. 23. 24. 25. 26. "3ۭؒʹදࣔ͠Α͏ d"3ϚʔΧʔʹ͔ͯ͟͠ίϯςϯπදࣔ d BNBSLFSʙBNBSLFSͰғΉ͜ͱʹΑΓؔ࿈෇͚Δɻ ·ͨɺݕ஌͢Δ"3ϚʔΧʔͷλΠϓΛ)JSPʹ͢ΔͨΊQSFTFU Λ௥Ճ͢Δɻ

  176. 4IPXΛΫϦοΫ࣮ͯ͠ߦ "3ۭؒʹදࣔ͠Α͏ d"3ϚʔΧʔʹ͔ͯ͟͠ίϯςϯπදࣔ d

  177. ϚʔΧʔʹ͔ͯ͟͠஍ٿͱ μοΫ͕දࣔ͞ΕͨΒ0,ɻ "3ۭؒʹදࣔ͠Α͏ d"3ϚʔΧʔʹ͔ͯ͟͠ίϯςϯπදࣔ d

  178. ·ͩαΠζ΍Ґஔͷௐ੔͕ ඞཁɻ "3ۭؒʹදࣔ͠Α͏ d"3ίϯςϯπͷҐஔɾαΠζௐ੔ d

  179. ࣮ߦ݁ՌͷλϒΛดͯ͡ ฤूը໘ͷλϒ΁໭Δ "3ۭؒʹදࣔ͠Α͏ d"3ίϯςϯπͷҐஔɾαΠζௐ੔ d

  180. Z (-) X (+) Y (+) Z (+) Y (-)

    X (-) X: 0 Y: 0 Z: 0 ϚʔΧʔͱ ࠲ඪͷؔ܎ "3ۭؒʹදࣔ͠Α͏ d"3ίϯςϯπͷҐஔɾαΠζௐ੔ d

  181. ϚʔΧʔͷαΠζ ϝʔτϧ σϑΥϧτ ϝʔτϧ σϑΥϧτ • ϚʔΧʔͷαΠζ͸ҰลΛϝʔτϧͱΈ ͳ͢ɻ σϑΥϧτ •

    αΠζΛࢦఆ͢Δ৔߹͸ɺҰลͷ௕͞Λ ϝʔτϧ୯ҐͰࢦఆ͢Δɻ "3ۭؒʹදࣔ͠Α͏ d"3ίϯςϯπͷҐஔɾαΠζௐ੔ d

  182. // 前略 <body> <a-scene embedded arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate:

    30; canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 <a-marker preset="hiro"> <a-entity> <a-animation begin="click" attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0 0" rotation="0 0 0" scale="1 1 1" radius="1" src="#earth-jpg"></a-sphere> <a-obj-model position="2 0 0" rotation="0 0 0" scale="0.25 0.25 0.25" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> </a-marker> <a-entity camera mouse-cursor></a-entity> </a-scene> </body> // 以下省略 10. 11. 17. 18. 19. 20. 21. 22. 23. 24. 25. 26. "3ۭؒʹදࣔ͠Α͏ d"3ίϯςϯπͷҐஔɾαΠζௐ੔ d ݱ࣌఺Ͱ͸ϚʔΧʔʹରͯ͠஍ٿ΍μοΫ͕େ͖͗͢Δɻ ·ͨ஍ٿͷத৺͕ݪ఺ʹ͋ΔͨΊɺϚʔΧʔ͕஍ٿʹຒ΋Ε ͯ͠·͏ɻ

  183. // 前略 <body> <a-scene embedded arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate:

    30; canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 <a-marker preset="hiro"> <a-entity> <a-animation begin="click" attribute="rotation" from="0 0 0" to="0 360 0" dur="3000" easing="linear" repeat="true"></a-animation> <a-sphere position="0 0.5 0" rotation="0 0 0" scale="1 1 1" radius="0.5" src="#earth-jpg"></a-sphere> <a-obj-model position="1 0.5 0" rotation="0 0 0" scale="0.125 0.125 0.125" src="#duck-obj" mtl="#duck-mtl"></a-obj-model> </a-entity> </a-marker> <a-entity camera mouse-cursor></a-entity> </a-scene> </body> // 以下省略 10. 11. 17. 18. 19. 20. 21. 22. 23. 24. 25. 26. "3ۭؒʹදࣔ͠Α͏ d"3ίϯςϯπͷҐஔɾαΠζௐ੔ d ஍ٿ͕ϚʔΧʔͷதʹऩ·ΔαΠζͰɺ͔ͭɺ ϚʔΧʔͷ্ʹͪΐ͏Ͳ৐Δ͘Β͍ͷҐஔʹௐ੔ɻ μοΫͷαΠζɺҐஔ΋߹Θͤͯௐ੔ɻ

  184. 4IPXΛΫϦοΫ࣮ͯ͠ߦ "3ۭؒʹදࣔ͠Α͏ d"3ίϯςϯπͷҐஔɾαΠζௐ੔ d

  185. "3ۭؒʹදࣔ͠Α͏ d"3ίϯςϯπͷҐஔɾαΠζௐ੔ d ஍ٿ͕ϚʔΧʔ্ʹ͓͞·Δ͘Β͍ͷ ҐஔɾαΠζͰɺμοΫ΋ఔΑ͘ௐ੔ Ͱ͖͍ͯΕ͹0,

  186. ࣮ߦ݁ՌͷλϒΛดͯ͡ ฤूը໘ͷλϒ΁໭Δ "3ۭؒʹදࣔ͠Α͏ d"3ίϯςϯπͷҐஔɾαΠζௐ੔ d

  187. %ςΩετΛදࣔ͠Α͏

  188. // 前略 <head> <title>Hello, WebAR! - A-Frame &amp; AR.js</title> <meta

    name="description" content="Hello, WebAR! - A-Frame &amp; AR.js"> <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script> <script src="https://rawgit.com/mayognaise/aframe-mouse-cursor- component/master/dist/aframe-mouse-cursor-component.js"></script> <script src="https://rawgit.com/jeromeetienne/AR.js/master/aframe/build/aframe- ar.js"></script> </head> // 以下省略 3. 4. 5. 6. 7. 8. 9. 10. %ςΩετΛදࣔ͠Α͏ d%ςΩετදࣔϥΠϒϥϦͷಡΈࠐΈ d %ςΩετΛදࣔ͢ΔͨΊͷϥΠϒϥϦΛಡΈࠐΉɻ IFBEʙIFBE಺ͷ࠷ޙʹߦૠೖɻ

  189. // 前略 <head> <title>Hello, WebAR! - A-Frame &amp; AR.js</title> <meta

    name="description" content="Hello, WebAR! - A-Frame &amp; AR.js"> <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script> <script src="https://rawgit.com/mayognaise/aframe-mouse-cursor- component/master/dist/aframe-mouse-cursor-component.js"></script> <script src="https://rawgit.com/jeromeetienne/AR.js/master/aframe/build/aframe- ar.js"></script> <script src="https://rawgit.com/ngokevin/kframe/master/components/text- geometry/dist/aframe-text-geometry-component.js"></script> </head> // 以下省略 3. 4. 5. 6. 7. 8. 9. 10. %ςΩετΛදࣔ͠Α͏ d%ςΩετදࣔϥΠϒϥϦͷಡΈࠐΈ d TDSJQUʙTDSJQUΛهड़ͯ͠BGSBNFUFYUHFPNFUSZDPNQPOFOU ಡΈࠐΈɻ ˔DPQZBOEQBTUFUYUͷ <%ςΩετΛදࣔ͢ΔϥΠϒϥϦ> ͔Βίϐϖɻ

  190. // 前略 <a-scene embedded arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate: 30;

    canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 <a-marker preset="hiro"> <a-entity> // 中略 </a-entity> </a-marker> <a-entity camera mouse-cursor></a-entity> </a-scene> // 以下省略 12. 18. 19. 23. 24. 25. 26. 27. %ςΩετΛදࣔ͠Α͏ d%ςΩετͷ഑ஔ d "3ϚʔΧʔΛݕ஌ͨ͠Β%ςΩετ͕දࣔ͞ΕΔΑ͏ʹ͢Δɻ ͨͩ͠Ξχϝʔγϣϯ͸ߦΘͳ͍ɻ BNBSLFSʙBNBSLFS಺ͷ࠷ޙʹߦૠೖɻ

  191. // 前略 <a-scene embedded arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate: 30;

    canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 <a-marker preset="hiro"> <a-entity> // 中略 </a-entity> <a-entity position="-1.2 0 0.75" rotation="-30 0 0" text-geometry="value: #AR_Fukuoka; bevelEnabled: true; bevelSize: 0.016; bevelThickness: 0.016; size: 0.25;" material="color: cyan;"></a-entity> </a-marker> <a-entity camera mouse-cursor></a-entity> </a-scene> // 以下省略 12. 18. 19. 23. 24. 25. 26. 27. %ςΩετΛදࣔ͠Α͏ d%ςΩετͷ഑ஔ d BFOUJUZʙBFOUJUZΛ௥Ճ͠UFYUHFPNFUSZΛ෇͚Δɻ WBMVFͷ஋͸޷͖ͳӳ਺ࣈΛೖྗɻ σϑΥϧτͰ͸೔ຊޠෆՄ ˔DPQZBOEQBTUFUYUͷ <%ςΩετͷදࣔ> ͔Βίϐϖɻ

  192. 4IPXΛΫϦοΫ࣮ͯ͠ߦ %ςΩετΛදࣔ͠Α͏ d%ςΩετͷ഑ஔ d

  193. %ςΩετ͕දࣔ ͞ΕͨΒ0, %ςΩετΛදࣔ͠Α͏ d%ςΩετͷ഑ஔ d

  194. ࣮ߦ݁ՌͷλϒΛดͯ͡ ฤूը໘ͷλϒ΁໭Δ %ςΩετΛදࣔ͠Α͏ d%ςΩετͷ഑ஔ d

  195. // 前略 <a-scene embedded arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate: 30;

    canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 <a-marker preset="hiro"> <a-entity> // 中略 </a-entity> <a-entity position="-1.2 0 0.75" rotation="-30 0 0" text-geometry="value: #AR_Fukuoka; bevelEnabled: true; bevelSize: 0.016; bevelThickness: 0.016; size: 0.25;" material="color: cyan;"></a-entity> </a-marker> <a-entity camera mouse-cursor></a-entity> </a-scene> // 以下省略 12. 18. 19. 23. 24. 25. 26. 27. %ςΩετΛදࣔ͠Α͏ d%ςΩετͷղઆ d UFYUHFPNFUSZ ςΩετΛཱମతʹදࣔ͢Δɻ  WBMVF"3@'VLVPLB ˠ ೚ҙͷจࣈྻ σϑΥϧτϑΥϯτ͸೔ຊޠෆՄ  CFWFM&OBCMFEUSVF ˠ ϕϕϧ༗ޮ จࣈͷ֯ΛؙΊΔ  CFWFM4J[F ˠ ஋͕େ͖͍΄Ͳจࣈͷྠֲ͕ଠ͘ͳΔ  CFWFM5IJDLOFTT ˠ ஋͕େ͖͍΄Ͳ೑ްʹͳΔ  TJ[F ˠ ϕϕϧͷαΠζΛม͑ͣจࣈαΠζ͚ͩม͑Δ৔߹ʹࢦఆ

  196. +BWB4DSJQUͰΠϯλϥΫγϣϯ

  197. // 前略 <a-scene embedded arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate: 30;

    canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 <a-marker preset="hiro"> <a-entity> // 中略 </a-entity> <a-entity position="-1.2 0 0.75" rotation="-30 0 0" text-geometry="value: #AR_Fukuoka; bevelEnabled: true; bevelSize: 0.016; bevelThickness: 0.016; size: 0.25;" material="color: cyan;"></a-entity> </a-marker> <a-entity camera mouse-cursor></a-entity> </a-scene> // 以下省略 12. 18. 19. 23. 24. 25. 26. 27. +BWB4DSJQUͰΠϯλϥΫγϣϯ d%ςΩετͷΫϦοΫͰ8FCϖʔδΛΦʔϓϯ d ઌʹར༻ͨ͠ΫϦοΫݕ஌ϥΠϒϥϦΛԠ༻ͯ͠ɺ %ςΩετͷΫϦοΫ࣌ʹಛఆͷ8FCϖʔδΛ։͘ Α͏ʹ͢Δɻ·ͣ͸ઌʹ഑ஔͨ͠%ςΩετʹ

  198. // 前略 <a-scene embedded arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate: 30;

    canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 <a-marker preset="hiro"> <a-entity> // 中略 </a-entity> <a-entity id="arfukuoka" position="-1.2 0 0.75" rotation="-30 0 0" text- geometry="value: #AR_Fukuoka; bevelEnabled: true; bevelSize: 0.016; bevelThickness: 0.016; size: 0.25;" material="color: cyan;"></a-entity> </a-marker> <a-entity camera mouse-cursor></a-entity> </a-scene> // 以下省略 12. 18. 19. 23. 24. 25. 26. 27. JEΛ௥Ճͯ͠Ұҙͷ໊শΛ͚ͭΔ +BWB4DSJQUͰΠϯλϥΫγϣϯ d%ςΩετͷΫϦοΫͰ8FCϖʔδΛΦʔϓϯ d

  199. // 前略 <body> <a-scene embedded arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate:

    30; canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 </a-scene> </body> // 以下省略 11. 12. 27. 28. 29. 30. 31. 32. 29. %ςΩετΫϦοΫ࣌ͷڍಈΛهड़͢Δɻ BTDFOFʙBTDFOFͷԼʹߦૠೖͯ͠ +BWB4DSJQUͰΠϯλϥΫγϣϯ d%ςΩετͷΫϦοΫͰ8FCϖʔδΛΦʔϓϯ d

  200. // 前略 <body> <a-scene embedded arjs="sourceType: webcam; detectionMode: mono; maxDetectionRate:

    30; canvasWidth: 240; canvasHeight: 180; debugUIEnabled: false;"> // 中略 </a-scene> <script> document.getElementById("arfukuoka").addEventListener("click", function(evt) { window.open("https://twitter.com/search?q=%23ar_fukuoka", "_blank"); }, false); </script> </body> // 以下省略 11. 12. 27. 28. 29. 30. 31. 32. 29. +BWB4DSJQUͰΠϯλϥΫγϣϯ d%ςΩετͷΫϦοΫͰ8FCϖʔδΛΦʔϓϯ d TDSJQUʙTDSJQUΛ௥Ճͯ͠+BWB4DSJQUΛهड़ɻ͜͜Ͱ͸ɺ࣍ͷΑ͏ͳ ڍಈͱͳΔɻ  JE͕BSGVLVPLBͷཁૉ %ςΩετ ͰΫϦοΫΛݕ஌͢Δ  ࢦఆ63- BS@GVLVPLBͷ5XJUUFSݕࡧ݁Ռϖʔδ Λ৽͍͠λϒͰ։͘ ˔DPQZBOEQBTUFUYUͷ <+BWB4DSJQUͰͷΫϦοΫݕ஌> ͔Βίϐϖɻ

  201. 4IPXΛΫϦοΫ࣮ͯ͠ߦ +BWB4DSJQUͰΠϯλϥΫγϣϯ d%ςΩετͷΫϦοΫͰ8FCϖʔδΛΦʔϓϯ d

  202. %ςΩετΛΫϦοΫ +BWB4DSJQUͰΠϯλϥΫγϣϯ d%ςΩετͷΫϦοΫͰ8FCϖʔδΛΦʔϓϯ d

  203. +BWB4DSJQUͰΠϯλϥΫγϣϯ d%ςΩετͷΫϦοΫͰ8FCϖʔδΛΦʔϓϯ d ৽͍͠λϒͰ8FCϖʔδ ͕։͚͹0,

  204. ׬੒ʂ ͓ർΕ༷Ͱͨ͠ɻ