實(shí)際的表格會(huì)隨著測(cè)試集的不斷輸入不斷地展示每一個(gè)輸入和輸出的顏色。測(cè)試集包括輸入顏色(背景顏色)和輸出顏色(字體顏色)。由于生成數(shù)據(jù)集的時(shí)候輸出顏色被分類(lèi)為黑色 [0,1] 和白色 [1,0] 向量,它們需要再次被轉(zhuǎn)換為真實(shí)的顏色。
const ActualTable = ({ testSet }) =>
Programmatically Computed
{Array(TEST_SET_SIZE).fill(0).map((v, i) =>rgbInput={testSet.rawInputs[i]}
rgbTarget={fromClassifierToRgb(testSet.rawTargets[i])}
/>
)}
const fromClassifierToRgb = (classifier) =>
classifier[0] > classifier[1]
? [ 255, 255, 255 ]
: [ 0, 0, 0 ]
ColorBox 組件是一個(gè)通用組件,以輸入顏色(背景顏色)和目標(biāo)顏色(字體顏色)為輸入。它能簡(jiǎn)單地用一個(gè)矩形展示輸入顏色的類(lèi)型、輸入顏色的 RGB 代碼字符串,并用字體的 RGB 代碼將給定的目標(biāo)顏色上色。
const ColorBox = ({ rgbInput, rgbTarget }) =>
const RgbString = ({ rgb }) =>
`rgb(${rgb.toString()})`
const getRgbStyle = (rgb) =>
`rgb(${rgb[0]}, ${rgb[1]}, ${rgb[2]})`
最后但重要的是,在推理表格中可視化預(yù)測(cè)顏色的激動(dòng)人心的部分。它使用的也是 color box,但提供了一些不同的小道具。
const InferenceTable = ({ testSet, model }) =>
Neural Network Computed
{Array(TEST_SET_SIZE).fill(0).map((v, i) =>rgbInput={testSet.rawInputs[i]}
rgbTarget={fromClassifierToRgb(model.predict(testSet.rawInputs[i]))}
/>
)}
輸入顏色仍然是測(cè)試集中定義的顏色,但目標(biāo)顏色并不是測(cè)試集中的目標(biāo)色。任務(wù)的關(guān)鍵是利用神經(jīng)網(wǎng)絡(luò)的預(yù)測(cè)方法預(yù)測(cè)目標(biāo)顏色——它需要輸入的顏色,并應(yīng)在訓(xùn)練階段預(yù)測(cè)目標(biāo)顏色。
最后,當(dāng)你開(kāi)啟應(yīng)用時(shí),你需要觀察神經(jīng)網(wǎng)絡(luò)是否被啟用。而實(shí)際的表格從開(kāi)始就在使用固定測(cè)試集,在訓(xùn)練階段推理表格應(yīng)該改變它的字體顏色。事實(shí)上,當(dāng) ActualTable 組件顯示實(shí)際測(cè)試集時(shí),InferenceTable 顯示測(cè)試集的輸入數(shù)據(jù)點(diǎn),但輸出是使用神經(jīng)網(wǎng)絡(luò)預(yù)測(cè)的。
?
評(píng)論