2

我稍微更改了演示 #11 以加载我的图像而不是演示。

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

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。控制台中的唯一错误如下：

类型错误：bec[0].c[Math.floor(...)] 未定义

知道什么可能是错的吗？我应该如何调试此类错误？

4

1 回答 1

3

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

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

  1. 克隆最新的 xtk 项目：

    git 克隆https://github.com/xtk/X.git

  2. 更新谷歌关闭（不包括来源）：

    cd X/lib/
    git clone https://github.com/google/closure-library
    mvclosure-library google-closure-library

  3. 我在 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)

从这里你应该能够找到你的问题。似乎缺少纹理。

于 2014-07-01T21:26:08.033 回答