<!DOCTYPE html>
<html>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@2.8.4/dist/tf.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-vis@1.5.1/dist/tfjs-vis.umd.min.js"></script>
<body>
<h2>Plot TensorFlow Data</h2>
<div id="plot1"></div>
<div id="plot2"></div>
<script>
function extractData(obj) {
return {x:obj.Horsepower, y:obj.Miles_per_Gallon};
}
function removeErrors(obj) {
return obj.x != null && obj.y != null;
}
function tfPlot(values, surface) {
tfvis.render.scatterplot(surface,
{values:values, series:['Original','Predicted']},
{xLabel:'Horsepower', yLabel:'MPG',});
}
async function runTF() {
const jsonData = await fetch("cardata.json");
let values = await jsonData.json();
values = values.map(extractData).filter(removeErrors);
const surface1 = document.getElementById("plot1");
const surface2 = document.getElementById("plot2");
tfPlot(values, surface1);
}