Файл index.js
Это файл состоит из 3-х функций:
init();
resizeImage();
predict().
Первая функция срабатывает при изменении содержимого поля ввода на главной странице index.html. В эту функцию в качестве параметра передается картинка гриба от пользователя.
Содержимое функции init() следующее:
async function init(files) {
p = document.getElementById('result');
p.innerHTML = "Работаем...";
const URL = "./model/";
const modelURL = URL + "model.json";
const metadataURL = URL + "metadata.json";
resizeImage(files);
model = await tmImage.load(modelURL, metadataURL);
predict();
}
Здесь константам присваиваем файлы модели из локальной папки model.
Первой функцией вызываем вспомогательную функцию resizeImage() (строка 7). Она нужна для того чтобы изменить размер пользовательской картинки с грибом. Потому что, например, если пользователь будет делать снимок с камеры, то размеры получаемого изображения очень большие и НС не сможет определить гриб.
Содержимое функции resizeImage() следующее:
function resizeImage(files) {
var img = document.createElement("img");
var reader = new FileReader();
reader.onload = function(e) {
img.src = e.target.result;
img.onload = function() {
var canvas = document.createElement("canvas");
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0);
var MAX_WIDTH = 200;
var MAX_HEIGHT = 200;
var width = img.width;
var height = img.height;
if (width > height) {
if (width > MAX_WIDTH) {
height *= MAX_WIDTH / width;
width = MAX_WIDTH;
}
} else {
if (height > MAX_HEIGHT) {
width *= MAX_HEIGHT / height;
height = MAX_HEIGHT;
}
}
canvas.width = width;
canvas.height = height;
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, width, height);
var dataurl = canvas.toDataURL("image/png");
document.getElementById('image').src = dataurl;
};
};
reader.readAsDataURL(files[0]);
}
После того как изображение приведено к нужному размеру вызывается функция predict(). В этой функции и происходит анализ изображения от пользователя. Если НС «узнала» гриб, то пользователь увидит у себя на странице сообщение «Гриб определен как съедобный!», и ниже будет выведено описание гриба и его картинка. Если НС не определит гриб, то пользователь увидит сообщение «Гриб не определен». Содержимое функции predict() слишком длинное, потому что в цикле перебираются все 23 гриба для вывода их описания и картинки, поэтому весь файл index.js можно скачать отсюда.
На этом всё.