You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+93-63Lines changed: 93 additions & 63 deletions
Original file line number
Diff line number
Diff line change
@@ -1,6 +1,14 @@
1
1
# ARToolKit.js
2
2
3
-
Emscripten port of [ARToolKit](https://github.com/artoolkit/artoolkit5) to JavaScript.
3
+
Emscripten port of [ARToolKit](https://github.com/artoolkitx/artoolkit5) to JavaScript.
4
+
5
+
## MArkers Types
6
+
7
+
JSARToolKit5 support these types of markers:
8
+
- Square pictorial markers
9
+
- Square barcode markers
10
+
- Multi square markers set
11
+
- NFT (natural feature tracking) markers
4
12
5
13
---
6
14
**NOTE:**
@@ -43,7 +51,7 @@ See examples/simple_image_wasm.html for details.
43
51
2. Clone ARToolKit5 project to get the latest source files. From within jsartoolkit5 directory do `git submodule update --init`. If you already cloned ARToolKit5 to a different directory you can:
44
52
- create a link in the `jsartoolkit5/emscripten/` directory that points to ARToolKit5 (`jsartoolkit5/emscripten/artoolkit5`) (Linux and macOS only)
45
53
- or, set the `ARTOOLKIT5_ROOT` environment variable to point to your ARToolKit5 clone
46
-
- or, change the `tools/makem.js` file to point to your artoolkit5 clone (line 62, 83, 107, 140)
54
+
- or, change the `tools/makem.js` file to point to your artoolkit5 clone (line 20)
47
55
48
56
## Build the project
49
57
@@ -68,13 +76,13 @@ To prevent issues with Emscripten setup and to not have to maintain several buil
We used emscripten version **1.39.5-fastcomp**~~1.38.44-fastcomp~~
72
80
73
81
jsartoolkit5 aim is to create a Javascript version of artoolkit5. First, you need the artoolkit5 repository on your machine:
74
82
2. Clone ARToolKit5 project to get the latest source files. From within jsartoolkit5 directory do `git submodule update --init`. If you already cloned ARToolKit5 to a different directory you can:
75
83
- create a link in the `jsartoolkit5/emscripten/` directory that points to ARToolKit5 (`jsartoolkit5/emscripten/artoolkit5`)
76
84
- or, set the `ARTOOLKIT5_ROOT` environment variable to point to your ARToolKit5 clone
77
-
- or, change the `tools/makem.js` file to point to your artoolkit5 clone (line 62, 83, 107, 140)
85
+
- or, change the `tools/makem.js` file to point to your artoolkit5 clone (line 20)
78
86
79
87
3. Building
80
88
1. Make sure `EMSCRIPTEN` env variable is set (e.g. `EMSCRIPTEN=/usr/lib/emsdk_portable/emscripten/master/ node tools/makem.js`
@@ -85,35 +93,35 @@ During development, you can run ```npm run watch```, it will rebuild the library
85
93
86
94
4. The built ASM.js files are in `/build`. There's a build with debug symbols in `artoolkit.debug.js` and the optimized build with bundled JS API in `artoolkit.min.js`.
@@ -122,11 +130,11 @@ console.log("Three.js helper API loaded");
122
130
};
123
131
if (window.ARController&&window.ARController.getUserMediaThreeScene) {
124
132
ARThreeOnLoad();
125
-
}
133
+
};
126
134
</script>
127
135
```
128
136
129
-
# Examples
137
+
##Examples
130
138
131
139
See `examples/` for examples on using the raw API and the Three.js helper API.
132
140
@@ -139,8 +147,10 @@ The basic operation goes like this:
139
147
5. Add a `'getMarker'` event listener
140
148
6. Call `ARController.process(img)`
141
149
150
+
### Basic example with an image source and a pattern marker ( hiro )
151
+
142
152
```js
143
-
<script src="build/artoolkit.min.js"></script>
153
+
<script src="../build/artoolkit.min.js"></script>
144
154
<script>
145
155
var param =newARCameraParam();
146
156
@@ -172,57 +182,47 @@ The basic operation goes like this:
172
182
</script>
173
183
```
174
184
175
-
## Public
176
-
177
-
*the calls your JS apps needs*
178
-
179
-
-`artoolkit.init(path, camera_param_path)` - load path for artoolkit emscripten files
180
-
-`artoolkit.onReady(callback)` - runs callback when artoolkit has completely downloaded, initalized and ready to run
181
-
-`artoolkit.setup(width, height);` - initalize a buffer size for a canvas of width & height
182
-
-`artoolkit.process(canvas);` - extracts a frame from a canvas and process it
183
-
-`artoolkit.debugSetup()` - enables debugging, adds a threshold image to the dom
184
-
-`artoolkit.getDetectedMarkers()` - returns an array of detected markers from last detection process
185
-
-`artoolkit.getCameraMatrix()` - returns the projection matrix computed from camera parameters
186
-
-`artoolkit.getTransformationMatrix()` - returns the 16-element WebGL transformation matrix
187
-
188
-
## Internals
185
+
### Basic example with a worker and a NFT marker
189
186
190
-
*calls called from emscripten runtime -> artoolkit.js*
187
+
**NFT** (**N**atural **F**eature **T**racking) is a markerless technology that let you track almost any images you want. To use this feature take a look at the **nft_improved_worker** example folder. If you want to create your custom NFT marker you can use the online tool [NFT-Marker-Creator](https://carnaux.github.io/NFT-Marker-Creator/). Before proceeding with the creation of your markers, carefully read the information on the [wiki](https://github.com/Carnaux/NFT-Marker-Creator/wiki/Creating-good-markers).
191
188
192
-
-`artoolkit.onFrameMalloc(object)` - gets called when frame buffer gets allocated for canvas
193
-
-`artoolkit.onMarkerNum(number)` - gets called with the numbers of markers detected
194
-
-`artoolkit.onGetMarker(object, index)` - gets called with the marker struct for the positioned marker
0 commit comments