Question

我稍微改变了＃11的演示版来加载我的图片，而不是演示版。

我可以很好地加载我的MRI图像，请参阅Demo。如果我将标签贴图加载为主卷，它也可以工作。

window.onload = function() {
    // create and initialize a 3D renderer
    var r = new X.renderer3D();
    r.init();

    // create a X.volume
    var volume = new X.volume();

    // Attach the single-file dicom in .NRRD format
    // this works with gzip/gz/raw encoded NRRD files but XTK also supports other
    // formats like MGH/MGZ
    volume.file = '1123_N3.nii.gz';

    // we also attach a label map to show segmentations on a slice-by-slice base
    // volume.labelmap.file = '1123_seg.nii.gz';

    // add the volume
    r.add(volume);

    // the onShowtime method gets executed after all files were fully loaded and just before the first rendering attempt
    r.onShowtime = function() {
        //
        // The GUI panel
        //
        // (we need to create this during onShowtime(..) since we do not know the
        // volume dimensions before the loading was completed)
        var gui = new dat.GUI();

        // the following configures the gui for interacting with the X.volume
        var volumegui = gui.addFolder('Volume');

        // now we can configure controllers which switch between slicing and volume rendering
        var vrController = volumegui.add(volume, 'volumeRendering');

        // configure the volume rendering opacity
        var opacityController = volumegui.add(volume, 'opacity', 0, 1).listen();

        // and the threshold in the min..max range
        var lowerThresholdController = volumegui.add(volume, 'lowerThreshold', volume.min, volume.max);
        var upperThresholdController = volumegui.add(volume, 'upperThreshold', volume.min, volume.max);

        // the indexX,Y,Z are the currently displayed slice indices in the range [0 - (dimensions-1)]
        var sliceXController = volumegui.add(volume, 'indexX', 0, volume.range[0] - 1);
        var sliceYController = volumegui.add(volume, 'indexY', 0, volume.range[1] - 1);
        var sliceZController = volumegui.add(volume, 'indexZ', 0, volume.range[2] - 1);
        volumegui.open();

        // and this configures the gui for interacting with the label map overlay
        var labelmapgui = gui.addFolder('Label Map');
        var labelMapVisibleController = labelmapgui.add(volume.labelmap, 'visible');
        var labelMapOpacityController = labelmapgui.add(volume.labelmap, 'opacity', 0, 1);
        labelmapgui.open();

    };

    // adjust the camera position a little bit, just for visualization purposes
    r.camera.position = [120, 80, 160];

    // showtime! this triggers the loading of the volume and executes r.onShowtime() once done
    r.render();
};

但是，如果我将标签贴图添加到我的卷volume.labelmap.file = '1123_seg.nii.gz';，则加载失败且卷永远不显示，请参阅Broken Demo。控制台中唯一的错误如下：

TypeError：b.e.c [0] .c [Math.floor（...）]未定义

任何可能出错的想法？我该怎么调试这样的错误？

Answer 1

像这样的Javascript库通常会缩小为生产就绪版本。调试缩小的javascript代码几乎是不可能的，但你可以看到callstack中的一个方法名称是.parse，它立即表明它在解析你的labelmap文件时遇到了问题。

大多数javascript库还将包含一个未缩小的-debug版本。我似乎无法为xtk找到一个，但这是为自己创建调试版本的过程：

克隆最新的xtk项目：

git clone https://github.com/xtk/X.git
更新谷歌关闭（不包括来源）：

cd X / lib /
git clone https://github.com/google/closure-library
mv closure-library google-closure-library
我在X目录中创建了一个demo.html文件，但您可以将其放在任何位置并将其设置为：

<script src="lib/google-closure-library/closure/goog/base.js"></script> <script src="xtk-deps.js"></script>
<script> goog.require("X"); goog.require("X.renderer3D"); </script>
<script type="text/javascript" src="demo.js"></script>

现在你可以调试，你应该看到你的错误：

Uncaught TypeError: Cannot read property '_texture' of undefined parser.js:1205
X.parser.reslice parser.js:1205
X.parserNII.parse parserNII.js:258
(anonymous function)

从这里你应该能够找到你的问题。看起来缺少纹理。

Xtk：无法显示标签贴图

1 个答案: