Javascript 错误：未能编译片段着色器。而slice（）与Tensorflow.js

我正在使用Tensorflow.js开发一个用于图像分类的web应用程序。我用我的网络摄像头拍摄了一张图像，我想使用我之前获得的边界框坐标提取图像的一部分。边界框结构为：

[x，y，宽度，高度]

。原始网络摄像头照片的形状是

[480640,1]

我使用以下代码提取Tensorflow.js的边界框：

function cropImage(webcamElement, bbox){
    const webcamImage = tf.browser.fromPixels(webcamElement)
                                    .mean(2)
                                    .toFloat()
                                    .expandDims(-1);

    let crop_width = bbox[2];
    let crop_height = bbox[3];

    // Get valid bbox width in canvas
    if (bbox[2] > webcamImage.shape[1] - bbox[0]){
        crop_width =  webcamImage.shape[1] - bbox[0];
    }

    // Get valid bbox height in canvas
    if (bbox[3] > webcamImage.shape[0] - bbox[1]){
        crop_height =  webcamImage.shape[0] - bbox[1];
    }

    let crop = webcamImage.slice(
        [bbox[1], bbox[0], 0],
        [crop_height, crop_width, 1]
    );
    console.log(crop);

但它返回以下消息

错误：未能编译片段着色器。

在切片（）的执行级别

---

尽管我进行了研究，但还没有找到任何能帮助我解决问题的方法。你有什么想法吗？提前感谢您

如果您想裁剪图像，为什么不直接使用画布而不是使用张量呢

删除所有tf.browser.fromPixels内容，将画布传递给保存绘制图像的函数，然后进行裁剪。例如：

将getImageData方法与边界框数据一起使用：

var imageData = ctx.getImageData(bbox[0], bbox[1], bbox[2], bbox[3]);

然后创建具有所需大小的第二个画布，并使用puImageData设置像素：

var canvas2 = document.createElement("canvas");
canvas2.width = bbox[2];
canvas2.height = bbox[3];
var ctx2 = canvas2.getContext("2d");
ctx2.putImageData(imageData, 0, 0);

如果要将其保存为网页的图像，则可以执行以下操作：

dstImg.src = canvas1.toDataURL("image/png");

---

传递给

tf.slice

的参数错误。应该是这样

tensor.slice([y, x], [h, w]) 

其中

（y，x）

是开始切片的坐标，

（h，w）

是切片的高度和宽度

const a = tf.ones([480, 640, 1]).slice([25, 60], [20, 30])
console.log(a.shape) // [20, 30, 1]

---

bbox[1]、bbox[0]、裁剪高度和裁剪宽度的值是多少？我对它了解得不够，但我使用了您的解决方案，它成功了。非常好，非常感谢！很高兴听到这个消息！：-）我不明白，我仍然有相同的消息

“错误：未能编译片段着色器”

，带有

let crop=WebCammage.slice（[bbox[1]，bbox[0]]，[crop_height，crop_width]）

webcamImage的形状是什么，

bbox[1]

，

bbox[0]

，

裁剪高度和裁剪宽度的值是什么？