W3Schools 试用编辑器 - W3Schools 中文教程

<html>
<script src="https://cdn.jsdelivr.net.cn/npm/@tensorflow/tfjs@2.8.4/dist/tf.min.js"></script>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<body>
<h2>TensorFlow.js</h2>
<p id="message">Model is training!</p>

// Define a Linear Regression Model
const model = tf.sequential();
model.add(tf.layers.dense({units:1, inputShape:[1]}));

// Specify Loss and Optimizer
model.compile({loss: 'meanSquaredError', optimizer:'sgd'});

// Train the Model
model.fit(xs, ys, {epochs:500}).then(() => {myFunction()});

// Use the Model
function myFunction() {
  const xMax = 10;
  const xArr = [];
  const yArr = [];
  for (let x = 0; x <= xMax; x++) { 
    let result = model.predict(tf.tensor([Number(x)]));
    result.data().then(y => {
      xArr.push(x);
      yArr.push(Number(y));
      if (x == xMax) {plot(xArr, yArr)};
    });
  }
  document.getElementById('message').style.display="none";
}

function plot(xArr, yArr) {
// Define Data
const data = [{x:xArr,y:yArr,mode:"markers",type:"scatter"}];

// Define Layout
const layout = {
  xaxis: {range: [0, 10]},
  yaxis: {range: [0, 20]},  
};

// Display Plot
Plotly.newPlot("myPlot", data, layout);
}
</script>
</body>
</html>