[ML] Tensorflow.js + Image segmentPerson

<!DOCTYPE html>

<html>

  <head>

    <title>Parcel Sandbox</title>

    <meta charset="UTF-8" />

    <!-- Load TensorFlow.js -->

    <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.2"></script>

    <!-- Load BodyPix -->

    <script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/body-pix@2.0"></script>

  </head>

  <body>

    <img

      id="image"

      src="data:image/image.jpg"

    />

    <canvas id="canvas"/>

    <script>

      const img = document.getElementById("image");

      function loadAndPredict() {

        bodyPix.load()

          .then((net)=> net.segmentPersonParts(img))

          .then(partSegmentation  => {

            const coloredPartImage = bodyPix.toColoredPartMask(partSegmentation);

            const opacity = 0.7;

            const flipHorizontal = false;

            const maskBlurAmount = 0;

            const pixelCellWidth = 10.0;

            const canvas = document.getElementById('canvas');

            // Draw the pixelated colored part image on top of the original image onto a

            // canvas.  Each pixel cell's width will be set to 10 px. The pixelated colored

            // part image will be drawn semi-transparent, with an opacity of 0.7, allowing

            // for the original image to be visible under.

            bodyPix.drawPixelatedMask(

                canvas, img, coloredPartImage, opacity, maskBlurAmount,

                flipHorizontal, pixelCellWidth);

          });

      }

      loadAndPredict();

    </script>

  </body>

</html>
巴特西

[ML] Tensorflow.js + Image segmentPerson

最新文章

热门文章
