Ошибка: не удалось скомпилировать фрагментный шейдер. а slice () с Tensorflow. js - PullRequest
0 голосов
/ 26 мая 2020

Я разрабатываю веб-приложение для классификации изображений с использованием Tensorflow. js. Я беру изображение с помощью веб-камеры и хочу извлечь часть изображения, используя координаты ограничивающей рамки, которые я получил ранее. Структура ограничивающей рамки: [x, y, width, height]. Форма исходной фотографии веб-камеры: [ 480, 640, 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);

, но он возвращает следующее сообщение Error: Failed to compile fragment shader. на уровне выполнения slice ()

Несмотря на мои исследования, я не нашел ничего, что могло бы помочь мне решить мою проблему. У тебя есть идеи? Заранее спасибо

Ответы [ 2 ]

0 голосов
/ 26 мая 2020

Параметр, переданный в 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]
0 голосов
/ 26 мая 2020

Вместо использования тензоров, почему бы просто не использовать Canvas напрямую, если вы хотите обрезать изображение?

Удалите весь материал tf.browser.fromPixels и вместо этого передайте холст функции, которая содержит нарисованное изображение, а затем возьмите его обрезку. Например:

Используйте метод getImageData с данными ограничивающего прямоугольника:

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

Затем создайте 2-й холст с желаемым размером и используйте 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");
...