Maison > Article > interface Web > Apprentissage automatique JavaScript basé sur TensorFlow.js
Apprentissage automatique JavaScript basé sur TensorFlow.js
- little bottleavant
- 2019-04-29 09:44:232643parcourir
Cet article parle de l'apprentissage automatique JavaScript basé sur TensorFlow.js. Il a une certaine valeur de référence. Les amis intéressés peuvent en apprendre davantage.
Bien que les langages de programmation Python ou R aient une courbe d'apprentissage relativement facile, les développeurs Web préfèrent faire les choses dans leur zone de confort de JavaScript. À l'heure actuelle, node.js a commencé à appliquer JavaScript à tous les domaines. Dans le cadre de cette tendance générale, nous devons comprendre et utiliser JS pour l'apprentissage automatique. Python est devenu populaire en raison du nombre de packages disponibles, mais la communauté JS a emboîté le pas. Cet article aidera les débutants à apprendre à créer un classificateur simple.
Créer
Nous pouvons créer une page Web qui utilise tensorflow.js pour entraîner un modèle dans le navigateur. En prenant en compte le « nombre moyen de rangées » d’une maison, le modèle peut apprendre à prédire le « prix » de la maison.
Ce que nous devons faire pour cela est :
Charger les données et les préparer pour l'entraînement.
Définir l'architecture du modèle.
Formez le modèle et surveillez ses performances pendant l'entraînement.
Évaluez le modèle entraîné en faisant quelques prédictions.
Première étape : commençons par les bases
Créez une page HTML et incluez JavaScript. Copiez le code suivant dans un fichier HTML nommé index.html.
<!DOCTYPE html> <html> <head> <title>TensorFlow.js Tutorial</title> <!-- Import TensorFlow.js --> <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.0.0/dist/tf.min.js"></script> <!-- Import tfjs-vis --> <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-vis@1.0.2/dist/tfjs-vis.umd.min.js"></script> <!-- Import the main script file --> <script src="script.js"></script> </head> <body> </body> </html>
Créez un fichier javascript pour le code
Dans le même dossier que le fichier HTML ci-dessus, créez un fichier appelé script.js et ajoutez le code suivant Mettez-le dans.
console.log('Hello TensorFlow');
Test
Maintenant que vous avez créé les fichiers HTML et JavaScript, testez-les. Ouvrez le fichier index.html dans votre navigateur et ouvrez la console devtools.
Si tout va bien, alors deux variables globales doivent être créées et disponibles dans la console devtools :
- tf est une référence à la bibliothèque tensorflow.js
- tfvis est une référence à la bibliothèque tfjs vis
Vous devriez maintenant voir un message disant "Bonjour TensorFlow". Si tel est le cas, vous pouvez passer à l'étape suivante.
Remarque : vous pouvez utiliser Bit pour partager du code JS réutilisable
Bit (Bit sur GitHub) est multi-projet et The le moyen le plus rapide et le plus évolutif permettant aux applications de partager du code JavaScript réutilisable. Essayez-le, c'est gratuit :
Découverte de composants et collaboration·Bit
Bit est un endroit où les développeurs peuvent partager des composants et collaborer pour créer des logiciels incroyables. Découvrez les composants partagés...
Bit.dev
Exemple : Ramda utilisé comme composant partagé
Ramda par Ramda·Bit
Une fonction utile pour la bibliothèque des programmeurs JavaScript . -256 composants javascript. Par exemple : signe égal, multiplier...
Bit.dev
Étape 2 : Charger les données, formater les données et visualiser les données d'entrée
Nous chargera l'ensemble de données « maison », peut être trouvé ici. Il englobe de nombreuses caractéristiques différentes d’une maison particulière. Pour ce didacticiel, nous avons uniquement besoin de données sur la taille moyenne des pièces et le prix par maison.
Ajoutez le code suivant au fichier script.js.
async function getData() {
Const houseDataReq=await
fetch('https://raw.githubusercontent.com/meetnandu05/ml1/master/house.json');
const houseData = await houseDataReq.json();
const cleaned = houseData.map(house => ({
price: house.Price,
rooms: house.AvgAreaNumberofRooms,
}))
.filter(house => (house.price != null && house.rooms != null));
return cleaned;
}Cela supprime toutes les entrées pour lesquelles aucun prix ou nombre de chambres n'est défini. Nous pouvons tracer ces données dans un nuage de points pour voir à quoi elles ressemblent.
Ajoutez le code suivant au bas du fichier script.js.
async function run() {
// Load and plot the original input data that we are going to train on.
const data = await getData();
const values = data.map(d => ({
x: d.rooms,
y: d.price,
}));
tfvis.render.scatterplot(
{name: 'No.of rooms v Price'},
{values},
{
xLabel: 'No. of rooms',
yLabel: 'Price',
height: 300
}
);
// More code will be added below
}
document.addEventListener('DOMContentLoaded', run);Lorsque vous actualisez la page, vous pouvez voir un panneau sur le côté gauche de la page avec un nuage de points de données, comme indiqué ci-dessous.
En général, lorsque vous travaillez avec des données, il est préférable de trouver des moyens de les examiner et de les nettoyer si nécessaire. La visualisation des données nous permet de comprendre si le modèle peut apprendre n'importe quelle structure des données.
Comme le montre la figure ci-dessus, il existe une corrélation positive entre le nombre de pièces et le prix, c'est-à-dire qu'à mesure que le nombre de pièces augmente, le prix des maisons augmente généralement.
Étape 3 : Construire le modèle à entraîner
Dans cette étape, nous écrirons du code pour construire le modèle d'apprentissage automatique. Le modèle est principalement structuré sur la base de ce code, c'est donc une étape importante. Les modèles d’apprentissage automatique prennent en compte les entrées et produisent des sorties. Pour tensorflow.js, nous devons construire un réseau de neurones.
Ajoutez la fonction suivante au fichier script.js pour définir le modèle.
function createModel() {
// Create a sequential model
const model = tf.sequential();
// Add a single hidden layer
model.add(tf.layers.dense({inputShape: [1], units: 1, useBias: true}));
// Add an output layer
model.add(tf.layers.dense({units: 1, useBias: true}));
return model;
}C'est l'un des modèles les plus simples que nous puissions définir dans tensorflow.js. Essayons de simplement décomposer chaque ligne.
Instancier le modèle
const model = tf.sequential();
Cela instanciera un objet tf.model. Ce modèle est continu car ses entrées circulent directement vers ses sorties. D'autres types de modèles peuvent avoir des branches et même plusieurs entrées et sorties, mais dans de nombreux cas, votre modèle est continu.
Ajouter un calque
model.add(tf.layers.dense({inputShape: [1], units: 1, useBias: true}));这为我们的网络添加了一个隐藏层。因为这是网络的第一层，所以我们需要定义我们的输入形状。输入形状是[1]，因为我们有1这个数字作为输入（给定房间的房间数）。
单位（链接）设置权重矩阵在层中的大小。在这里将其设置为1，我们可以说每个数据输入特性都有一个权重。
model.add(tf.layers.dense({units: 1}));上面的代码创建了我们的输出层。我们将单位设置为1，因为我们要输出1这个数字。
创建实例
将以下代码添加到前面定义的运行函数中。
// Create the model
const model = createModel();
tfvis.show.modelSummary({name: 'Model Summary'}, model);这样可以创建实例模型，并且在网页上有显示层的摘要。
步骤4：为创建准备数据
为了获得TensorFlow.js的性能优势，使培训机器学习模型实用化，我们需要将数据转换为Tensors。
将以下代码添加到script.js文件中。
function convertToTensor(data) {
return tf.tidy(() => {
// Step 1\. Shuffle the data
tf.util.shuffle(data);
// Step 2\. Convert data to Tensor
const inputs = data.map(d => d.rooms)
const labels = data.map(d => d.price);
const inputTensor = tf.tensor2d(inputs, [inputs.length, 1]);
const labelTensor = tf.tensor2d(labels, [labels.length, 1]);
//Step 3\. Normalize the data to the range 0 - 1 using min-max scaling
const inputMax = inputTensor.max();
const inputMin = inputTensor.min();
const labelMax = labelTensor.max();
const labelMin = labelTensor.min();
const normalizedInputs = inputTensor.sub(inputMin).p(inputMax.sub(inputMin));
const normalizedLabels = labelTensor.sub(labelMin).p(labelMax.sub(labelMin));
return {
inputs: normalizedInputs,
labels: normalizedLabels,
// Return the min/max bounds so we can use them later.
inputMax,
inputMin,
labelMax,
labelMin,
}
});
}接下来，我们可以分析一下将会出现什么情况。
随机播放数据
// Step 1\. Shuffle the data tf.util.shuffle(data);
在训练模型的过程中，数据集被分成更小的集合，每个集合称为一个批。然后将这些批次送入模型运行。整理数据很重要，因为模型不应该一次又一次地得到相同的数据。如果模型一次又一次地得到相同的数据，那么模型将无法归纳数据，并为运行期间收到的输入提供指定的输出。洗牌将有助于在每个批次中拥有各种数据。
转换为Tensor
// Step 2\. Convert data to Tensor const inputs = data.map(d => d.rooms) const labels = data.map(d => d.price); const inputTensor = tf.tensor2d(inputs, [inputs.length, 1]); const labelTensor = tf.tensor2d(labels, [labels.length, 1]);
这里我们制作了两个数组，一个用于输入示例（房间条目数），另一个用于实际输出值（在机器学习中称为标签，在我们的例子中是每个房子的价格）。然后我们将每个数组数据转换为一个二维张量。
规范化数据
//Step 3\. Normalize the data to the range 0 - 1 using min-max scaling const inputMax = inputTensor.max(); const inputMin = inputTensor.min(); const labelMax = labelTensor.max(); const labelMin = labelTensor.min(); const normalizedInputs = inputTensor.sub(inputMin).p(inputMax.sub(inputMin)); const normalizedLabels = labelTensor.sub(labelMin).p(labelMax.sub(labelMin));
接下来，我们规范化数据。在这里，我们使用最小-最大比例将数据规范化为数值范围0-1。规范化很重要，因为您将使用tensorflow.js构建的许多机器学习模型的内部设计都是为了使用不太大的数字。规范化数据以包括0到1或-1到1的公共范围。
返回数据和规范化界限
return {
inputs: normalizedInputs,
labels: normalizedLabels,
// Return the min/max bounds so we can use them later.
inputMax,
inputMin,
labelMax,
labelMin,
}我们可以在运行期间保留用于标准化的值，这样我们就可以取消标准化输出，使其恢复到原始规模，我们就可以用同样的方式规范化未来的输入数据。
步骤5：运行模型
通过创建模型实例、将数据表示为张量，我们可以准备开始运行模型。
将以下函数复制到script.js文件中。
async function trainModel(model, inputs, labels) {
// Prepare the model for training.
model.compile({
optimizer: tf.train.adam(),
loss: tf.losses.meanSquaredError,
metrics: ['mse'],
});
const batchSize = 28;
const epochs = 50;
return await model.fit(inputs, labels, {
batchSize,
epochs,
shuffle: true,
callbacks: tfvis.show.fitCallbacks(
{ name: 'Training Performance' },
['loss', 'mse'],
{ height: 200, callbacks: ['onEpochEnd'] }
)
});
}我们把它分解一下。
准备运行
// Prepare the model for training.
model.compile({
optimizer: tf.train.adam(),
loss: tf.losses.meanSquaredError,
metrics: ['mse'],
});我们必须在训练前“编译”模型。要做到这一点，我们必须明确一些非常重要的事情：
优化器：这是一个算法，它可以控制模型的更新，就像上面看到的例子一样。TensorFlow.js中有许多可用的优化器。这里我们选择了Adam优化器，因为它在实践中非常有效，不需要进行额外配置。
损失函数：这是一个函数，它用于检测模型所显示的每个批（数据子集）方面完成的情况如何。在这里，我们可以使用meansquaredrror将模型所做的预测与真实值进行比较。
度量：这是我们要在每个区块结束时用来计算的度量数组。我们可以用它计算整个训练集的准确度，这样我们就可以检查自己的运行结果了。这里我们使用mse，它是meansquaredrror的简写。这是我们用于损失函数的相同函数，也是回归任务中常用的函数。
const batchSize = 28; const epochs = 50;
接下来，我们选择一个批量大小和一些时间段：
batchSize指的是模型在每次运行迭代时将看到的数据子集的大小。常见的批量大小通常在32-512之间。对于所有问题来说，并没有一个真正理想的批量大小，描述各种批量大小的精确方式这一知识点本教程没有相关讲解，对这些有兴趣可以通过别的渠道进行了解学习。
epochs指的是模型将查看你提供的整个数据集的次数。在这里，我们通过数据集进行50次迭代。
启动列车环路
return model.fit(inputs, labels, {
batchSize,
epochs,
callbacks: tfvis.show.fitCallbacks(
{ name: 'Training Performance' },
['loss', 'mse'],
{
height: 200,
callbacks: ['onEpochEnd']
}
)
});model.fit是我们调用的启动循环的函数。它是一个异步函数，因此我们返回它给我们的特定值，以便调用者可以确定运行结束时间。
为了监控运行进度，我们将一些回调传递给model.fit。我们使用tfvis.show.fitcallbacks生成函数，这些函数可以为前面指定的“损失”和“毫秒”度量绘制图表。
把它们放在一起
现在我们必须调用从运行函数定义的函数。
将以下代码添加到运行函数的底部。
// Convert the data to a form we can use for training.
const tensorData = convertToTensor(data);
const {inputs, labels} = tensorData;
// Train the model
await trainModel(model, inputs, labels);
console.log('Done Training');刷新页面时，几秒钟后，你应该会看到图形正在更新。
这些是由我们之前创建的回调创建的。它们在每个时代结束时显示丢失（在最近的批处理上）和毫秒（在整个数据集上）。
当训练一个模型时，我们希望看到损失减少。在这种情况下，因为我们的度量是一个误差度量，所以我们希望看到它也下降。
第6步：做出预测
既然我们的模型经过了训练，我们想做一些预测。让我们通过观察它预测的低到高数量房间的统一范围来评估模型。
将以下函数添加到script.js文件中
function testModel(model, inputData, normalizationData) {
const {inputMax, inputMin, labelMin, labelMax} = normalizationData;
// Generate predictions for a uniform range of numbers between 0 and 1;
// We un-normalize the data by doing the inverse of the min-max scaling
// that we did earlier.
const [xs, preds] = tf.tidy(() => {
const xs = tf.linspace(0, 1, 100);
const preds = model.predict(xs.reshape([100, 1]));
const unNormXs = xs
.mul(inputMax.sub(inputMin))
.add(inputMin);
const unNormPreds = preds
.mul(labelMax.sub(labelMin))
.add(labelMin);
// Un-normalize the data
return [unNormXs.dataSync(), unNormPreds.dataSync()];
});
const predictedPoints = Array.from(xs).map((val, i) => {
return {x: val, y: preds[i]}
});
const originalPoints = inputData.map(d => ({
x: d.rooms, y: d.price,
}));
tfvis.render.scatterplot(
{name: 'Model Predictions vs Original Data'},
{values: [originalPoints, predictedPoints], series: ['original', 'predicted']},
{
xLabel: 'No. of rooms',
yLabel: 'Price',
height: 300
}
);
}在上面的函数中需要注意的一些事情。
const xs = tf.linspace(0, 1, 100); const preds = model.predict(xs.reshape([100, 1]));
我们生成100个新的“示例”以提供给模型。model.predict是我们如何将这些示例输入到模型中的。注意，他们需要有一个类似的形状（[num_的例子，num_的特点每个_的例子]）当我们做培训时。
// Un-normalize the data const unNormXs = xs .mul(inputMax.sub(inputMin)) .add(inputMin); const unNormPreds = preds .mul(labelMax.sub(labelMin)) .add(labelMin);
为了将数据恢复到原始范围（而不是0–1），我们使用规范化时计算的值，但只需反转操作。
return [unNormXs.dataSync(), unNormPreds.dataSync()];
.datasync（）是一种方法，我们可以使用它来获取存储在张量中的值的typedarray。这允许我们在常规的javascript中处理这些值。这是通常首选的.data（）方法的同步版本。
最后，我们使用tfjs-vis来绘制原始数据和模型中的预测。
将以下代码添加到运行函数中。
testModel(model, data, tensorData);
刷新页面，现在已经完成啦！
现在你已经学会使用tensorflow.js创建一个简单的机器学习模型了。
相关教程：JavaScript视频教程
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!