Comments (3)
MarcoSteinke
commented on May 27, 2024
Hello,
here is the code for better readability, so people can read it without cloning and formatting 😄
curImg = 0;
imgCount = 1000;
featureExtractor = ml5.featureExtractor("MobileNet", function() {
classifier = featureExtractor.classification();
addSamplesEach();
});
function addSamplesEach() {
if (curImg >= imgCount) {
return;
}
let img = new Image();
img.crossOrigin = "Anonymous";
img.onload = function() {
console.log('added...');
const img = this;
classifier.addImage(img, "label", function() {
curImg++;
addSamplesEach();
});
};
img.src = "https://placekitten.com/100/100";
img = null;
}from ml5-library.
sproutleaf
commented on May 27, 2024
Hi! Thank you for opening the issue with us and sorry it took a while for us to get back to you.
WebGL: CONTEXT_LOST_WEBGL: loseContext: context lost happens when a memory leak occurs because the browser has lost control of your GPU. This is technically not a ml5.js bug, but more performance-related. Given that the image is 100x100 (low resolution), even running it 1000 times should not be a big problem. The only suggestion I can think of is this: instead of running a loop, you're invoking addSamplesEach() in the middle of its execution, which might result in multiple executions at the same time. Rewriting your code in a straightforward loop might be helpful.
If not, please stick to the two solutions you listed.
Miaoye
from ml5-library.
ale24
commented on May 27, 2024
The reason I was "invoking addSamplesEach() in the middle of its execution" exactly in step-by-step iteration with JS instead of "multiple executions at the same time".
So rewriting code in a straightforward loop also not works. The only solution still — using CPU as Backend.
I also tested same with Python tf + MobileNet and it works with GPU without any problems, so I can't figure out where is a problem in usage GPU with ml5.js.
But maybe I only person who got this "black-screen" issue and error with this test code, I don't know.
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.6.0/p5.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.6.0/addons/p5.sound.min.js"></script>
<script src="https://unpkg.com/ml5@latest/dist/ml5.min.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="style.css" />
<meta charset="utf-8" />
</head>
<body>
<main></main>
<script>
curImg = 0;
imgCount = 1000;
featureExtractor = ml5.featureExtractor("MobileNet", function() {
classifier = featureExtractor.classification();
for (let i = 0; i < imgCount; i++) {
let img = new Image();
img.crossOrigin = "Anonymous";
img.onload = function() {
console.log('added...');
const img = this;
classifier.addImage(img, "label", function() {
curImg++;
});
};
img.src = "https://placekitten.com/100/100";
img = null;
}
});
</script>
</body>
</html>
from ml5-library.
Related Issues (20)
- is:issue is:open can I talk with the owner. I have a game website too. Wanna talk about the Roblox. Talk to me at [email protected] HOT 2
- objectDirector() I can use a trained model from teachable machine
- Using safetensors or pkl models (like python)
- ml5.min.js.map not found if offline HOT 2
- DOMException: Failed to execute 'texImage2D' on 'WebGL2RenderingContext': Tainted canvases may not be loaded. HOT 1
- knnClassifier result after .save() and .load() - classIndex becomes undefined and label becomes number, labelToClassId disappears HOT 1
- ML5 fails to load on Chrome incognito - localstorage error HOT 1
- PoseNet Bug using custom trained model in a reactjs environment HOT 6
- about use ml5 in vue HOT 1
- How should we handle input data with Nulls/Blanks? HOT 1
- Always outputting the same thing. Might be something wrong with my HTML not sure HOT 2
- add facemesh and handpose to preload
- Possible memory leak in BodyPix and WEBGL
- Various problems with the training-charRNN repo
- Problem with CORS HOT 1
- model topology missing handpose regression HOT 9
- ERR_CONNECTION_REFUSED
- New m15 Coder, couldn't find answer online, Error "Error in oneHot: depth must be >=2, but it is 1" HOT 1
- Memory leak in PoseNet's video processing pattern HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from ml5-library.