[{"data":1,"prerenderedAt":475},["ShallowReactive",2],{"news-item-\u002Fja\u002Fnews\u002Fnavigation-app":3},{"id":4,"title":5,"body":6,"category":460,"created by":463,"date":464,"description":465,"extension":466,"meta":467,"navigation":468,"path":469,"sections":470,"seo":471,"stem":472,"thumbnail":473,"__hash__":474},"content_ja\u002Fja\u002Fnews\u002Fnavigation-app.md","Navigation App",{"type":7,"value":8,"toc":448},"minimark",[9,14,21,55,60,79,83,88,104,109,130,134,179,183,212,216,219,236,247,252,255,266,269,273,277,280,284,288,293,304,309,334,339,344,348,351,356,361,367,375,381,396,400,406,412,418,424,430,436,442],[10,11,13],"h2",{"id":12},"_1-紹介","1. 紹介",[15,16,17],"p",{},[18,19,20],"strong",{},"1.1 Navigation Appとは",[22,23,25,40],"div",{"style":24},"margin-left: 16px;",[15,26,27,28,35,39],{},"1. このアプリケーションはGPSを使って目的地を簡単に見つけてくれます。 ",[29,30,34],"a",{"href":31,"rel":32},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FAugmented_reality",[33],"nofollow","Augmented Reality",[29,36,38],{"href":31,"rel":37},[33],"[1]",", AR(Augmented Reality)の技術で、現実世界の中に目的地を表示します。",[15,41,42,43,48,49,54],{},"2. ARについての記述資料として iOS (use ARKit",[29,44,47],{"href":45,"rel":46},"https:\u002F\u002Fdeveloper.apple.com\u002Faugmented-reality\u002F",[33],"[2]"," - Apple) 、 Android (use ARCore",[29,50,53],{"href":51,"rel":52},"https:\u002F\u002Fdevelopers.google.com\u002Far\u002F",[33],"[3]"," - Google)をご参照ください。",[15,56,57],{},[18,58,59],{},"1.2 Navigation Appの動作",[22,61,62,65,73,76],{"style":24},[15,63,64],{},"1. GPSを使い現在地を取得する。",[15,66,67,68],{},"2. ARを使い端末のモーションセンサーで表示している物体の動きを追い、現実世界を写しているカメラの向きや動きを組み合わせます。",[29,69,72],{"href":70,"rel":71},"https:\u002F\u002Fdevelopers.google.com\u002Far\u002Fdiscover\u002Fconcepts",[33],"[4]",[15,74,75],{},"3. この組み合わせた情報を使用することで現実の世界に3Dの物体を組み合わせたものを2Dのスクリーンに描写することができます。",[15,77,78],{},"4. 表面を特定するためのコントラストの調整がとても重要です。表面が白すぎても、暗すぎてもうまく動作をさせることができません。",[10,80,82],{"id":81},"_2開発に必要なもの","2. 開発に必要なもの",[15,84,85],{},[18,86,87],{},"2.1 iOS",[22,89,90,93,101],{"style":24},[15,91,92],{},"1. iOS 11 またはそれ以降のバージョン",[15,94,95,96],{},"2. A9 processor またはそれ以降のiOS端末 (iPhone SE, 6S またはそれ以降のバージョン, all iPads Pro models, iPad 2017 またはそれ以降のバージョン).",[29,97,100],{"href":98,"rel":99},"https:\u002F\u002Fdeveloper.apple.com\u002Flibrary\u002Farchive\u002Fdocumentation\u002FDeviceInformation\u002FReference\u002FiOSDeviceCompatibility\u002FDeviceCompatibilityMatrix\u002FDeviceCompatibilityMatrix.html",[33],"[5]",[15,102,103],{},"3. Xcode 10.2.1 またはそれ以降のバージョン",[15,105,106],{},[18,107,108],{},"2.2 Android",[22,110,111,114,127],{"style":24},[15,112,113],{},"1. Android 7.0 (Nougat) またはそれ以降のバージョン",[15,115,116,117,122,123],{},"2. ARCoreサポート端末。対象端末は ",[29,118,121],{"href":119,"rel":120},"https:\u002F\u002Fdevelopers.google.com\u002Far\u002Fdiscover\u002Fsupported-devices",[33],"こちら","を参照。",[29,124,126],{"href":119,"rel":125},[33],"[6]",[15,128,129],{},"3. Android Studio 3.1 またはそれ以降のバージョン",[10,131,133],{"id":132},"_3-iosクイックスタート","3. iOSクイックスタート",[22,135,136,139,142,145,155,158,162,165,175],{"style":24},[15,137,138],{},"3.1 Xcodeを開ける",[15,140,141],{},"3.2 Choose File ➤ New ➤ Projectを押下します。",[15,143,144],{},"3.3 \"Augmented Reality App\"アイコンを押下し、 \"Next\"ボタンを押下します。次に\"product name\", \"organization name\", \"organization identifiers\"を入力します。",[146,147],"img",{"className":148,"alt":152,"src":153,"style":154},[149,150,151],"block","mx-auto","mb-4","","https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151250\u002F1.png","width: 100%",[15,156,157],{},"3.4 Content technology ➤ SceneKitを押下します。",[146,159],{"className":160,"alt":152,"src":161,"style":154},[149,150,151],"https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151310\u002F2.png",[15,163,164],{},"3.5 Info.plist:",[166,167,168,172],"ul",{},[169,170,171],"li",{},"“Privacy - Camera Usage Description”と“Privacy - Location When In Use Usage Description”のKeyとdescriptionsを追加します。",[169,173,174],{},"“Required device capabilities”のTypeを“arkit”に設定します。",[146,176],{"className":177,"alt":152,"src":178,"style":154},[149,150,151],"https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151411\u002F3.png",[10,180,182],{"id":181},"_4-android-クイックスタート","4. Android クイックスタート",[22,184,185,188,191,194,198,201,205,208],{"style":24},[15,186,187],{},"4.1 Android studioを開けます。",[15,189,190],{},"4.2 Choose File ➤ New ➤ New Projectを押下します。",[15,192,193],{},"4.3 root buildに\"JitPack\"を追加します。その後gradleのrepositoriesの最後に下記のように追加します。",[146,195],{"className":196,"alt":152,"src":197,"style":154},[149,150,151],"https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151432\u002Fimage-3.png",[15,199,200],{},"4.4 build.gradleのdependencyにSceneformライブラリを追加します。",[146,202],{"className":203,"alt":152,"src":204,"style":154},[149,150,151],"https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151449\u002Fimage-5.png",[15,206,207],{},"4.5 ManifestにARCoreの使用の許可を追加します。",[146,209],{"className":210,"alt":152,"src":211,"style":154},[149,150,151],"https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151506\u002Fimage-4.png",[10,213,215],{"id":214},"_5-主な機能","5. 主な機能",[15,217,218],{},"5.1 現在地周辺の目的地を現実世界とアレンジしたような形で目的地の距離を表示します。現在地が変更されると目的地までの距離も変更されます。",[22,220,225,226,231,232],{"className":221},[222,223,224],"flex","justify-center","gap-4","\n  ",[146,227],{"className":228,"alt":152,"src":229,"style":230},[149,150,151],"https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151635\u002F5.jpg","width: 50%"," \n  ",[146,233],{"className":234,"alt":152,"src":235,"style":230},[149,150,151],"https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151630\u002F4.jpg",[22,237,225,239,231,243],{"className":238},[222,223,224],[146,240],{"className":241,"alt":152,"src":242,"style":230},[149,150,151],"https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151705\u002F6.jpg",[146,244],{"className":245,"alt":152,"src":246,"style":230},[149,150,151],"https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151708\u002F7.jpg",[146,248],{"className":249,"alt":152,"src":250,"style":251},[149,150,151],"https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151729\u002F8.jpg","width: 70%",[15,253,254],{},"5.2 カテゴリと目的地のリストの表示と検索ができます。このスクリーンで目的地を表示するかどうかを選択することができます。",[22,256,225,258,231,262],{"className":257},[222,223,224],[146,259],{"className":260,"alt":152,"src":261,"style":230},[149,150,151],"https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151759\u002F9.png",[146,263],{"className":264,"alt":152,"src":265,"style":230},[149,150,151],"https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151804\u002F10.png",[15,267,268],{},"5.3 マルチ言語サポート。現在日本語、英語、ベトナム語で表示ができます。",[146,270],{"className":271,"alt":152,"src":272,"style":251},[149,150,151],"https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151835\u002F11.png",[146,274],{"className":275,"alt":152,"src":276,"style":251},[149,150,151],"https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151839\u002F12.png",[15,278,279],{},"5.4 目的地の情報を表示。選んだ目的の情報を表示することができます。",[146,281],{"className":282,"alt":152,"src":283,"style":251},[149,150,151],"https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151858\u002F13.png",[10,285,287],{"id":286},"_6-感想","6. 感想",[15,289,290],{},[18,291,292],{},"6.1 GPSの位置の誤差",[22,294,295,298,301],{"style":24},[15,296,297],{},"1. 実際のところコンパスは正確に動作していますが、位置情報については一時的に実際とは離れた位置を取得することがあります。",[15,299,300],{},"2. androidとiOSで少し機能の差があります。位置情報が異なる値で返ってくることがあり、取得したものをそのまま表示し比較すると異なった位置で表示されてしまうことがあります。",[15,302,303],{},"3. 標高についても異なって表示されることがあります。Android端末では時々標高自体がアプリ起動中に取れないこともありました。",[15,305,306],{},[18,307,308],{},"6.2 端末でAR上に場所を表示",[22,310,311,314,328,331],{"style":24},[15,312,313],{},"1. 端末内にカメラで表示している画像に実際の場所をマッピングさせる開発にはかなりの時間が取られました。なぜならロケーションを取得するSDKが時々正常に動作せず、 ロケーションSDKのARを使ったロケーションではなく、計算をしてARに場所の表示を行うようにしました。",[166,315,316,319,322,325],{},[169,317,318],{},"Step 1: 位置情報から目的地までの距離を計算し、次に、一時的なタイトルと距離を含むViewを作成します。",[169,320,321],{},"Step 2: 計算した距離情報を3D ARで表示するため3D用の位置情報(x, y, z)にコンバートします。",[169,323,324],{},"Step 3: Step1で作成したViewをStep2で作成した位置情報でViewの縮尺を計算し、ARのスクリーンに追加します。",[169,326,327],{},"P\u002FS: 現在地が移動している間、一定時間ごとに距離を計算し表示を行います。",[15,329,330],{},"2. それ以外に、表示をわかりやすくするために距離でソートを行いその順番で表示します。ただ、あまりに近いと高度の表示に影響が出ます。",[15,332,333],{},"3. 最後に、カメラの表示やそのほかの表示に影響を与えないようにしながら、距離情報のウィンドウをドラッグで動かせるようにしました。",[15,335,336],{},[18,337,338],{},"6.3 バッテリー消費の注意",[22,340,341],{"style":24},[15,342,343],{},"1. カメラとGPSこの２つの機能がかなりのバッテリーを消費します。それはアプリを使用中いつも起動しているからです。このようなことから、長時間使用していると端末がかなり熱くなることがあります。",[10,345,347],{"id":346},"_7改善点","7. 改善点",[15,349,350],{},"ユーザにこのアプリケーションの使用感を上げるためには、いくつかのパフォーマンスの改善を行う必要があると思います。",[15,352,353],{},[18,354,355],{},"7.1 距離により場所の表示を調整する。",[22,357,358],{"style":24},[15,359,360],{},"1. Android,iOS両方でかなり短い距離の場合の表示では画面のすぐ前に距離のウィンドウが表示されます。この場合、ほかの距離の表示も全てはっきり見えるように、AR上の距離の計算を行い端末に適応した表示にアレンジする必要があります。",[15,362,363,366],{},[18,364,365],{},"7.2 全ての距離表示ウィンドウの再表示の停止"," 定期的に、アプリは全ての距離表示を距離測定から再計算し新しい値としてアップデートします。 例えば改善点は下記です。",[22,368,369,372],{"style":24},[15,370,371],{},"1. もし半径10m以内の現在地の変更であれば、全ての再表示は行わない。",[15,373,374],{},"2. カメラを動かすだけのスクリーン上の移動であれば、UIの再表示は行わない。",[10,376,378],{"id":377},"_8-謝辞",[18,379,380],{},"8. 謝辞",[15,382,383,384,389,390,395],{},"このアプリでは、",[29,385,388],{"href":386,"rel":387},"https:\u002F\u002Fgithub.com\u002FProjectDent\u002FARKit-CoreLocation",[33],"ProjectDent[7]"," (iOS) と ",[29,391,394],{"href":392,"rel":393},"https:\u002F\u002Fgithub.com\u002Fappoly\u002FARCore-Location",[33],"Appoly[8]"," (Android)を使用させて頂いてます。",[10,397,399],{"id":398},"_9参考文献","9.参考文献:",[15,401,402,403],{},"[1] ",[29,404,31],{"href":31,"rel":405},[33],[15,407,408,409],{},"[2] ",[29,410,45],{"href":45,"rel":411},[33],[15,413,414,415],{},"[3] ",[29,416,51],{"href":51,"rel":417},[33],[15,419,420,421],{},"[4] ",[29,422,70],{"href":70,"rel":423},[33],[15,425,426,427],{},"[5] ",[29,428,429],{"href":98},"\nApple Device Compatibility Matrix\n",[15,431,432,433],{},"[6] ",[29,434,119],{"href":119,"rel":435},[33],[15,437,438,439],{},"[7] ",[29,440,386],{"href":386,"rel":441},[33],[15,443,444,445],{},"[8] ",[29,446,392],{"href":392,"rel":447},[33],{"title":152,"searchDepth":449,"depth":449,"links":450},2,[451,452,453,454,455,456,457,458,459],{"id":12,"depth":449,"text":13},{"id":81,"depth":449,"text":82},{"id":132,"depth":449,"text":133},{"id":181,"depth":449,"text":182},{"id":214,"depth":449,"text":215},{"id":286,"depth":449,"text":287},{"id":346,"depth":449,"text":347},{"id":377,"depth":449,"text":380},{"id":398,"depth":449,"text":399},[461,462],"tech talk","mobile","Briswell Vietnam Co Ltd","2019-08-30","1.1 Navigation Appとは- このアプリケーションはGPSを使って目的地を簡単に見つけてくれます。AR(Augmented Reality)の技術で、現実世界の中に目的地を表示します。","md",{},true,"\u002Fja\u002Fnews\u002Fnavigation-app",null,{"title":5,"description":465},"ja\u002Fnews\u002Fnavigation-app","https:\u002F\u002Fhomepage-media.s3.ap-southeast-1.amazonaws.com\u002Fwp-content\u002Fuploads\u002F2019\u002F08\u002F05151107\u002Fnaviapp_bar1.png","Ja2jJ_P45YbH_kBt0_iKNaZZ3Mvd-v86ujFhgBUkTUY",1785320532158]