Skip to content

webarkit/ARnft

Folders and files

NameName
Last commit message
Last commit date

Latest commit

c856cf0 · May 26, 2021
May 26, 2021
May 24, 2021
May 22, 2021
Apr 21, 2020
May 24, 2021
Nov 9, 2020
Apr 21, 2020
May 24, 2021
May 26, 2021
Nov 9, 2020
May 26, 2021

Repository files navigation

ARnft - WebAR with NFT

A small javascript library to develop WebAR apps. It is based on jsartoolkitNFT a lighter version of jsartoolkit5 only with NFT markerless technology. It use ARnft-threejs for the rendering part.

Start using it !

1️⃣   Clone the repository:

git clone https://github.com/webarkit/ARnft.git

2️⃣   Install the npm packages:

yarn install

3️⃣   Run the node server:

http-server . -p 8000

4️⃣   Go to the example:

http://localhost:8000/examples/arNFT_example.html

5️⃣   Point your device 📱 to the pinball image 👇 a red cube will appear !

Usage

Download the zipped dist lib package from the releases page: webarkit/ARnft/releases and use it in a script tag:

<script src="path/to/dist/ARnft.js"></script>

or you can use raw.githack services (for development):

<script src="https://raw.githack.com/webarkit/ARnft/master/dist/ARnft.js"></script>

or raw.cdn (for production, you need to add the hash):

<script src="https://rawcdn.githack.com/webarkit/ARnft/<hash>/dist/ARnft.js"></script>

or if you want to import as a module with npm:

import { ARnft } from '@webarkit/ar-nft';

Examples

Test the examples in the /examples folder:

  • arNft_container_example.html Example with an alternative container.
  • arNFT_event_example.html Example with objVisibility and eventListener.
  • arNFT_example.html The simplest example displaying a red cube.
  • arNFT_gltf_brave_robot_example.html More advanced example with a gltf model and threejs events.
  • arNFT_gltf_example.html Example showing a gltf model (Duck).
  • arNFT_image_example.html Example showing an image.
  • arNFT_video_example.html Example showing a video.

You can try also a live example with React at this link: kalwalt.github.io/ARnft-ES6-react/

Features

npm i @webarkit/ar-nft
  • Configuration data in an External .json file.