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

A-Frameでお手軽WebAR

shinjism
July 30, 2017
Research
1
4k

 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
120
ARコンテンツ作成勉強会：VuforiaでつくるスマホAR+VRアプリ
shinjism
0
620
個人的にお気に入りのVuforia公式サンプル #AR_Fukuoka
shinjism
0
84
日本語でおk？
shinjism
0
220

Other Decks in Research

See All in Research
論文紹介 DSRNet: Single Image Reflection Separation via Component Synergy (ICCV 2023)
tattaka
0
180
CASCON 2023 Most Influential Paper Award Talk
tsantalis
0
120
LLMマルチエージェントを俯瞰する
masatoto
26
16k
Alternative Photographic Processes Reimagined: The Role of Digital Technology in Revitalizing Classic Printing Techniques【SIGGRAPH Asia 2023】
toremolo72
0
430
「歴史的農業環境閲覧システム」と「迅速測図」について
wata909
1
610
ニフティのインナーソース導入事例 - InnerSource Commons #11
niftycorp
PRO
0
260
Sosiaalisen median katsaus 02/2024
hponka
0
2.6k
[ICLR'24] Towards Assessing and Benchmarking Risk-Return Tradeoff of OPE
harukakiyohara_
0
200
Cross-Media Information Spaces and Architectures
signer
PRO
0
120
Refactoring Mining - The key to unlock software evolution
tsantalis
0
260
Generative Spoken Dialogue Language Modeling [対話論文読み会@電通大]
yuta0306
1
130
Breaking Tradeoffs: Extremely Scalable Multi-Agent Pathfinding Algorithms
kei18
0
150

Featured

See All Featured
Imperfection Machines: The Place of Print at Facebook
scottboms
260
12k
Fantastic passwords and where to find them - at NoRuKo
philnash
37
2.5k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
21
1.6k
Build The Right Thing And Hit Your Dates
maggiecrowley
24
2k
Ruby is Unlike a Banana
tanoku
96
10k
Bootstrapping a Software Product
garrettdimon
PRO
302
110k
Optimizing for Happiness
mojombo
370
69k
Why Our Code Smells
bkeepers
PRO
331
56k
Pencils Down: Stop Designing & Start Developing
hursman
117
11k
Web Components: a chance to create the future
zenorocha
305
41k
A Tale of Four Properties
chriscoyier
151
22k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
155
14k

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. ׬੒ʂ ͓ർΕ༷Ͱͨ͠ɻ