graph-mark
v1.0.1
Published
Mark the face frame in image and get the corresponding coordinates.
Downloads
2
Readme
Mark the face frame in image and get the corresponding coordinates. This lib is dependent on fabric.js.
Install
npm install fabric -S
npm install graph-mark -SQuick Start
import { fabric } from 'fabric'
import { Mark } from 'graph-mark'
let mark = new Mark({ canvasTagId: 'c', maxResultsLength: 1 })
mark.init(imgElement)Default options
defaultOptions = {
canvasTagId: null,
maxResultsLength: 1000000
}- canvasTagId: Canvas tag id.
- maxResultsLength: The number of rectangular box that can exist at the same time. default: 1000000
Examples of use
cdns
<!doctype html>
<html lang="en">
<head>
<title>cdn example of use</title>
<script src="./fabric.js"></script>
<script src="../lib/graph-mark.js"></script>
</head>
<body>
<img src="100x100x5.jpg" id="image1" style="display: none;">
<img src="avatar.jpg" id="image2" style="display: none;">
<canvas id="c" width="550" height="550"
style="margin-left: 20px; position: absolute; left: 20px; top: 20px; touch-action: none; user-select: none;border: 1px solid #333;"
class="lower-canvas"></canvas>
</body>
</html>
<script>
var mark = new GraphMark.Mark({canvasTagId: 'c', maxResultsLength: 1});
var imgElement = document.getElementById('image1');
mark.init(imgElement);
</script>You can test it on this demo.