title: How do I run UNet segmentation model in Javascript using tensorflow JS?
body: <p>I had a UNet model which I trained using Python. I saved the <strong>complete</strong> model as <code>Model.h5</code> file.</p>
  <p>According to tensorflow JS documentations - <a href="https://www.tensorflow.org/js/tutorials/conversion/import_keras" rel="nofollow noreferrer">How to import a keras model</a> I converted the model using the <code>tensorflowjs_converter</code> tool. Now I have a <code>Model.json</code> and bunch of shard files.</p>
  <p>My question is, How do I use this model in a Javascript File to perform segmentation on Image?</p>
  <p>I managed to load the model and print the model summary in the console, here's the code I used for that:</p>
  <pre><code>async function app() {
      
     model = await tf.loadLayersModel(MODEL_JSON_PATH);
     model.summary();
  }
  </code></pre>
  <p>This is the model summary from browser console:</p>
  <pre><code>Layer (type)                    Output shape         Param #     Receives inputs                   
  ==================================================================================================
  input_1 (InputLayer)            [null,1024,1024,3]   0                                            
  conv1_pad (ZeroPadding2D)       [null,1026,1026,3]   0           input_1[0][0]                    
  conv1 (Conv2D)                  [null,512,512,32]    864         conv1_pad[0][0]                  
  .... &lt;Many more layers here&gt; ....
  Total params: 6315522
  Trainable params: 6298882
  Non-trainable params: 16640
  </code></pre>
  <p>So the model seems to be loaded perfectly.</p>
  <p>Now say I have an Image on my webpage in an <code>img</code> tag. How do I pass that Image to my model, and receive the output? I've seen <code>tf.browser.fromPixels</code> but not sure how to proceed.</p>
  <p>Any help / pointers to such examples will be helpful.</p>