How to detect eyes in a photo in Node.js
3 min readMay 20, 2019
For this task, we want to find the specific pixel locations of the eyes in a photo. Not just the location of the face — but we need to find the location of the eyes.
The first step is to add a reference to the library and then run npm install:
"dependencies": {
"cloudmersive-image-api-client": "^1.1.5"
}From here, we need to call the faceLocateWithLandmarks method on our input image:
var CloudmersiveImageApiClient = require('cloudmersive-image-api-client');
var defaultClient = CloudmersiveImageApiClient.ApiClient.instance;// Configure API key authorization: Apikey
var Apikey = defaultClient.authentications['Apikey'];
Apikey.apiKey = 'YOUR API KEY';var apiInstance = new CloudmersiveImageApiClient.FaceApi();var imageFile = Buffer.from(fs.readFileSync("C:\\temp\\inputfile").buffer); // File | Image file to perform the operation on. Common file formats such as PNG, JPEG are supported.var callback = function(error, data, response) {
if (error) {
console.error(error);
} else {
console.log('API called successfully. Returned data: ' + data);
}
};
apiInstance.faceLocateWithLandmarks(imageFile, callback);
Here, landmarks refers to the eyes, nose, mouth, cheeks, eyebrows, and other key landmarks of the photo.
Once we call this method, we will get output that looks something like this:
{
"ErrorDetails": null,
"Successful": true,
"Faces": [
{
"LeftEyebrow": [
{
"X": 610,
"Y": 287
},
{
"X": 637,
"Y": 271
},
{
"X": 669,
"Y": 266
},
{
"X": 696,
"Y": 278
},
{
"X": 577,
"Y": 346
}
],
"RightEyebrow": [
null,
null,
null,
null,
null
],
"LeftEye": [
{
"X": 498,
"Y": 361
},
{
"X": 520,
"Y": 357
},
{
"X": 541,
"Y": 368
},
{
"X": 523,
"Y": 378
},
{
"X": 501,
"Y": 383
},
{
"X": 620,
"Y": 343
}
],
"RightEye": [
{
"X": 633,
"Y": 321
},
{
"X": 655,
"Y": 312
},
{
"X": 674,
"Y": 318
},
{
"X": 663,
"Y": 333
},
{
"X": 641,
"Y": 340
},
{
"X": 561,
"Y": 503
}
],
"BottomAndSidesOfFace": [
{
"X": 449,
"Y": 430
},
{
"X": 467,
"Y": 466
},
{
"X": 486,
"Y": 501
},
{
"X": 509,
"Y": 532
},
{
"X": 541,
"Y": 558
},
{
"X": 576,
"Y": 580
},
{
"X": 616,
"Y": 596
},
{
"X": 654,
"Y": 592
},
{
"X": 687,
"Y": 573
},
{
"X": 712,
"Y": 539
},
{
"X": 730,
"Y": 503
},
{
"X": 743,
"Y": 465
},
{
"X": 745,
"Y": 424
},
{
"X": 743,
"Y": 382
},
{
"X": 738,
"Y": 340
},
{
"X": 728,
"Y": 299
},
{
"X": 446,
"Y": 355
}
],
"NoseBridge": [
{
"X": 585,
"Y": 372
},
{
"X": 593,
"Y": 399
},
{
"X": 602,
"Y": 425
},
{
"X": 582,
"Y": 451
}
],
"NoseBottom": [
{
"X": 596,
"Y": 452
},
{
"X": 611,
"Y": 452
},
{
"X": 622,
"Y": 442
},
{
"X": 633,
"Y": 433
},
{
"X": 484,
"Y": 378
}
],
"LipsInnerOutline": [
{
"X": 607,
"Y": 503
},
{
"X": 624,
"Y": 499
},
{
"X": 639,
"Y": 493
},
{
"X": 674,
"Y": 474
},
{
"X": 643,
"Y": 493
},
{
"X": 627,
"Y": 500
},
{
"X": 610,
"Y": 503
}
],
"LipsOuterOutline": [
{
"X": 583,
"Y": 493
},
{
"X": 603,
"Y": 484
},
{
"X": 620,
"Y": 483
},
{
"X": 634,
"Y": 474
},
{
"X": 657,
"Y": 470
},
{
"X": 685,
"Y": 466
},
{
"X": 669,
"Y": 499
},
{
"X": 650,
"Y": 518
},
{
"X": 634,
"Y": 526
},
{
"X": 616,
"Y": 529
},
{
"X": 590,
"Y": 526
},
{
"X": 573,
"Y": 506
}
],
"LeftX": 439,
"TopY": 267,
"RightX": 749,
"BottomY": 577
}
],
"FaceCount": 1
}Here, we can see the zero-based X/Y locations of all of the key landmarks, with multiple vertices for each. We are now done!
