医学信息学解锁17（2019）100253基于Internet的图形渲染和面向消息流的医学数据可视化同步和信息交互琦张伊利诺伊州立大学信息技术学院，100 North University Street，Normal，IL，61761，美国A R T I C L EI N FO保留字：医疗信息图形渲染视觉同步协同诊断双向互联网连接消息流A B S T R A C T医疗设备的快速技术进步使得产生大量数据成为可能，这些数据包含大量诊断信息。在互联网上交互式地访问和共享所获得的数据在远程医疗中至关重要。然而，由于缺乏有效的算法和高计算成本，在互联网上的协同医疗数据的探索仍然是一个具有挑战性的任务，在临床设置。为此，我们开发了一个基于Web的医学图像渲染和视觉同步软件平台，在该平台中，我们提出了新的并行数据计算和图像特征增强算法，利用Node.js和Socket.IO库在服务器和客户端之间实时建立双向连接。此外，我们还设计了一种新的方法来在所有连接的用户之间传输医疗信息，其身份和输入消息可以自动存储在数据库中并在Web浏览器中提取。所提出的软件框架将为多个医疗从业者提供即时的视觉反馈和交互式信息，如协同治疗计划，分布式治疗和远程临床医疗保健。1. 介绍医疗数据和信息可视化具有广泛的临床应用[1]，并且驻留在Web引擎上的软件平台比本地应用程序具有优势[2]。与使用独立的软件平台相比，使用基于互联网的解决方案可以在诊断信息协作分析和治疗决策方面实现更好的性能[3]。互联网技术的进步使人们有可能建立一个“共同点”的医疗从业者合作探索医疗数据和共享诊断信息在全球范围内[ 4，5 ]。当一个软件应用程序是为网络开发的，它可以直接访问和执行的任何用户在世界各地与互联网连接和网络浏览器[6]。基于互联网的医疗信息系统水平 可以 扩大 医生 和 能力 到 满足随着医疗服务需求的不断增长，在广阔的地理区域提供临床服务[7，8]，也可以允许医疗从业者在远程位置相互交流，并有效地共享医疗资源[9]。已经开发了一些有趣的基于网络的医疗信息平台，例如互联网上的流式医疗数据[10]或图像[11]，在Web服务器和客户端之间传输数据以用于医疗图像共享和分析[12]。据报道，参考文献[13]，在Web浏览器中处理和可视化体表电位图，其中使用描述性可扩展标记语言（XML）处理数据存储。为向医务人员提供网上的遗传病资讯， 作者 在参考文献[14]中提出了一个Android移动平台，其中Java和XML集成到Web框架中以处理数据渲染。为了在互联网上显示和分析3D显微镜数据，在参考文献[15]中开发了基于网络的软件包，其中Java applet和与HTML浏览器内的applet交互的接口用于以期望的轮廓水平呈现医学数据。Salavert-Torres等人[16]使用类似的Java applet技术在Web浏览器中交互显示从3D显微镜数据中提取的2D切片图像。 该技术的后续开发使用WebGL [17]和HTML5构建了一个在Web浏览器中渲染医学图像的平台，其中VTK [18]用于切片体积医学数据[19]。所有概述的软件平台都构建在客户端-服务器结构上，该结构基于访问网页和医疗数据信息的请求-响应方案[20]。此外，网络技术、第三方库和软件已经为基于交互式浏览器的自定义可视化[21]或在Web上呈现3D图形[22] 的 应 用 开 发 了 框 架 。 Kitware 发 布 了 一 个 JavaScript 库ParaViewWeb [23]，电子邮件地址：qzhan10@ilstu.edu。https://doi.org/10.1016/j.imu.2019.100253接收日期：2019年8月6日;接收日期：2019年9月20日;接受日期：2019年9月25日在线预订2019年2352-9148/© 2019由Elsevier Ltd.发布这是一个在CC BY-NC-ND许可证下的开放获取文章（http://creativecommons.org/licenses/by-nc-nd/4.0/）。可在ScienceDirect上获得目录列表医学信息学期刊主页：http://www.elsevier.com/locate/imuQ. 张医学信息学解锁17（2019）1002532Fig. 1. 系统架构流程图，包括基于互联网的消息流、数据管理、信息共享、三维医学数据实时渲染和增强、双向网络连接和医学数据可视化同步。共享的Webworker用于优化基于多线程的数据加载和医疗数据探索。它被用作Web浏览器内科学数据可视化的Web工具。与此同时，许多研究人员在互联网上使用Web浏览器中的图形渲染来探索医学图像[24]。例如，参考文献[25]中的作者在移动设备上部署了一个单通道数据渲染管道，其中WebGL中的2D纹理用于模拟3D纹理进行体渲染。相同的渲染技术应用于交互式处理2D/3D医学图像[26]，并与WebSocket结合进行远程协作数据探索[27]。后来，吉梅内斯等人。进一步发展了所提出的算法，并提出了一个先进的平台，以交互式显示和分析三维分形维数的磁共振成像（MRI）数据在网络浏览器[28]。其他应用包括开发开源库和软件包，以在网络上显示神经学数据[29]，蛋白质结构[30]和分子数据[31，32]。一些作者还为高级医疗应用设计了基于网络的渲染界面，例如个性化动脉粥样硬化患者的管理，通过互联网检索类似的既往病例来辅助诊断过程[33]，通过可视化感兴趣的血流动力学参数之间的空间和时间关系来探索多变量血管数据[34]。最近，为了在临床和研究机构之间共享医疗数据和研究结果，参考文献[35]中的作者提出了一种GIFT云服务器来存储匿名数据，并使用代表性状态传输应用程序编程接口（REST API）与互联网上的外部软件集成。参考文献[36]中引入了主从模式，而不是在云上构建服务器，以允许用户使用体积和表面渲染来访问和显示远程医学图像，其中在服务器上设计了消息响应机制，以侦听来自客户端的交互请求。为了便于放射学从业人员操作和解释横截面体积医学数据，Borgbjerg [37]将基于浏览器的图像采集和通信系统（PACS）和成像查看器集成到基于主从的互联网连接结构中，参考文献[38]中的作者使用开源Web服务器软件（即Apache HTTP服务器[39]）创建其主计算机，然后使用报告的网络技术[36，37]将主服务器与从客户端连接，其中采用PHP编程语言[40]链接服务器 到MySQL [41]数据库管理系统进行数据存储，萃取后来，在参考文献[42]中报告了使用PHP与MySQL数据库服务器通信的类似策略，其中作者使用服务器-客户端连接协议收集电子患者报告结局登记的数据。2. 当前工作据我们所知，目前发布的软件包通常是在隔离的服务器和客户端上创建的，这些服务器和客户端缺乏在网络中流式传输消息的能力，并且数据探索不能在多个用户之间同步[2此外，客户端计算机通常需要Java applet或其他外部插件来处理Web浏览器中的数据传输和渲染[14-此外，大多数报告的软件平台基于事件请求-响应管道，而不是自动双向连接[10一些Web应用程序集中在云中[23，35]，而另一些则在Apache HTTP服务器上创建[39]以维护数据通信[21，22，36-主从交互模式也是常见的，它使用服务器作为主机来组织网络连接[36-然而，这两种方案都不能在服务器和客户端之间同步数据探索。此外，跨浏览器界面three.js [43]通常用于管理基于WebGL的数据可视化，其缺乏灵活操作图像和将诊断信息集成到医疗数据探索中的能力[27此外，表面渲染也用于在轮廓级别显示医疗数据，导致内部数据信息丢失[13，31，32]。最后，由于WebGL的图形支持有限，在体绘制过程中，通常利用2D纹理模拟3D纹理进行三线性插值，这会导致图像质量较差，数据可视化速度有限[24为了解决上述限制，我们建立了一个基于Web的软件平台[44]，其中Apache HTTP服务器被应用于Q. 张医学信息学解锁17（2019）1002533构建服务器-客户端连接，MySQL和PHP用于数据存储管理，并开发基于WebGL 2 [45]的算法来实时显示3D医疗数据。本文介绍了我们在以前工作的技术发展方面的进一步努力，其主要贡献包括开发新的算法，使用Node.js [46]和Socket.IO [47]来构建服务器并与客户端建立实时双向连接，设计一种新的信息共享和消息流方法，并将输入信息自动链接到MySQL数据库。此外，我们实现了一个共享的Web工人，并将其纳入我们的软件框架，以优化医疗数据多线程处理和Web连接。最后，新的数据照明和增强算法的设计和集成到我们的体绘制管道，强调医学数据可视化和感兴趣的图像特征。本文件的结构如下。首先，我们描述全双工我们的应用程序的Web通信架构。并对数据与信息同步的具体实现细节进行了说明。然后，我们展示了共享Web worker的工作管道[48]。在第五节中，概述了医学数据可视化和图像特征增强的算法。第6节对实验结果进行了解释和分析。最后，在结论部分总结了3. 系统架构开发的软件系统是一个基于Web的框架，这是基于客户端/服务器架构。本文提出的基于Web的应用程序的主要特点之一是同步的功能增强的医疗数据渲染和用户输入的消息流之间的服务器，客户端和数据库。因此，在这一部分中，我们描述了我们的软件平台的系统架构，基本算法和理论基础。图1概述了服务器端编程的系统架构以及服务器和客户端计算机浏览器之间双向交互通信的开放。我们的软件平台基于事件驱动的方案，能够同步基于Web的医疗数据可视化和消息流，其中所有用户可以通过互联网共享相同的动态更新的医疗数据探索视图和信息。3.1. Node.js服务器在该项目中，Node.js [46]用于构建同步医疗数据可视化和信息通信的服务器，而JavaScript [49]用于编写服务器端脚本的程序如清单1所述，首先，需要EX press. js（EX press）[50]，并用于构建Node.js服务器。EX press是一个最小且灵活的节点。js Web应用程序框架，为Web和移动应用程序提供一组功能，而Node.js是一个开源、跨平台的运行时环境，在浏览器之外执行JavaScript代码节点包管理器（npm）用于安装EX press并创建一个名为package JSON的新文件[51]来存储已开发项目的信息。Node.js服务器托管用于数据可视化和探索的HTML和JavaScript文件，它被设置为侦听端口4000上的所有消息事件。图的左侧。 1示出了主图形渲染程序，它托管在运行在EX Press框架上的Node.js服务器我们使用WebGL 2[45]开发算法以在Web浏览器中可视化医疗数据，其中OpenGL着色语言（GLSL）[52]用于基于图形处理单元（GPU）的并行数据计算、渲染和图像特征增强，如第5节所示。所有连接的客户端都被授予特权，可以使用基于WebSocket协议和Socket.IO库构建的al-task来获取和启动Node.js服务器上托管的基于Web的程序。3.2. 插座。IO连接为了在Node.js服务器和所有连接的客户端之间建立双向连接，需要JavaScript库Socket.IO [47]并用于基于事件的实时通信：一个组件运行在Node.js服务器上，另一个组件基于在客户端Web浏览器上执行的清单1显示了服务器端配置，其中使用io通过事件回调函数io：sockets：on构建套接字连接。在我们的软件平台中，所有客户端都使用基于WebSocket协议和Socket.IO库[53]的算法连接到服务器，它可以提供一种机制，用于在客户端和服务器之间通过Internet进行快速，安全，双向的消息通信和数据交换，而无需为每条消息进行拉取或请求/响应。WebSocket协议使用类似于HTTP的握手来提供服务器和客户端之间的持久连接，同时保持连接打开。所描述的基于Socket.IO的双向连接算法的工作流水线在图的左侧展示。 1.清单1：使用EX press.js创建Node.js服务器的算法，与MySQL数据库通信，链接到公共目录以进行HTML和JavaScript代码集成，以及在Node.js服务器和客户端之间建立连接。Q. 张医学信息学解锁17（2019）1002534ðÞðÞ4. 数据和信息同步在本节中，概述了关于多用户协作平台的开发和优化的一些实施细节。此外，为了提高数据转换和Web加载，提出了共享Web worker。如图1所示，我们开发了同时在服务器和客户机上运行Socket.IO的算法。所有数据探索和可视化都在与Node.js服务器连接的客户端计算机4.1. 服务器端编程如清单1所述，在服务器上，我们在第1-3行开发代码来监听所有新的客户端连接。当一个客户端连接到服务器端，并发出一个名为message name的消息事件时，服务器端会使用第13-17行的代码将接收到的消息发送给所有连接的客户端，其中回调函数functionMsg会使用第15-16行的Socket.IO函数广播消息。生成的事件功能主要用于医学数据渲染和探索，如更新视口和鼠标、菜单选择、光学标测、数据导航、渲染参数调整等。服务器正在使用第1-3行中的代码侦听端口4000上的所有事件。我们使用变量io访问Socket.IO库，变量io是通过输入Express API服务器的对象创建的，如第4-5行所示清单1概述了在函数newConnection套接字中监听鼠标按下和移动事件的两个示例，从中我们可以看到，在接收到这两个事件中的任何一个之后，服务器将使用第13-22行中描述的方法将接收到的事件发送给框架中所有连接的客户机。此外，我们的程序使用第9行中的方法调用创建了一个指向“public”文件夹的链接在“公共“目录中 图 1描述了服务器端架构的流程图和与连接的客户端的消息通信，其中Node.js及其Web应用程序框架E X press被用来托管存储在“public”文件夹中的实际图形渲染和信息管理程序。4.2. 客户端编程如清单2所示，我们在客户端开发代码来连接服务器。socket：io库首先通过链接到索引中的JavaScript库socket：io：js集成到我们的客户端代码中。html文件，然后使用第1行中的代码将客户端Socket.IO程序连接到IP地址为192.168.0.11的服务器。客户端在端口4000上监听来自服务器的事件，并且为每个到服务器的新连接创建唯一的客户端套接字id，以便服务器可以随时间跟踪连接清单2：使用Socket.IO和基于事件的同步创建客户端网络连接的算法。以鼠标移动事件为例。对于客户端编程，首先在客户端Socket.IO组件中增加事件监听功能，对鼠标、键盘、菜单、颜色映射、数据加载、医疗数据渲染参数调整等所有事件进行监听和反应，当事件为用户输入操作时，打包成消息发送给服务器，包括消息名称和消息中的数据，如第12行所述，消息名称为mousemove ws。如果事件来自连接的服务器，则客户端将使用Socket.IO回调函数和第14-15行中描述的传输数据执行事件中编程的操作，其中鼠标移动事件被列为示例。清单2还描述了处理鼠标移动事件的客户端编程示例。添加一个事件监听器来监听鼠标移动，如果接收到的事件来自本地用户输入，客户端将触发的事件和相应的鼠标位置数据发送给服务器，代码见第14-15行。另一方面，如果事件由连接的服务器广播，则客户端将使用与从用户输入接收的事件相同的代码来接受事件。接收到事件的客户端将根据回调函数进行操作，即，函数数据和回调函数内部传输的数据。4.3. 消息流式传输在我们的软件平台中，我们开发了一个消息流处理信息的实时共享方案。如图右侧所示。在清单1和清单1中，Node.js服务器使用body解析器，Q. 张医学信息学解锁17（2019）1002535图2. 我们的软件平台的消息流和信息共享组件的工作管道。在图形用户界面中，用户可以输入他们的唯一身份和关于医疗数据探索的评论，这些评论可以在所有连接的客户端之间共享。所有的信息和输入消息都可以存储在数据库表中，并且可以在Web浏览器中提取和显示。mysql libraries连接MySQL数据库和post/get data informa- tion到/从数据库表。在客户端，如图2和清单2所示，用户可以在我们平台的图形用户界面中输入姓名、唯一ID、电子邮件地址和电话号码等信息。用户还可以输入诊断评论和数据探索消息，这些消息与所有连接的客户端实时流传输。 如第[ 17-19 ]行所示，设计了一个“提交“按钮来监控“点击“事件。在第[21-28]行的回调函数中，用户信息和输入消息使用第28行的Socket.IO发出函数发送到服务器。如清单1所示，在服务器端，一个Socket。IO函数被设计为使用第23行中的代码侦听客户端事件。当服务器接收到用户输入的消息时，它使用25号线我们的基于Web的软件平台使用MySQL数据库服务器来存储和处理用户消息和信息，这些消息和信息自动存储在数据库表中，并且可以由任何连接的客户端提取并显示在Web浏览器中，其中图3描述了消息流工作管道。MySQL数据库运行在Apache HTTP服务器上，该服务器与Node.js服务器共享同一台硬件计算机。数据输入和输出操作由Node控制。js、mysql和body-parser库。EX press API用于使用清单1的[29系统的管理者可以访问和可视化所有存储的数据和信息，以进行信息挖掘和数据分析。4.4. 共享Web workerWebSocket连接只能在页面打开时持续存在，并且不能从同一个域加载新页面。因此，当一个线程花很长时间试图完成某个任务时，比如数据加载和信息传输，应用程序就会出现冻结。为了解决这个问题，我们设计了一个新的算法，利用共享Web worker来增强Web连接，其中主线程和worker通过消息进行通信，共享Web worker不依赖于任何特定的页面。因此，我们的JavaScript Web连接代码可以在与页面主线程不同的单独线程在我们的应用程序中，共享Web worker使用WebSocket协议与服务器通信，一旦从服务器获取数据，它就会将数据发布到主线程进行渲染。一个共享的Web工作线程可以被来自同一个域的多个页面使用，并且Web工作线程被派生以逐步从服务器加载数据，而主线程处理用户交互，因此数据加载不会冻结应用程序，例如医疗数据渲染，探索和信息共享。图1中中心直角的右边部分说明了使用共享Web worker优化数据加载并与Apache HTTP Server建立WebSocket连接的过程。以下项目描述了工作管道：– 初始化共享Web worker并使用WebSocket协议与Apache服务器建立连接。– 初始化的Web worker从服务器加载数据以进行卷可视化。每次worker接收到一个数据文件时，它都会解析该文件，然后将其发送给主线程。– 当主线程从worker接收到数据时，它会将它们添加到体积中并创建3D纹理。– 数据渲染引擎加载3D纹理进行体渲染和可视化探索。Q. 张医学信息学解锁17（2019）1002536图3. 从图形用户界面输入信息和消息的工作流程，这些信息和消息自动流入数据库，并在所有连接的客户端之间同步。如右侧基于Web的表所示，所有连接的客户端都可以从数据库中提取存储的数据并在Web浏览器中显示它们。5. 数据渲染和增强在本节中，我们描述了用于可视化和增强从医疗器械（如磁共振成像（MRI）和计算机断层扫描（CT））采集的3D医疗数据的主要技术和算法。除了绘制引擎的总体结构外，我们还着重介绍了一些有助于提高算法性能和医学数据绘制效果的方面和创新点，如使用图形硬件计算体素法线、三线性插值、光学值动态调整以及实时将光照融入到绘制的医学图像中。5.1. WebGl2和GPU流水线WebGL（Web-based Graphics Library，基于网络的图形库）是由Khronos Group开发的跨平台网络标准。WebGL程序由用JavaScript编写的控制代码和特殊效果代码组成，即，用OpenGL着色语言（GLSL）编写的着色器代码[52]，在计算机的图形处理单元（GPU）上执行以访问较低级别的图形硬件。WebGL 2.0（WebGL 2）[45]使Web内容能够使用基于OpenGL ES 3.0的API 以HTML执行3D渲染
我的内容管理
收起
我的收益 登录查看自己的收益
我的积分
登录查看自己的积分
我的C币
登录后查看C币余额
我的收藏 
我的下载 
下载帮助 
