Public
Edited
Dec 18, 2022
1 star
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
tf=require('https://cdn.jsdelivr.net/npm/@tensorflow/tfjs')
Insert cell
tfvis=require('https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-vis')
Insert cell
mutasig=Object()
Insert cell
// Defining the load data function
mutasig.loadData = async (url) => {
await fetch( url ).then( (response) => response.json() ).then( (data) => {
mutasig.x_train = tf.tensor(data.x_train);
mutasig.x_test = tf.tensor(data.x_test)
mutasig.y_train = tf.tensor(data.y_train);
mutasig.y_test = tf.tensor(data.y_test);
mutasig.classNames = data.classNames;
});
}
Insert cell
// Loading data
mutasig.loadData('https://yascoma.github.io/mutasig/data.json')
Insert cell
// Checking the contents
mutasig
Insert cell
Insert cell
// Defining the function to create the model
mutasig.loadModel = () => {
mutasig.model = tf.sequential({
layers: [
tf.layers.dense({inputShape: [96], units: 128, activation: 'relu'}),
tf.layers.dense({ units: 256, activation: 'relu'}),
tf.layers.dense({ units: mutasig.classNames.length }),
]
});
mutasig.model.compile({
optimizer: 'adam',
loss: 'sparseCategoricalCrossentropy',
metrics: ['accuracy']
});
}
Insert cell
// Initializing the model and compiling
mutasig.loadModel();
Insert cell
// Initializing the visualization panel of tensorflow js viz (Go up to the page to see!)
tfvis.visor();
Insert cell
Insert cell
Insert cell
Insert cell
// Defining the function to train
mutasig.train = (fitCallbacks) => {
const BATCH_SIZE = 32;
return mutasig.model.fit( mutasig.x_train, mutasig.y_train, {
batchSize: BATCH_SIZE,
validationData: [ mutasig.x_test, mutasig.y_test ],
epochs: 50,
shuffle: true,
callbacks: fitCallbacks
});
}
Insert cell
// Defining the function to call train upon callback to update the plots
mutasig.train_visualization = async () => {
const callbacks = {
onEpochEnd: function (epoch, log) {
const surface = {
name: 'Training Visualization',
tab: 'Training'
};
const options = {
xLabel: 'Epoch',
yLabel: 'Value',
yAxisDomain: [0, 1],
seriesColors: ['teal', 'tomato']
}; // Prep the data

mutasig.epochLogs.push(log);
const acc = mutasig.epochLogs.map((log, i) => ({
x: i,
y: log.acc
}));
const valAcc = mutasig.epochLogs.map((log, i) => ({
x: i,
y: log.val_acc
}));
const data = {
values: [acc, valAcc],
// Custom names for the series
series: ['Accuracy', 'Validation Accuracy'] // render the chart

};
tfvis.render.linechart(surface, data, options);
}
};
return mutasig.train(callbacks);
}
Insert cell
mutasig.epochLogs=[];
Insert cell
// Calling training visualization
await mutasig.train_visualization();
Insert cell
Insert cell
// Defining doPrediction function
mutasig.doPrediction = () => {
const labels = mutasig.y_test;
const preds = mutasig.model.predict(mutasig.x_test).argMax([-1]);
return [preds, labels];
}
Insert cell
// Defining showAccuracy
mutasig.showAccuracy = async () => {
const [preds, labels] = mutasig.doPrediction();
console.log(labels.shape);
console.log(preds.shape);
// Use preds.data() to extract the values from tensor
const classAccuracy = await tfvis.metrics.perClassAccuracy(labels, preds);
const container = {
name: 'Accuracy',
tab: 'Evaluation'
};
tfvis.show.perClassAccuracy(container, classAccuracy, mutasig.classNames);
}
Insert cell
// Defining showConfusion
mutasig.showConfusion = async () => {
const [preds, labels] = mutasig.doPrediction();
const confusionMatrix = await tfvis.metrics.confusionMatrix(labels, preds);
const container = {
name: 'Confusion Matrix',
tab: 'Evaluation'
};
tfvis.render.confusionMatrix(container, {
values: confusionMatrix,
tickLabels: mutasig.classNames
});
}
Insert cell
mutasig.showAccuracy()
Insert cell
mutasig.showConfusion()
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more