【新闻】HTML5用于医学和科研领域的数据可视化

标签: HTML5 技术博文 HTML5前沿技术 HTML5最新动态 | 发表时间:2012-05-09 12:46 | 作者:HTML5研究小组
出处:http://www.mhtml5.com

尽管HTML5 Canvas 游戏和WebGL Demo在互联网上吸引了绝大数人的眼球,但在这之外,依然有人默默地致力于研究如何将HTML5 WebGL 利用于医学和科研领域的数据可视化。

例如  XTK,全称是X Toolkit,就是一个被设计为用于科研领域数据可视化的 WebGL 框架。它可以解析标准的科研数据格式,并生成全交互的、可以旋转的、可以自由查看的3D模型。它可以被广泛利用于各个领域,从心脏扫描的3D图形演示,到CERN大型粒子对撞机的散布形态,都可以被很好地进行可视化输出。在图形输出上,XTK主要致力于体绘制技术,它允许进行实体建模(CSG: Constructive Solid Geometry);也就是说,基本上可以用最简单的几何体形状根据集合论的布尔逻辑来组成复杂物体。在处理3D图形数据的横断面切片时,非常简单易用。

XTK的作者  Daniel Haehn 和  Nicolas Rannou 之前从事于传统桌面领域的数据可视化工程,在去年夏天偶然看到了包括  WebGL Brain Viewer 在内的一些 WebGL Demo 之后,他们开始研究那些基于网络的数据可视化工具。

“那些工具通常都要求使用者对低级计算机图形编程有深厚的了解,这对于(科研领域的)目标人群来说学习难度太大了!”

于是,仿照基于 C++ 开发的数据可视化框架,XTK就诞生了。它的目标是尝试创建一套可以应用于多个领域并且简化处理流程的 API。关于XTK的更多信息,你可以查看 Daniel Haehn 的题为 《WebGL for Baby Brains》的精彩演讲,其中讲述了如何在神经成像领域更好地利用 web 技术。

其他科研可视化项目 Zygote Body


这个之前被大家熟知为“Google Body”的项目大概是最为著名的使用了 WebGL 技术的医学可视化范例。

它以完全互动的方式将完整的人体结构分层呈现在人们面前,包括肌肉结构、各个器官和心血管系统。现在 Google 已经将此项目过继给 Zygote 公司,而且公开了除美术资源之外的所有源代码。
BioDigital Human

BioDigital Human 使用了 SceneJS 这个 WebGL 框架创建了更具细节的人体解剖演示。目前该项目刚刚结束 beta 测试,仍然有一些 bug,但是当你可以正常的运行时,你一定会为它感到震惊不已。
WebGL Molecule Viewer

科研领域的数据可视化并不只是人体结构,例如 WebGL Molecule Viewer 就可以解析符合工业标准的分子描述格式,然后输出一个可以交互的3D模型查看界面。这个项目的网站看起来有些简陋,但是内在功能却十分强大,值得一看。
CanvasMol

最后要介绍的是 AlteredQualia 在去年夏天发布的作品,AlteredQualia 同时也是著名的 WebGL 框架 Three.js 的主要代码贡献者之一。CanvasMol可以和上面介绍的 WebGL Molecule Viewer 一样读取工业标准格式,然后生成可交互的3D模型,但是它的界面做的更加美观。

未来将 HTML5 WebGL 技术应用于文化教育领域的潜力十分巨大。与奢侈的游戏娱乐行业相比,这些团体和组织通常资金有限,但却拥有海量的科研数据。如果能够通过各种工具让这些数据内容显示在浏览器中,那么它们将再次焕发新生。想象一下——在一个博物馆的网站上,访问者可以在浏览器中自由的查看每一件展品;或者在某个医学院的图书馆中而不是实验室里,学生可以在“数码尸体”上下手,学习解剖学知识。

关于作者:

Simon Madine,资深游戏设计师,致力于教育互动产品;同时他也是 Nokia Maps 的高级前端工程师。

 

相关 [新闻 html5 医学] 推荐:

【新闻】HTML5用于医学和科研领域的数据可视化

- - HTML5研究小组
尽管HTML5 Canvas 游戏和WebGL Demo在互联网上吸引了绝大数人的眼球,但在这之外,依然有人默默地致力于研究如何将HTML5 WebGL 利用于医学和科研领域的数据可视化. 例如  XTK,全称是X Toolkit,就是一个被设计为用于科研领域数据可视化的 WebGL 框架. 它可以解析标准的科研数据格式,并生成全交互的、可以旋转的、可以自由查看的3D模型.

HTML5:新闻网站的新选择

- - HTML5研究小组
HTML5是HTML语言的更新版,被业内公认为是近十年来 Web 标准最大的飞跃,将成为下一代的Web语言. 随着新技术的发展,移动阅读已经成为一种不可逆转的趋势. 智能手机、平板电脑则上升为人们接触媒体、阅读新闻的首选. 在这样的背景下,新闻网站面临两难选择:. A选项——继续把原有网站做好,吸引用户浏览.

【新闻】Android4.0 HTML5浏览器比不过iOS5?

- - HTML5研究小组
12月16日消息:据Sencha测试报告显示,虽然 Android 4.0冰淇淋三明治对HTML5浏览器的性能支持力度很大,但苹果iOS 5仍然是霸主. Sencha是一家创建HTML5网络应用程序框架的公司,充分利用其先进的功能:地理定位、动画,反射和转换等优势,因此该公司对最佳支持HTML5的移动浏览器产生兴趣,并给出测试结果,该测试更侧重于三星Galaxy Nexus(搭载Android4.0,冰淇淋三明治).

【新闻】搜狐微博推出全新手机HTML5触屏版

- - HTML5研究小组
近日,搜狐微博全力推出手机微博触屏版(w.sohu.com/m),该版采用最新HTML5技术,全新的视觉设计,让你在网页上享受超越客户端的用户体验. HTML5是一种技术标准,被业界视为未来移动应用的重要趋势,HTML5从根本上改变了开发商开发web应用的方式,从桌面浏览器到移动应用. 这种语言正在影响并将继续影响着各种操作平台.

BBC已经在新闻页面用HTML5取代Flash

- - HTML5研究小组
就在80% 的Web 视频已经被统计出采用HTML5 规范的今天,英国媒体BBC 宣布将其新闻网站中的所有页面改组成HTML5 规范,之前的Flash播放器及其内容将随之淡出. 这意味着BBC针对移动设备以及不同种类不同平台浏览器的兼容性将变得更好. 而业内担忧的是HTML5的控制功能并不完善,是否可以胜任视频传输的任务,此外HTML5没有Flash的DRM来控制版权视频的播放.

【新闻】HTML5将让电视产业重洗牌

- - HTML5研究小组
有没有想过,下一代的电视将是什么模样. 只是一台有浏览器的大电脑,还是一台有联网功能的大电视呢. 事实上,在新一代的 HTML5架构下,电视的定义早就已经逐渐被改写了. HTML5已经跳脱原本电脑上网的范畴,走入行动上网的新境界,更让电视产业的发展重新洗牌. 未来的电视使用者,可以透过HTML5技术,获得更有智慧的电视体验,以及更多样化的节目选择方式.

重大新闻!社交网络Facebook发布HTML5应用中心,杀向苹果应用商店,可能就是传说中的斯巴达项目

- - TF全部内容|科技源TechFrom
TechFrom科技源 5.10日,终于发布了. 社交网络Facebook 基于现有的平台,推出应用中心是迟早的事情,类似于苹果应用商店 App Store,但是基于HTML5 并且是网络版,支持付费应用. Facebook官方发布说明, via,是一个为Facebook用户和开发者提供的第三方应用平台,并将所有的第三方应用打造成一个基于Facebook社交网络的App生态系统.

HTML5 logo 发布

- Greyby - 酷壳 - CoolShell.cn
2011年1月19日,W3C发布了HTML5的log,打开W3C的页面,下在的图片印入眼前. 我的第一感觉,就像是看到了小时候看的八一电影制片产的电影. 这分明是号召全世界的无产Web程序员们团结起来,不畏艰难,不怕牺牲,一定要把HTML5的革命事业进行到底. 所以,请各位Web程序员不但在你们的HTML5的网页上加上下面的徽章(关于各个徽章的含义,请参看这里).

html5 canvas入门

- - Marshal's Blog
可以把canvas看做div,不过,它的长和宽不能通过css来定义,要使用标签属性:. 或者javascript对象属性设置:. 使用canvas,只有一种操作方式,使用javascript. 获得canvas对象的上下文对象,该对象是操作canvas的主要对象:. 使用canvas画最简单的线, 点击运行示例,结果看起来是这样:.

HTML5新特性

- - CSDN博客推荐文章
 通过fillStyle和strokeStyle 属性可以轻松的设置矩形的填充和线条. 颜色值使用方法和CSS 一样:十六进制数、rgb()、rgba() 和 hsla. 通过 fillRect可以绘制带填充的矩形. 使用 strokeRect 可以绘制只有边框没有填充的矩形. 如果想清除部分 canvas可以使用clearRect.