2014-06-23 57 views
2

我稍微更改了演示#11来加载我的图像,而不是演示的。Xtk:无法显示标签贴图

我可以加载我的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(...)] is undefined

任何想法可能是什么错?我该如何调试这样的错误?

+1

我得到的错误:未捕获的类型错误:无法在控制台中读取未定义的属性'C'。 –

+0

您提供的链接不适用于我(页面永不加载) –

+0

@Fresh:demo.html有效,但您需要耐心,因为您正在从我的服务器下载3D卷。在我的电脑上它会在大约十秒钟内加载,但如果你住得很远,我想这可能需要更长的时间。 –

回答

3

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

大多数JavaScript库还将包含未缩小的-debug版本。我似乎无法找到一个XTK,但这里是创建自己的调试版本的过程:

  1. 克隆最新XTK项目:

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

  2. 更新谷歌封闭件(不包括源):

    CD X/LIB/
    GIT中克隆https://github.com/google/closure-library
    MV closure-谷歌库闭库

  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) 

从这里你应该能够追捕你的问题。看起来像一个纹理缺失。

+0

非常感谢! –