This toolkit provides a set of components and utilities for developers to add an augmented experience to their website. For example, a primary use-case supported is the ability to detect barcodes (in -- say -- a real-world store) with the user's device camera, and to show them extended information on a given product.
Please see our Getting Started guide.
Included in this toolkit:
- Device Support Detection
- Barcode Detector
- getUserMedia and environment camera
- Geolocation
- Wasm
- Detectors
- UI
- Loader
- Card
- User onboarding
- Utilities
- Stream capture (i.e.
getUserMediato image conversion) - Logging
- Image resizing
- Stream capture (i.e.
Please check out our Getting Started guide for far more information.
Briefly, however: we recommend installation via npm. Simply:
npm install --save perception-toolkit
A few starting samples are under demo, where you can see how to set up barcode detection and the display of values to the end user. The most basic is demo/simple, and this may be a good starting point in your own project. Once you copy demo/simple/index.html into your own project, you'll need a few small modifications to refer to the Web Perception Toolkit installed in node_modules (and assuming that node_modules is available at the root of your server, as it is with our sample server):
-
You must specify
rootin the existingwindow.PerceptionToolkit.config:window.PerceptionToolkit.config = { root: '/node_modules/perception-toolkit', ... } -
You must change the location of
bootstrap.js(included at the end of<body>):<script src="/node_modules/perception-toolkit/lib/bundled/bootstrap.js"></script>
We're glad you're excited and want to help out! Please read our contributing guide for hints.
git clone https://github.com/GoogleChromeLabs/perception-toolkitnpm inpm run buildnpm run serve- Open the demo page at localhost:8080
npm test
Note: coverage data can be found in the generated coverage/ directory located in the project root.
npm run docs
Note: docs can be found in the generated docs directory located in the project root.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent