pull/22/head
parent
bf859d24fd
commit
478c571b6d
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -0,0 +1,201 @@
|
||||
(function() {
|
||||
/*
|
||||
|
||||
Copyright The Closure Library Authors.
|
||||
SPDX-License-Identifier: Apache-2.0
|
||||
*/
|
||||
'use strict';
|
||||
|
||||
function h(a) {
|
||||
var c = 0;
|
||||
return function() {
|
||||
return c < a.length ? {
|
||||
done: !1,
|
||||
value: a[c++]
|
||||
} : {
|
||||
done: !0
|
||||
}
|
||||
}
|
||||
}
|
||||
var l = "function" == typeof Object.defineProperties ? Object.defineProperty : function(a, c, b) {
|
||||
if (a == Array.prototype || a == Object.prototype) return a;
|
||||
a[c] = b.value;
|
||||
return a
|
||||
};
|
||||
|
||||
function m(a) {
|
||||
a = ["object" == typeof globalThis && globalThis, a, "object" == typeof window && window, "object" == typeof self && self, "object" == typeof global && global];
|
||||
for (var c = 0; c < a.length; ++c) {
|
||||
var b = a[c];
|
||||
if (b && b.Math == Math) return b
|
||||
}
|
||||
throw Error("Cannot find global object");
|
||||
}
|
||||
var n = m(this);
|
||||
|
||||
function p(a, c) {
|
||||
if (c) a: {
|
||||
var b = n;a = a.split(".");
|
||||
for (var d = 0; d < a.length - 1; d++) {
|
||||
var e = a[d];
|
||||
if (!(e in b)) break a;
|
||||
b = b[e]
|
||||
}
|
||||
a = a[a.length - 1];d = b[a];c = c(d);c != d && null != c && l(b, a, {
|
||||
configurable: !0,
|
||||
writable: !0,
|
||||
value: c
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
function q(a) {
|
||||
var c = "undefined" != typeof Symbol && Symbol.iterator && a[Symbol.iterator];
|
||||
return c ? c.call(a) : {
|
||||
next: h(a)
|
||||
}
|
||||
}
|
||||
var r = "function" == typeof Object.assign ? Object.assign : function(a, c) {
|
||||
for (var b = 1; b < arguments.length; b++) {
|
||||
var d = arguments[b];
|
||||
if (d)
|
||||
for (var e in d) Object.prototype.hasOwnProperty.call(d, e) && (a[e] = d[e])
|
||||
}
|
||||
return a
|
||||
};
|
||||
p("Object.assign", function(a) {
|
||||
return a || r
|
||||
});
|
||||
p("Array.prototype.fill", function(a) {
|
||||
return a ? a : function(c, b, d) {
|
||||
var e = this.length || 0;
|
||||
0 > b && (b = Math.max(0, e + b));
|
||||
if (null == d || d > e) d = e;
|
||||
d = Number(d);
|
||||
0 > d && (d = Math.max(0, e + d));
|
||||
for (b = Number(b || 0); b < d; b++) this[b] = c;
|
||||
return this
|
||||
}
|
||||
});
|
||||
|
||||
function t(a) {
|
||||
return a ? a : Array.prototype.fill
|
||||
}
|
||||
p("Int8Array.prototype.fill", t);
|
||||
p("Uint8Array.prototype.fill", t);
|
||||
p("Uint8ClampedArray.prototype.fill", t);
|
||||
p("Int16Array.prototype.fill", t);
|
||||
p("Uint16Array.prototype.fill", t);
|
||||
p("Int32Array.prototype.fill", t);
|
||||
p("Uint32Array.prototype.fill", t);
|
||||
p("Float32Array.prototype.fill", t);
|
||||
p("Float64Array.prototype.fill", t);
|
||||
var u = this || self;
|
||||
|
||||
function v(a, c) {
|
||||
a = a.split(".");
|
||||
var b = u;
|
||||
a[0] in b || "undefined" == typeof b.execScript || b.execScript("var " + a[0]);
|
||||
for (var d; a.length && (d = a.shift());) a.length || void 0 === c ? b[d] && b[d] !== Object.prototype[d] ? b = b[d] : b = b[d] = {} : b[d] = c
|
||||
};
|
||||
var w = {
|
||||
color: "white",
|
||||
lineWidth: 4,
|
||||
radius: 6,
|
||||
visibilityMin: .5
|
||||
};
|
||||
|
||||
function x(a) {
|
||||
a = a || {};
|
||||
return Object.assign(Object.assign(Object.assign({}, w), {
|
||||
fillColor: a.color
|
||||
}), a)
|
||||
}
|
||||
|
||||
function y(a, c) {
|
||||
return a instanceof Function ? a(c) : a
|
||||
}
|
||||
|
||||
function z(a, c, b) {
|
||||
return Math.max(Math.min(c, b), Math.min(Math.max(c, b), a))
|
||||
}
|
||||
v("clamp", z);
|
||||
v("drawLandmarks", function(a, c, b) {
|
||||
if (c) {
|
||||
b = x(b);
|
||||
a.save();
|
||||
var d = a.canvas,
|
||||
e = 0;
|
||||
c = q(c);
|
||||
for (var f = c.next(); !f.done; f = c.next())
|
||||
if (f = f.value, void 0 !== f && (void 0 === f.visibility || f.visibility > b.visibilityMin)) {
|
||||
a.fillStyle = y(b.fillColor, {
|
||||
index: e,
|
||||
from: f
|
||||
});
|
||||
a.strokeStyle = y(b.color, {
|
||||
index: e,
|
||||
from: f
|
||||
});
|
||||
a.lineWidth = y(b.lineWidth, {
|
||||
index: e,
|
||||
from: f
|
||||
});
|
||||
var g = new Path2D;
|
||||
g.arc(f.x * d.width, f.y * d.height, y(b.radius, {
|
||||
index: e,
|
||||
from: f
|
||||
}), 0, 2 * Math.PI);
|
||||
a.fill(g);
|
||||
a.stroke(g);
|
||||
++e
|
||||
} a.restore()
|
||||
}
|
||||
});
|
||||
v("drawConnectors", function(a, c, b, d) {
|
||||
if (c && b) {
|
||||
d = x(d);
|
||||
a.save();
|
||||
var e = a.canvas,
|
||||
f = 0;
|
||||
b = q(b);
|
||||
for (var g = b.next(); !g.done; g = b.next()) {
|
||||
var k = g.value;
|
||||
a.beginPath();
|
||||
g = c[k[0]];
|
||||
k = c[k[1]];
|
||||
g && k && (void 0 === g.visibility || g.visibility > d.visibilityMin) && (void 0 === k.visibility || k.visibility > d.visibilityMin) && (a.strokeStyle = y(d.color, {
|
||||
index: f,
|
||||
from: g,
|
||||
to: k
|
||||
}), a.lineWidth = y(d.lineWidth, {
|
||||
index: f,
|
||||
from: g,
|
||||
to: k
|
||||
}), a.moveTo(g.x * e.width, g.y * e.height), a.lineTo(k.x * e.width, k.y * e.height));
|
||||
++f;
|
||||
a.stroke()
|
||||
}
|
||||
a.restore()
|
||||
}
|
||||
});
|
||||
v("drawRectangle", function(a, c, b) {
|
||||
b = x(b);
|
||||
a.save();
|
||||
var d = a.canvas;
|
||||
a.beginPath();
|
||||
a.lineWidth = y(b.lineWidth, {});
|
||||
a.strokeStyle = y(b.color, {});
|
||||
a.fillStyle = y(b.fillColor, {});
|
||||
a.translate(c.xCenter * d.width, c.yCenter * d.height);
|
||||
a.rotate(c.rotation * Math.PI / 180);
|
||||
a.rect(-c.width / 2 * d.width, -c.height / 2 * d.height, c.width * d.width, c.height * d.height);
|
||||
a.translate(-c.xCenter * d.width, -c.yCenter * d.height);
|
||||
a.stroke();
|
||||
a.fill();
|
||||
a.restore()
|
||||
});
|
||||
v("lerp", function(a, c, b, d, e) {
|
||||
return z(d * (1 - (a - c) / (b - c)) + e * (1 - (b - a) / (b - c)), d, e)
|
||||
});
|
||||
}).call(this);
|
||||
Binary file not shown.
@ -0,0 +1,194 @@
|
||||
|
||||
var Module = typeof createMediapipeSolutionsPackedAssets !== 'undefined' ? createMediapipeSolutionsPackedAssets : {};
|
||||
|
||||
if (!Module.expectedDataFileDownloads) {
|
||||
Module.expectedDataFileDownloads = 0;
|
||||
}
|
||||
|
||||
Module.expectedDataFileDownloads++;
|
||||
(function() {
|
||||
// When running as a pthread, FS operations are proxied to the main thread, so we don't need to
|
||||
// fetch the .data bundle on the worker
|
||||
if (Module['ENVIRONMENT_IS_PTHREAD']) return;
|
||||
var loadPackage = function(metadata) {
|
||||
|
||||
var PACKAGE_PATH = '';
|
||||
if (typeof window === 'object') {
|
||||
PACKAGE_PATH = window['encodeURIComponent'](window.location.pathname.toString().substring(0, window.location.pathname.toString().lastIndexOf('/')) + '/');
|
||||
} else if (typeof process === 'undefined' && typeof location !== 'undefined') {
|
||||
// web worker
|
||||
PACKAGE_PATH = encodeURIComponent(location.pathname.toString().substring(0, location.pathname.toString().lastIndexOf('/')) + '/');
|
||||
}
|
||||
var PACKAGE_NAME = 'blaze-out/k8-opt/genfiles/third_party/mediapipe/web/solutions/hands/hands_solution_packed_assets.data';
|
||||
var REMOTE_PACKAGE_BASE = 'hands_solution_packed_assets.data';
|
||||
if (typeof Module['locateFilePackage'] === 'function' && !Module['locateFile']) {
|
||||
Module['locateFile'] = Module['locateFilePackage'];
|
||||
err('warning: you defined Module.locateFilePackage, that has been renamed to Module.locateFile (using your locateFilePackage for now)');
|
||||
}
|
||||
var REMOTE_PACKAGE_NAME = Module['locateFile'] ? Module['locateFile'](REMOTE_PACKAGE_BASE, '') : REMOTE_PACKAGE_BASE;
|
||||
|
||||
var REMOTE_PACKAGE_SIZE = metadata['remote_package_size'];
|
||||
var PACKAGE_UUID = metadata['package_uuid'];
|
||||
|
||||
function fetchRemotePackage(packageName, packageSize, callback, errback) {
|
||||
if (typeof process === 'object' && typeof process.versions === 'object' && typeof process.versions.node === 'string') {
|
||||
require('fs').readFile(packageName, function(err, contents) {
|
||||
if (err) {
|
||||
errback(err);
|
||||
} else {
|
||||
callback(contents.buffer);
|
||||
}
|
||||
});
|
||||
return;
|
||||
}
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.open('GET', packageName, true);
|
||||
xhr.responseType = 'arraybuffer';
|
||||
xhr.onprogress = function(event) {
|
||||
var url = packageName;
|
||||
var size = packageSize;
|
||||
if (event.total) size = event.total;
|
||||
if (event.loaded) {
|
||||
if (!xhr.addedTotal) {
|
||||
xhr.addedTotal = true;
|
||||
if (!Module.dataFileDownloads) Module.dataFileDownloads = {};
|
||||
Module.dataFileDownloads[url] = {
|
||||
loaded: event.loaded,
|
||||
total: size
|
||||
};
|
||||
} else {
|
||||
Module.dataFileDownloads[url].loaded = event.loaded;
|
||||
}
|
||||
var total = 0;
|
||||
var loaded = 0;
|
||||
var num = 0;
|
||||
for (var download in Module.dataFileDownloads) {
|
||||
var data = Module.dataFileDownloads[download];
|
||||
total += data.total;
|
||||
loaded += data.loaded;
|
||||
num++;
|
||||
}
|
||||
total = Math.ceil(total * Module.expectedDataFileDownloads/num);
|
||||
if (Module['setStatus']) Module['setStatus']('Downloading data... (' + loaded + '/' + total + ')');
|
||||
} else if (!Module.dataFileDownloads) {
|
||||
if (Module['setStatus']) Module['setStatus']('Downloading data...');
|
||||
}
|
||||
};
|
||||
xhr.onerror = function(event) {
|
||||
throw new Error("NetworkError for: " + packageName);
|
||||
}
|
||||
xhr.onload = function(event) {
|
||||
if (xhr.status == 200 || xhr.status == 304 || xhr.status == 206 || (xhr.status == 0 && xhr.response)) { // file URLs can return 0
|
||||
var packageData = xhr.response;
|
||||
callback(packageData);
|
||||
} else {
|
||||
throw new Error(xhr.statusText + " : " + xhr.responseURL);
|
||||
}
|
||||
};
|
||||
xhr.send(null);
|
||||
};
|
||||
|
||||
function handleError(error) {
|
||||
console.error('package error:', error);
|
||||
};
|
||||
|
||||
var fetchedCallback = null;
|
||||
var fetched = Module['getPreloadedPackage'] ? Module['getPreloadedPackage'](REMOTE_PACKAGE_NAME, REMOTE_PACKAGE_SIZE) : null;
|
||||
|
||||
if (!fetched) fetchRemotePackage(REMOTE_PACKAGE_NAME, REMOTE_PACKAGE_SIZE, function(data) {
|
||||
if (fetchedCallback) {
|
||||
fetchedCallback(data);
|
||||
fetchedCallback = null;
|
||||
} else {
|
||||
fetched = data;
|
||||
}
|
||||
}, handleError);
|
||||
|
||||
function runWithFS() {
|
||||
|
||||
function assert(check, msg) {
|
||||
if (!check) throw msg + new Error().stack;
|
||||
}
|
||||
Module['FS_createPath']("/", "third_party", true, true);
|
||||
Module['FS_createPath']("/third_party", "mediapipe", true, true);
|
||||
Module['FS_createPath']("/third_party/mediapipe", "modules", true, true);
|
||||
Module['FS_createPath']("/third_party/mediapipe/modules", "palm_detection", true, true);
|
||||
Module['FS_createPath']("/third_party/mediapipe/modules", "hand_landmark", true, true);
|
||||
|
||||
/** @constructor */
|
||||
function DataRequest(start, end, audio) {
|
||||
this.start = start;
|
||||
this.end = end;
|
||||
this.audio = audio;
|
||||
}
|
||||
DataRequest.prototype = {
|
||||
requests: {},
|
||||
open: function(mode, name) {
|
||||
this.name = name;
|
||||
this.requests[name] = this;
|
||||
Module['addRunDependency']('fp ' + this.name);
|
||||
},
|
||||
send: function() {},
|
||||
onload: function() {
|
||||
var byteArray = this.byteArray.subarray(this.start, this.end);
|
||||
this.finish(byteArray);
|
||||
},
|
||||
finish: function(byteArray) {
|
||||
var that = this;
|
||||
|
||||
Module['FS_createPreloadedFile'](this.name, null, byteArray, true, true, function() {
|
||||
Module['removeRunDependency']('fp ' + that.name);
|
||||
}, function() {
|
||||
if (that.audio) {
|
||||
Module['removeRunDependency']('fp ' + that.name); // workaround for chromium bug 124926 (still no audio with this, but at least we don't hang)
|
||||
} else {
|
||||
err('Preloading file ' + that.name + ' failed');
|
||||
}
|
||||
}, false, true); // canOwn this data in the filesystem, it is a slide into the heap that will never change
|
||||
|
||||
this.requests[this.name] = null;
|
||||
}
|
||||
};
|
||||
|
||||
var files = metadata['files'];
|
||||
for (var i = 0; i < files.length; ++i) {
|
||||
new DataRequest(files[i]['start'], files[i]['end'], files[i]['audio'] || 0).open('GET', files[i]['filename']);
|
||||
}
|
||||
|
||||
function processPackageData(arrayBuffer) {
|
||||
assert(arrayBuffer, 'Loading data file failed.');
|
||||
assert(arrayBuffer instanceof ArrayBuffer, 'bad input to processPackageData');
|
||||
var byteArray = new Uint8Array(arrayBuffer);
|
||||
var curr;
|
||||
// Reuse the bytearray from the XHR as the source for file reads.
|
||||
DataRequest.prototype.byteArray = byteArray;
|
||||
var files = metadata['files'];
|
||||
for (var i = 0; i < files.length; ++i) {
|
||||
DataRequest.prototype.requests[files[i].filename].onload();
|
||||
} Module['removeRunDependency']('datafile_blaze-out/k8-opt/genfiles/third_party/mediapipe/web/solutions/hands/hands_solution_packed_assets.data');
|
||||
|
||||
};
|
||||
Module['addRunDependency']('datafile_blaze-out/k8-opt/genfiles/third_party/mediapipe/web/solutions/hands/hands_solution_packed_assets.data');
|
||||
|
||||
if (!Module.preloadResults) Module.preloadResults = {};
|
||||
|
||||
Module.preloadResults[PACKAGE_NAME] = {fromCache: false};
|
||||
if (fetched) {
|
||||
processPackageData(fetched);
|
||||
fetched = null;
|
||||
} else {
|
||||
fetchedCallback = processPackageData;
|
||||
}
|
||||
|
||||
}
|
||||
if (Module['calledRun']) {
|
||||
runWithFS();
|
||||
} else {
|
||||
if (!Module['preRun']) Module['preRun'] = [];
|
||||
Module["preRun"].push(runWithFS); // FS is not initialized yet, wait for it
|
||||
}
|
||||
|
||||
}
|
||||
loadPackage({"files": [{"filename": "/third_party/mediapipe/modules/palm_detection/palm_detection_lite.tflite", "start": 0, "end": 1985440}, {"filename": "/third_party/mediapipe/modules/palm_detection/palm_detection_full.tflite", "start": 1985440, "end": 4326720}, {"filename": "/third_party/mediapipe/modules/hand_landmark/handedness.txt", "start": 4326720, "end": 4326731}], "remote_package_size": 4326731, "package_uuid": "f2b11ac8-0259-41a9-b49f-d0fb8d91f87d"});
|
||||
|
||||
})();
|
||||
File diff suppressed because one or more lines are too long
Binary file not shown.
File diff suppressed because one or more lines are too long
Binary file not shown.
@ -0,0 +1,27 @@
|
||||
{
|
||||
"name": "@mediapipe/hands",
|
||||
"version": "0.4.1646424915",
|
||||
"description": "Mediapipe Hands Solution",
|
||||
"main": "hands.js",
|
||||
"module": "hands.js",
|
||||
"jsdelivr": "hands.js",
|
||||
"unpkg": "hands.js",
|
||||
"types": "index.d.ts",
|
||||
"author": "mhays@google.com",
|
||||
"license": "Apache-2.0",
|
||||
"homepage": "https://google.github.io/mediapipe/solutions/hands",
|
||||
"keywords": [ "AR", "ML", "Augmented" ],
|
||||
"devDependencies": {
|
||||
},
|
||||
"scripts": {
|
||||
"test": "echo \"Error: no test specified\" && exit 1"
|
||||
},
|
||||
"dependencies": {
|
||||
},
|
||||
"browser": {
|
||||
"node-fetch": false,
|
||||
"util": false,
|
||||
"crypto": false
|
||||
},
|
||||
"sideEffects" : []
|
||||
}
|
||||
@ -0,0 +1,162 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<script src="/static/hand/camera_utils.js" crossorigin="anonymous"></script>
|
||||
<script src="/static/hand/control_utils.js" crossorigin="anonymous"></script>
|
||||
<script src="/static/hand/drawing_utils.js" crossorigin="anonymous"></script>
|
||||
<script src="/static/hand/hands.js" crossorigin="anonymous"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container">
|
||||
<canvas class="output_canvas" width="1280px" height="720px"></canvas>
|
||||
</div>
|
||||
<button id="clean" onclick="clean()">清空</button>
|
||||
<div id="txtHint"></div>
|
||||
<script>
|
||||
function clean() {
|
||||
var obj = document.getElementById("txtHint");
|
||||
obj.innerHTML="";
|
||||
}
|
||||
</script>
|
||||
<script type="module">
|
||||
function ajax(str) {
|
||||
var xmlhttp;
|
||||
if (str.length==0)
|
||||
{
|
||||
document.getElementById("txtHint").innerHTML="";
|
||||
return;
|
||||
}
|
||||
if (window.XMLHttpRequest) xmlhttp=new XMLHttpRequest();
|
||||
else xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
|
||||
xmlhttp.onreadystatechange=function()
|
||||
{
|
||||
if (xmlhttp.readyState==4 && xmlhttp.status==200)
|
||||
{
|
||||
var xml = xmlhttp.responseText
|
||||
xml = xml.slice(33,xml.length-2);
|
||||
document.getElementById("txtHint").innerHTML+=xml;
|
||||
num=0
|
||||
}
|
||||
}
|
||||
xmlhttp.open("GET","/trans?str="+str,true)
|
||||
xmlhttp.send();
|
||||
}
|
||||
|
||||
const videoElement = document.createElement("video");
|
||||
const canvasElement = document.getElementsByClassName('output_canvas')[0];
|
||||
const canvasCtx = canvasElement.getContext('2d');
|
||||
var str =""
|
||||
var pre=str
|
||||
var num=2
|
||||
function onResults(results) {
|
||||
canvasCtx.save();
|
||||
canvasCtx.clearRect(0, 0, canvasElement.width, canvasElement.height);
|
||||
canvasCtx.drawImage(results.image, 0, 0, canvasElement.width, canvasElement.height);
|
||||
if (results.multiHandLandmarks) {
|
||||
var Left=[0,0,0,0,0,0,0,0,0]
|
||||
var Right=[0,0,0,0,0,0,0,0,0]
|
||||
for (let i = 0; i < results.multiHandLandmarks.length; i++) {
|
||||
var hand_lable=results.multiHandedness[i].label
|
||||
if (hand_lable=="Left"){
|
||||
Left[0]=1
|
||||
var wrist=results.multiHandLandmarks[i][0]
|
||||
var index_finger_mcp=results.multiHandLandmarks[i][5]
|
||||
var index_finger_tip=results.multiHandLandmarks[i][8]
|
||||
var middle_finger_mcp=results.multiHandLandmarks[i][9]
|
||||
var middle_finger_tip=results.multiHandLandmarks[i][12]
|
||||
var ring_finger_mcp=results.multiHandLandmarks[i][13]
|
||||
var ring_finger_tip=results.multiHandLandmarks[i][16]
|
||||
var pinky_mcp=results.multiHandLandmarks[i][17]
|
||||
var pinky_tip=results.multiHandLandmarks[i][20]
|
||||
|
||||
var one_x = index_finger_mcp.x-pinky_mcp.x
|
||||
var one_y = index_finger_mcp.y-pinky_mcp.y
|
||||
|
||||
if (Math.abs(one_x)>Math.abs(one_y)) {
|
||||
Left[3]=1;//平
|
||||
if (one_x>0) Left[1]=1;//正
|
||||
var tow = index_finger_mcp.y-wrist.y;
|
||||
if (tow<0) Left[2]=1;//上
|
||||
var length = Math.abs(middle_finger_mcp.y-wrist.y)/3;
|
||||
if (Math.abs(index_finger_tip.y-index_finger_mcp.y)>length) Left[5]=1;
|
||||
if (Math.abs(middle_finger_tip.y-middle_finger_mcp.y)>length) Left[6]=1;
|
||||
if (Math.abs(ring_finger_tip.y-ring_finger_mcp.y)>length) Left[7]=1;
|
||||
if (Math.abs(pinky_tip.y-pinky_mcp.y)>length) Left[8]=1;
|
||||
} else {
|
||||
var length = Math.abs(one_y)/3;
|
||||
if (Math.abs(index_finger_mcp.x-index_finger_tip.x)>length) Left[5]=1;
|
||||
if (Math.abs(middle_finger_mcp.x-middle_finger_tip.x)>length) Left[6]=1;
|
||||
if (Math.abs(ring_finger_mcp.x-ring_finger_tip.x)>length) Left[7]=1;
|
||||
if (Math.abs(pinky_mcp.x-pinky_tip.x)>length) Left[8]=1;
|
||||
}
|
||||
} else {
|
||||
Right[0]=1
|
||||
var wrist=results.multiHandLandmarks[i][0]
|
||||
var index_finger_mcp=results.multiHandLandmarks[i][5]
|
||||
var index_finger_tip=results.multiHandLandmarks[i][8]
|
||||
var middle_finger_mcp=results.multiHandLandmarks[i][9]
|
||||
var middle_finger_tip=results.multiHandLandmarks[i][12]
|
||||
var ring_finger_mcp=results.multiHandLandmarks[i][13]
|
||||
var ring_finger_tip=results.multiHandLandmarks[i][16]
|
||||
var pinky_mcp=results.multiHandLandmarks[i][17]
|
||||
var pinky_tip=results.multiHandLandmarks[i][20]
|
||||
|
||||
var one_x = index_finger_mcp.x-pinky_mcp.x
|
||||
var one_y = index_finger_mcp.y-pinky_mcp.y
|
||||
if (Math.abs(one_x)>Math.abs(one_y)) {
|
||||
Right[3]=1;//平
|
||||
if (one_x>0) Right[1]=1;//正
|
||||
var tow = index_finger_mcp.y-wrist.y;
|
||||
if (tow<0) Right[2]=1;//上
|
||||
var length = Math.abs(middle_finger_mcp.y-wrist.y)/3;
|
||||
if (Math.abs(index_finger_tip.y-index_finger_mcp.y)>length) Right[5]=1;
|
||||
if (Math.abs(middle_finger_tip.y-middle_finger_mcp.y)>length) Right[6]=1;
|
||||
if (Math.abs(ring_finger_tip.y-ring_finger_mcp.y)>length) Right[7]=1;
|
||||
if (Math.abs(pinky_tip.y-pinky_mcp.y)>length) Right[8]=1;
|
||||
} else {
|
||||
var length = Math.abs(one_y)/3;
|
||||
if (Math.abs(index_finger_mcp.x-index_finger_tip.x)>length) Right[5]=1;
|
||||
if (Math.abs(middle_finger_mcp.x-middle_finger_tip.x)>length) Right[6]=1;
|
||||
if (Math.abs(ring_finger_mcp.x-ring_finger_tip.x)>length) Right[7]=1;
|
||||
if (Math.abs(pinky_mcp.x-pinky_tip.x)>length) Right[8]=1;
|
||||
}
|
||||
}
|
||||
pre=str
|
||||
str=''
|
||||
for (let j = 0; j < Left.length; j++) str+=Left[j]
|
||||
str+='|'
|
||||
for (let j = 0; j < Right.length; j++) str+=Right[j]
|
||||
if (pre==str) num=num+1
|
||||
console.log(pre,str,num)
|
||||
if (num==20) ajax(str)
|
||||
drawConnectors(canvasCtx, results.multiHandLandmarks[i], HAND_CONNECTIONS,
|
||||
{color: '#00FF00', lineWidth: 5});
|
||||
drawLandmarks(canvasCtx, results.multiHandLandmarks[i], {color: '#FF0000', lineWidth: 2});
|
||||
}
|
||||
}
|
||||
canvasCtx.restore();
|
||||
}
|
||||
|
||||
const hands = new Hands({locateFile: (file) => {
|
||||
return `/static/hand/${file}`;
|
||||
}});
|
||||
hands.setOptions({
|
||||
maxNumHands: 2,
|
||||
modelComplexity: 1,
|
||||
minDetectionConfidence: 0.5,
|
||||
minTrackingConfidence: 0.5
|
||||
});
|
||||
hands.onResults(onResults);
|
||||
const camera = new Camera(videoElement, {
|
||||
onFrame: async () => {
|
||||
await hands.send({image: videoElement});
|
||||
},
|
||||
width: 1280,
|
||||
height: 720
|
||||
});
|
||||
camera.start();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,81 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<script src="https://cdn.jsdelivr.net/npm/@mediapipe/camera_utils/camera_utils.js" crossorigin="anonymous"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/@mediapipe/control_utils/control_utils.js" crossorigin="anonymous"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/@mediapipe/drawing_utils/drawing_utils.js" crossorigin="anonymous"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/@mediapipe/hands/hands.js" crossorigin="anonymous"></script>
|
||||
<title>手语翻译</title>
|
||||
<link rel="stylesheet" type="text/css" href="./main/test1.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="box">
|
||||
<div class="top">
|
||||
</div>
|
||||
<div class="container">
|
||||
<canvas class="output_canvas"></canvas>
|
||||
</div>
|
||||
<div class="container1">
|
||||
<script type="module">
|
||||
const videoElement = document.createElement("video");
|
||||
const canvasElement = document.getElementsByClassName('output_canvas')[0];
|
||||
const canvasCtx = canvasElement.getContext('2d');
|
||||
|
||||
function onResults(results) {
|
||||
canvasCtx.save();
|
||||
canvasCtx.clearRect(0, 0, canvasElement.width, canvasElement.height);
|
||||
canvasCtx.drawImage(results.image, 0, 0, canvasElement.width, canvasElement.height);
|
||||
if (results.multiHandLandmarks) {
|
||||
for (const landmarks of results.multiHandLandmarks) {
|
||||
console.log(landmarks)
|
||||
drawConnectors(canvasCtx, landmarks, HAND_CONNECTIONS,
|
||||
{color: '#00FF00', lineWidth: 5});
|
||||
drawLandmarks(canvasCtx, landmarks, {color: '#FF0000', lineWidth: 2});
|
||||
}
|
||||
}
|
||||
canvasCtx.restore();
|
||||
}
|
||||
|
||||
const hands = new Hands({locateFile: (file) => {
|
||||
return `https://cdn.jsdelivr.net/npm/@mediapipe/hands/${file}`;
|
||||
}});
|
||||
hands.setOptions({
|
||||
maxNumHands: 2,
|
||||
modelComplexity: 1,
|
||||
minDetectionConfidence: 0.5,
|
||||
minTrackingConfidence: 0.5
|
||||
});
|
||||
hands.onResults(onResults);
|
||||
const camera = new Camera(videoElement, {
|
||||
onFrame: async () => {
|
||||
await hands.send({image: videoElement});
|
||||
},
|
||||
width: 1280,
|
||||
height: 720
|
||||
});
|
||||
camera.start();
|
||||
|
||||
</script>
|
||||
</div>
|
||||
<div class="button1">
|
||||
<button>START</button>
|
||||
<button>DESTORY</button>
|
||||
<button>SUMIT</button>
|
||||
</div>
|
||||
<div class="output">
|
||||
<output name = "shuchu" type = "text"></output>
|
||||
</div>
|
||||
<div class="button2">
|
||||
<a href="./test1.html">
|
||||
<button id="btn4" class="btn">VIDEO</button>
|
||||
</a>
|
||||
<a href="./test2.html">
|
||||
<button id="btn5" class="btn">WORD</button>
|
||||
</a>
|
||||
</div>
|
||||
<script src="https://cdn.jsdelivr.net/npm/@mediapipe/hands/hands_solution_packed_assets_loader.js" crossorigin="anonymous"></script><script src="https://cdn.jsdelivr.net/npm/@mediapipe/hands/hands_solution_simd_wasm_bin.js" crossorigin="anonymous">
|
||||
</script>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,36 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>手语翻译</title>
|
||||
<link rel="stylesheet" type="text/css" href="./main/test2.css">
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
|
||||
<script type="importmap">
|
||||
{
|
||||
"imports":{
|
||||
"three":"./main/three.module.js",
|
||||
"three/addons/":"./main/"
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="box">
|
||||
<div id="container">
|
||||
</div>
|
||||
<div class="input">
|
||||
<input id="txt" type="text">
|
||||
<button type="button" id="btn" onclick="loadXMLDoc(txt.value)">start</button>
|
||||
</div>
|
||||
<div class="button2">
|
||||
<a href="./test1.html">
|
||||
<button id="btn4" class="btn4" onclick="add">VIDEO</button>
|
||||
</a>
|
||||
<a href="./test2.html">
|
||||
<button id="btn5" class="btn5">WORD</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script type="module" src="./main/main2_class2.js" ></script>
|
||||
</html>
|
||||
@ -0,0 +1,31 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>手语翻译</title>
|
||||
<link rel="stylesheet" type="text/css" href="/static/1.css">
|
||||
<script src="/static/three.js-r122/build/three.js"></script>
|
||||
<script src="/static/three.js-r122/examples/jsm/controls/OrbitControls.js" type="module"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="box">
|
||||
<div id="container">
|
||||
</div>
|
||||
<div class="input">
|
||||
<input type="text">
|
||||
</div>
|
||||
<div class="button2">
|
||||
<a href="./test1.html">
|
||||
<button id="btn4" class="btn4">VIDEO</button>
|
||||
</a>
|
||||
<a href="./test2.html">
|
||||
<button id="btn5" class="btn5">WORD</button>
|
||||
</a>
|
||||
<a href="./test3.html">
|
||||
<button id="btn6" class="btn6">SETTING</button>
|
||||
</a>
|
||||
</div>
|
||||
<script type="module" src="/static/three.js" ></script>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in new issue