[tfjs-vis] update readme, add more screenshots (tensorflow#2914)

INTERNAL
DOC

tfjs-vis/README.md

@@ -7,11 +7,30 @@ It's main features are:
 
 * A set of visualizations useful for visualizing model behaviour
 * A set of high level functions for visualizing objects specific to TensorFlow.js
-* A way to organize visualizations of model behaviour that won't interfere with your web application
+* A way to organize visualizations (the visor) of model behaviour that won't interfere with your web application
 
 The library also aims to be flexible and make it easy for you to incorporate
 custom visualizations using tools of your choosing, such as d3, Chart.js or plotly.js.
 
+## Example Screenshots
+
+### Training Metrics
+
+![Training metrics (loss and accuracy) for a model](https://storage.googleapis.com/tfjs-assets/tfjs-vis/tfjs-vis-training.png)
+
+### Model Evauation
+
+![Dataset accuracy metrics in a table and confusion matrix visualization](https://storage.googleapis.com/tfjs-assets/tfjs-vis/tfjs-vis-evaluation.png)
+
+### Model Internals
+
+![Model summary table and histogram of conv2d weights](https://storage.googleapis.com/tfjs-assets/tfjs-vis/tfjs-vis-model-details.png)
+
+### Activations and custom visualizations
+
+![visualization of dataset activations in a conv2d layer and a dense layer](https://storage.googleapis.com/tfjs-assets/tfjs-vis/tfjs-vis-model-internals.png)
+
+
 ## Demos
 
 - [Visualizing Training with tfjs-vis](https://storage.googleapis.com/tfjs-vis/mnist/dist/index.html)
@@ -40,6 +59,29 @@ below.
 <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-vis"></script>
 ```
 
+## API
+
+See https://js.tensorflow.org/api_vis/latest/ for interactive API documentation.
+
+## Sample Usage
+
+```js
+const data = [
+  { index: 0, value: 50 },
+  { index: 1, value: 100 },
+  { index: 2, value: 150 },
+];
+
+// Get a surface
+const surface = tfvis.visor().surface({ name: 'Barchart', tab: 'Charts' });
+
+// Render a barchart on that surface
+tfvis.render.barchart(surface, data, {});
+```
+
+## Issues
+
+Found a bug or have a feature request? Please file an [issue](https://github.com/tensorflow/tfjs/issues/new) on the main [TensorFlow.js repository](https://github.com/tensorflow/tfjs/issues)
 
 ## Building from source
 
@@ -73,30 +115,4 @@ npm run build
 This should produce a `tfjs-vis.umd.min.js` file in the `dist` folder that you can
 use.
 
-## Sample Usage
-
-```js
-const data = [
-  { index: 0, value: 50 },
-  { index: 1, value: 100 },
-  { index: 2, value: 150 },
-];
-
-// Get a surface
-const surface = tfvis.visor().surface({ name: 'Barchart', tab: 'Charts' });
-
-// Render a barchart on that surface
-tfvis.render.barchart(surface, data, {});
-```
-
-This should show something like the following
-
-![visor screenshot with barchart](./docs/visor-usage.png)
 
-## Issues
-
-Found a bug or have a feature request? Please file an [issue](https://github.com/tensorflow/tfjs/issues/new) on the main [TensorFlow.js repository](https://github.com/tensorflow/tfjs/issues)
-
-## API
-
-See https://js.tensorflow.org/api_vis/latest/ for interactive API documentation.