├── _config.yml ├── images ├── dog.jfif └── im.png ├── README.md ├── index.html ├── posenet_check.html ├── imageclassifier.html ├── videoclassifer.html ├── imgmodels.js ├── vidmodels.js └── posenetcheck.js /_config.yml: -------------------------------------------------------------------------------- 1 | theme: jekyll-theme-time-machine -------------------------------------------------------------------------------- /images/dog.jfif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ksdkamesh99/MLBrowse/master/images/dog.jfif -------------------------------------------------------------------------------- /images/im.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ksdkamesh99/MLBrowse/master/images/im.png -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # MLBrowse 2 | 3 | it is a repository which contains the implementation of browser based nueral networks using ml5.js and p5.js 4 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 |

Welcome to MLBrowse

8 | Image Classifier

9 | Video Real time classifier(Mobile Net) 10 | 11 | -------------------------------------------------------------------------------- /posenet_check.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Posenet Demo 5 | 6 | 7 | 8 | 9 | 10 | 11 |

12 | 13 | -------------------------------------------------------------------------------- /imageclassifier.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Image Classifer 5 | 6 | 7 | 8 | 9 | 10 | 11 |

12 | 13 | -------------------------------------------------------------------------------- /videoclassifer.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Image Classifer 5 | 6 | 7 | 8 | 9 | 10 | 11 |

12 | 13 | -------------------------------------------------------------------------------- /imgmodels.js: -------------------------------------------------------------------------------- 1 | let img; 2 | let classifier; 3 | 4 | function onpredict(error,results){ 5 | if(!error){ 6 | console.log(results); 7 | document.getElementById('result').textContent=results[0]['label']; 8 | console.log('done'); 9 | } 10 | else{ 11 | console.log(error); 12 | } 13 | } 14 | 15 | function onloaded(){ 16 | console.log('mobilenet loaded!'); 17 | classifier.predict(img,onpredict); 18 | } 19 | 20 | 21 | function setup(){ 22 | createCanvas(500,500); 23 | img=loadImage('images/dog.jfif'); 24 | console.log('image loaded'); 25 | classifier=ml5.imageClassifier('MobileNet',onloaded); 26 | 27 | } 28 | 29 | 30 | function draw(){ 31 | image(img,0,0); 32 | } -------------------------------------------------------------------------------- /vidmodels.js: -------------------------------------------------------------------------------- 1 | let video; 2 | let classifier; 3 | 4 | function onpredict(error,results){ 5 | if(!error){ 6 | console.log(results); 7 | document.getElementById('result').textContent=results[0]['label']; 8 | console.log('done'); 9 | classifier.predict(video,onpredict); 10 | 11 | } 12 | else{ 13 | console.log(error); 14 | } 15 | } 16 | 17 | function onloaded(){ 18 | console.log('mobilenet loaded!'); 19 | classifier.predict(video,onpredict); 20 | } 21 | 22 | 23 | function setup(){ 24 | createCanvas(500,500); 25 | video=createCapture( 26 | { 27 | video: { 28 | 29 | facingMode: { 30 | exact: "environment" 31 | } 32 | } 33 | 34 | } 35 | ); 36 | 37 | console.log('video loaded'); 38 | video.hide(); 39 | classifier=ml5.imageClassifier('MobileNet',video,onloaded); 40 | 41 | } 42 | 43 | 44 | function draw(){ 45 | image(video,0,0); 46 | } -------------------------------------------------------------------------------- /posenetcheck.js: -------------------------------------------------------------------------------- 1 | let pose; 2 | let skelton; 3 | function setup(){ 4 | createCanvas(500,500); 5 | video=createCapture( 6 | { 7 | video: { 8 | 9 | facingMode: { 10 | exact: "environment" 11 | } 12 | } 13 | 14 | } 15 | ); 16 | 17 | console.log('video loaded'); 18 | video.hide(); 19 | posenet=ml5.poseNet(video,onloaded); 20 | posenet.on("pose",getposes); 21 | 22 | } 23 | 24 | function getposes(poses){ 25 | console.log(poses); 26 | if(poses.length>0){ 27 | pose=poses[0]; 28 | skelton=poses[0].skeleton; 29 | } 30 | 31 | 32 | 33 | 34 | 35 | } 36 | 37 | function onloaded(){ 38 | console.log('posenet loaded'); 39 | } 40 | 41 | function draw(){ 42 | image(video,0,0); 43 | fill('yellow'); 44 | if(pose){ 45 | for (var i=0;i<17;i++) { 46 | var x=pose.pose.keypoints[i].position.x; 47 | var y=pose.pose.keypoints[i].position.y; 48 | ellipse(x,y,12,12); 49 | } 50 | if(skelton){ 51 | for(var i=0;i