Javascript 请求的纹理大小[0x0]无效。在浏览器中加载图像时出错_Javascript_Google Chrome_Tensorflow.js

Javascript 请求的纹理大小[0x0]无效。在浏览器中加载图像时出错

javascript google-chrome

Javascript 请求的纹理大小[0x0]无效。在浏览器中加载图像时出错,javascript,google-chrome,tensorflow.js,Javascript,Google Chrome,Tensorflow.js,调用predict函数时浏览器中出现Tensorflow.js错误我正在使用Node.js运行webapp。这是我包含的脚本，我在Chrome中运行Node.js，无法解决错误该项目有7个类作为输出，在1x7形状的输出中为密集层 https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.0.0/dist/tf

调用predict函数时浏览器中出现Tensorflow.js错误

我正在使用Node.js运行webapp。这是我包含的脚本，我在Chrome中运行Node.js，无法解决错误

该项目有7个类作为输出，在1x7形状的输出中为密集层

https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js
https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.0.0/dist/tf.min.js
https://code.jquery.com/jquery-3.3.1.slim.min.js

这是我的JavaScript文件

 $(document).on('change', '#file', function() {

    let reader = new FileReader();
    reader.onload= function(){
        let dataUrl = reader.result;
        $('#selected-image').attr('src',dataUrl);
        $('#type1-predict').empty();
        $('#type2-predict').empty();
        $('#type3-predict').empty();
        $('#type4-predict').empty();
        $('#type5-predict').empty();
        $('#type6-predict').empty();
        $('#type7-predict').empty();
    }

    let file = $('#file').prop('files')[0];
    reader.readAsDataURL(file)
    });
    const CANCER_CLASSES = {
    0:"Actinic Keratoses",
    1:"Basal cell carcinoma",
    2:"Benign keratosis",
    3:"Dermatofibroma",
    4:"Melanoma",
    5:"Melanocytic nevi",
    6:"Vascular skin",    
    }
    let model;
    (async function(){
    model= await tf.loadLayersModel('http://localhost:81/model/model.json');
    $('#pro').hide()

    })();
    $(document).on('click', '#predict-button', async function() { 
    let image = $('#selected-image').get(0);

    let tensor = 
    tf.browser.fromPixels(image)
        .resizeNearestNeighbor([224,224])
        .toFloat()
        .expandDims();
    let prediction = await model.predict(tensor).data();
    let top3 = Array.from(prediction)
    .map(function(p,i){
        return {
            probab: p,
            classname:CANCER_CLASSES[i]
        };

    }).sort(function(a,b){
        return b.probab-a.probab;
    }).slice(0,4);
    $("#type1-predict").empty();
    top3.forEach(function(p){
        $('#type1-predict').append(`<li>${p.classname}: 
    ${p.probab.tpFixed(6)} 
    </li>`);
    });
    });

问题

当Tensorflow.js试图通过将图像转换为tensor时，它会从DOM元素中选择

width

和

height

。由于在您的案例中未设置这些值，因此您将收到一个错误

解决方案

您必须给

img

标记一个

width

和

height

属性，以便Tensorflow.js知道图像的大小：

目前有一份报告描述了这个问题。这可能在将来通过提供更好的错误消息来解决

<body>
<div id="pro" class="progress progress-bar progress-bar-striped progress- 
bar-animated"></div>    
<input type="file" id="image-selector">
<button id="predict-button">Predict</button>
<p style="font-weight:bold">Presentation</p>
<p>Actinic Keratoses : <span id="type1-predict"></span></p>
<p>Basal cell carcinoma: <span id="type2-predict"></span></p>
<p>Benign keratosis: <span id="type3-predict"></span></p>
<p>Dermatofibroma: <span id="type4-predict"></span></p>
 <p>Melanoma: <span id="type5-predict"></span></p>
<p>Melanocytic nevi : <span id="type6-predict"></span></p>
<p>Vascular skin: <span id="type7-predict"></span></p>
<img id="selected-image" src="">

 webgl_util.ts:203 Uncaught (in promise) Error: Requested texture size 
    [0x0] is invalid.
    at Fr (webgl_util.ts:203)
    at oi (gpgpu_util.ts:126)
    at ui (gpgpu_util.ts:173)
    at t.createUnsignedBytesMatrixTexture (gpgpu_context.ts:134)
    at t.acquireTexture (texture_manager.ts:71)
    at t.acquireTexture (backend_webgl.ts:2472)
    at t.uploadToGPU (backend_webgl.ts:2407)
    at t.getTexture (backend_webgl.ts:566)
    at t.fromPixels (backend_webgl.ts:254)
    at t.fromPixels (engine.ts:599)