- JavaScript 实现神经网络应用教程

实际的表格会随着测试集的不断输入不断地展示每一个输入和输出的颜色。测试集包括输入颜色（背景颜色）和输出颜色（字体颜色）。由于生成数据集的时候输出颜色被分类为黑色 [0,1] 和白色 [1,0] 向量，它们需要再次被转换为真实的颜色。

const ActualTable = ({ testSet }) =>

const fromClassifierToRgb = (classifier) =>
classifier[0] > classifier[1]
? [ 255, 255, 255 ]
: [ 0, 0, 0 ]

ColorBox 组件是一个通用组件，以输入颜色（背景颜色）和目标颜色（字体颜色）为输入。它能简单地用一个矩形展示输入颜色的类型、输入颜色的 RGB 代码字符串，并用字体的 RGB 代码将给定的目标颜色上色。

const ColorBox = ({ rgbInput, rgbTarget }) =>

const RgbString = ({ rgb }) =>
`rgb(${rgb.toString()})`
const getRgbStyle = (rgb) =>
`rgb(${rgb[0]}, ${rgb[1]}, ${rgb[2]})`

最后但重要的是，在推理表格中可视化预测颜色的激动人心的部分。它使用的也是 color box，但提供了一些不同的小道具。

const InferenceTable = ({ testSet, model }) =>

输入颜色仍然是测试集中定义的颜色，但目标颜色并不是测试集中的目标色。任务的关键是利用神经网络的预测方法预测目标颜色——它需要输入的颜色，并应在训练阶段预测目标颜色。

最后，当你开启应用时，你需要观察神经网络是否被启用。而实际的表格从开始就在使用固定测试集，在训练阶段推理表格应该改变它的字体颜色。事实上，当 ActualTable 组件显示实际测试集时，InferenceTable 显示测试集的输入数据点，但输出是使用神经网络预测的。