@sambodhi 2018-07-04T23:24:03.000000Z 字数 3767 阅读 1382

# Train a model in tf.keras with Colab, and run it in the browser with TensorFlow.js

CSDN

作者|Zaid Alyafeai



### 数据集

类别的一个子集


### 管道

管道


### Inference on the Browser

In this section we show how to load the model and make inference. I will assume that we have a canvas of size 300 x 300 . I will not go over the details of the interface and focus on TensorFlow.js part.

In order to use TensorFlow.js first use the following script

You will need a running server on your local machine to host the weight files. You can create an apache server or host the page on GitHub as I did on my project.

After that, load the model to the browser using

The await keyword waits for the model to be loaded by the browser.

#### Preprocessing

We need to preprocess the data before making a prediction. First get the image data from the canvas

The getMinBox() will be explained later. The variable dpi is used to stretch the crop of the canvas according to the density of the pixels of the screen.

We take the current image data of the canvas convert it to a tensor, resize and normalize

For prediction we use model.predict this will return probabilities of the shape [N, 100]

We can then use simple functions to find the top 5 probabilities.

#### Improve Accuracy

Remember that that our model accepts tensors of the shape [N, 28, 28,1] . The drawing canvas we have is of size 300 x 300 which might be two large for drawings or the user might draw a small figure. It will be better to crop only the box that contains the current drawing. To do that we extract the minimum bounding box around the drawing by finding the top left and the bottom right points

### Testing Drawings

Here are some first time drawings and the highest percentage class. I made all the drawings with my mouse. You should get better accuracy using a pen …