資訊專欄INFORMATION COLUMN
摘要：隨著隨身電子產(chǎn)品運算能力的提升，預(yù)期增強(qiáng)現(xiàn)實的用途將會越來越廣。本文介紹使用開源框架實現(xiàn)的增強(qiáng)現(xiàn)實的例子。點擊允許用手機(jī)上的攝像頭掃描這張圖片神奇的事情就發(fā)生了。
增強(qiáng)現(xiàn)實技術(shù)（Augmented Reality，簡稱 AR），是一種實時地計算攝影機(jī)影像的位置及角度并加上相應(yīng)圖像、視頻、3D模型的技術(shù)，這種技術(shù)的目標(biāo)是在屏幕上把虛擬世界套在現(xiàn)實世界并進(jìn)行互動。這種技術(shù)1990年提出。隨著隨身電子產(chǎn)品CPU運算能力的提升，預(yù)期增強(qiáng)現(xiàn)實的用途將會越來越廣。
本文介紹使用JavaScript開源框架AR.js實現(xiàn)的增強(qiáng)現(xiàn)實的Hello World例子。
先看效果：
首先在手機(jī)瀏覽器里打開我部署在github page上的這個demo應(yīng)用：
https://i042416.github.io/FioriODataTestTool2014/WebContent/098_ar.html
我用的是Android手機(jī)安裝的Chrome瀏覽器。
打開網(wǎng)頁，會提示你是否允許這個網(wǎng)頁應(yīng)用訪問您的手機(jī)攝像頭。點擊允許：
用手機(jī)上的攝像頭掃描這張圖片：
神奇的事情就發(fā)生了。您會看到，通過手機(jī)攝像頭望過去，手機(jī)屏幕里會出現(xiàn)一個新的不斷滾動的3D物體，如下圖所示。
下面具體介紹這個最簡單的例子是怎么開發(fā)出來的。
所有的源代碼在我的github上：
https://github.com/i042416/FioriODataTestTool2014/tree/master/WebContent/ar
新建一個html文件，把下列150行代碼粘貼進(jìn)去，然后在服務(wù)器上運行，使用之前描述的步驟即可進(jìn)行AR測試：
當(dāng)然，這個效果來自大神jeromeetienne開源的AR.js:
https://github.com/jeromeetienne/AR.js/
當(dāng)然大神自己也很謙虛地提到，他這個開源的增強(qiáng)現(xiàn)實框架也是建立在巨人的肩膀上開發(fā)的：比如其中3D效果的繪制，使用到了另一個開源框架three.js:
要獲取更多Jerry的原創(chuàng)文章，請關(guān)注公眾號"汪子熙":
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/101065.html
摘要：解構(gòu)是很重要的一個部分。解構(gòu)代碼如下上面的代碼表示聲明兩個變量然后。實際業(yè)務(wù)中長方形的是不能沒有值的。都算正常值的范疇。解構(gòu)進(jìn)階解構(gòu)時同時使用重命名和設(shè)置默認(rèn)值的語法。若有，若沒有屬性，那么將賦值為。 Destructuring解構(gòu)是ES6很重要的一個部分。和箭頭函數(shù)、let、const 同等地位，解構(gòu)可能是你日常用到最多的語法之一了。解構(gòu)是什么意思呢？它是js 表達(dá)式，允許我們從數(shù)組...
摘要：增強(qiáng)現(xiàn)實以下簡稱浪潮正滾滾而來，瀏覽器作為人們最唾手可得的人機(jī)交互終端，正在大力發(fā)展技術(shù)。目前年底前端要想實現(xiàn)，都是靠的視頻透視式技術(shù)。但這兩個都是移動的，于是谷歌的團(tuán)隊提供了和兩個庫，以便開發(fā)者能用技術(shù)來基于和開發(fā)，從而實現(xiàn)。 本文作者 GeekPlux，博客地址：http://geekplux.com/2018/01/18/augmented-reality-development...
閱讀 2556·2021-11-22 15:35
閱讀 3830·2021-11-04 16:14
閱讀 2774·2021-10-20 13:47
閱讀 2587·2021-10-13 09:49
閱讀 2138·2019-08-30 14:09
閱讀 2500·2019-08-26 13:49
閱讀 948·2019-08-26 10:45
閱讀 2842·2019-08-23 17:54
