Я работаю над проектом MERN Stack для университета, где пользователи могут загружать фотографии автомобилей, и я хочу использовать opencv, чтобы размыть номерные знаки, поэтому мне нужно использовать файл «haarcascades» для идентификации области. вот соответствующий код:
const handlePhotosChange = async (e) => {
const { files } = e.target;
const selectedPhotos = Array.from(files);
for (const photo of selectedPhotos) {
const img = new Image();
img.src = URL.createObjectURL(photo);
await new Promise((resolve) => {
img.onload = () => {
resolve();
};
});
const mat = cv.imread(img);
const gray = new cv.Mat();
cv.cvtColor(mat, gray, cv.COLOR_RGBA2GRAY);
const licensePlateCascade = new cv.CascadeClassifier();
const cascadeLoaded = licensePlateCascade.load(
"haarcascade_license_plate_rus_16stages.xml"
);
console.info("1");
if (cascadeLoaded) {
console.info("2");
const plates = new cv.RectVector();
const minSize = new cv.Size(30, 30);
licensePlateCascade.detectMultiScale(gray, plates, 1.1, 3, 0, minSize);
for (let i = 0; i < plates.size(); i++) {
const plate = plates.get(i);
const plateMat = gray.roi(plate);
cv.GaussianBlur(plateMat, plateMat, new cv.Size(5, 5), 0);
plateMat.delete();
}
const blurredImg = new Image();
blurredImg.src = URL.createObjectURL(
new Blob([cv.imencode(".jpg", mat)], { type: "image/jpeg" })
);
const blurredBlob = await fetch(blurredImg.src).then((res) =>
res.blob()
);
selectedPhotos[selectedPhotos.indexOf(photo)] = blurredBlob;
plates.delete();
}
mat.delete();
gray.delete();
licensePlateCascade.delete();
}
setPhotos(selectedPhotos);
};
у меня проблема именно с этой строкой:
const cascadeLoaded = licensePlateCascade.load(
"haarcascade_license_plate_rus_16stages.xml"
);
в момент выполнения кода я получаю эту ошибку в консоли:
[ОШИБКА: [email protected]] global persistence.cpp:531 open Невозможно открыть файл: 'haarcascade_license_plate_rus_16stages.xml' в режиме чтения
Я попытался указать полный путь, используя ссылку на GitHub, разместив файл в открытом доступе и поместив код и файлы на серверную часть. ничего не получалось.
ожидаемое поведение: файл загружается без ошибок.
благодаря комментарию @Christoph Rackwitz я смог найти решение
что тебе необходимо сделать:
1- получите utils.js из репозитория OpenCV на GitHub.
2- чтобы он работал правильно, вам нужно добавить к нему эту строку (используйте относительный путь к используемому вами opencv.js)
import * as cv from "../opencv/opencv";
3- импортируйте его в компонент, в котором вы хотите использовать харкаскад.
import Utils from "../assets/utils";
также обязательно импортируйте opencv.js.
4. Затем вам нужно будет вставить выбранный вами файл haarcascade /public
.
5- присвоить его переменной:
const xmlURL = "haarcascade_xxxx_license_plate.xml";
6. Хорошо, мы воспользуемся createFileFromUrl()
из utils.js и загрузим наш файл haarcascade:
utils.createFileFromUrl(xmlURL, xmlURL, () => {
licensePlateCascade.load(xmlURL);
вот полная функция для вашего удобства:
const handleLicensePlateDetection = async (e) => {
try {
console.info("Starting license plate detection...");
// Clean up previous resources if necessary
if (window.src) window.src.delete();
if (window.gray) window.gray.delete();
if (window.plates) window.plates.delete();
if (window.licensePlateCascade) window.licensePlateCascade.delete();
const file = e.target.files[0];
const reader = new FileReader();
reader.onload = async () => {
console.info("Image loaded successfully.");
const image = new Image();
image.src = reader.result;
image.onload = async () => {
console.info("Converting image to grayscale...");
const src = cv.imread(image);
const gray = new cv.Mat();
cv.cvtColor(src, gray, cv.COLOR_RGBA2GRAY, 0);
console.info("Loading Haar Cascade XML file...");
const licensePlateCascade = new cv.CascadeClassifier();
const xmlURL = "haarcascade_xxx_license_plate.xml"; // Path to the XML file
utils.createFileFromUrl(xmlURL, xmlURL, () => {
try {
licensePlateCascade.load(xmlURL);
console.info("Haar Cascade XML file loaded successfully.");
console.info("Detecting license plates...");
const plates = new cv.RectVector();
const msize = new cv.Size(0, 0);
licensePlateCascade.detectMultiScale(
gray,
plates,
1.1,
3,
0,
msize,
msize
);
console.info("Applying Gaussian blur to detected plates...");
for (let i = 0; i < plates.size(); ++i) {
try {
const plate = plates.get(i);
const roi = src.roi(plate);
cv.GaussianBlur(
roi,
roi,
new cv.Size(23, 23),
40,
40,
cv.BORDER_DEFAULT
);
roi.delete();
} catch (error) {
console.error(
"Error applying Gaussian blur to plate:",
error
);
}
}
console.info("Displaying the result...");
cv.imshow("canvas", src);
// Clean up
src.delete();
gray.delete();
plates.delete();
licensePlateCascade.delete();
} catch (error) {
console.error("Error loading Haar Cascade XML file:", error);
}
});
};
};
reader.readAsDataURL(file);
} catch (error) {
console.error("Error initializing license plate detection:", error);
}
};
примечание: я новичок в этой теме «ИИ», и мне нужна была помощь ИИ, поэтому я не понимаю большую часть того, что только что вставил.
Вы пробовали то, что только что опубликовали, и действительно ли это работает?
@ChristophRackwitz Я опубликовал это только после тщательного тестирования, оно работает хорошо. единственная проблема заключается в том, что я не могу выбрать другую фотографию после этого, мне приходится перезагружать страницу или даже несколько фотографий, если уж на то пошло. Но это выходит за рамки данной темы. Я как-нибудь разберусь с этим. Если у вас есть вопросы, не стесняйтесь спросить.
хорошо хорошо. просто убедившись, что выход AI действительно проверен. это проблема на сайте с тех пор, как стал доступен ChatGPT.
Я вижу результаты поиска, датированные 2018 годом, но есть и более новые stackoverflow.com/questions/54162946/…