No title

数据可视化项目

项目简介

这个大项目算是跨平台的数据可视化的一种尝试,最开始的初衷只是完成一个生物数据可视化的一部分,将数以亿计的基因碱基序列用图形的方法表示出来。

参考了Web端多种开源的Genome Browser,重点在JBrowser上。

后来改换思路,参考js的可视化框架D3,先将其基本图形的实现在iOS本地完成,然后将封装好的绘制接口暴露出来供以后使用JS来调用。主要本地的工作是1)对输入数据进行解析;支持多种类型的输入数据包括json,csv等 2)用OpenGL ES或原生的core animation等工具将处理完的数据显示出来。

项目内容和范例

首先是Genome browser,我们的小组对JBrowser的源码进行了解析,多亏了前端的兄弟“翻译”了大量的javascript代码才让我们有头绪开始工作。

首先是对基因数据进行处理,这些数据以bam这种格式存储在后台中,数以亿计的碱基对数据和蛋白质信息当然不可能是一次取完的,我们只能选择需要的片段来加载。这就要用到htslib这个第三方开源库,用来解析庞大的基因组数据。它会根据每段基因的索引文件计算出需要的片段的地址然后取出最适合的大小的片段。

我们要做的是将这个C++的库编译为iOS的静态库才能调用,主要就是修改makrfile,还有在不同架构下有的函数需要被修改才能适用。

后续可能会根据需求增加更多功能。

实现效果:
JBrowser效果

JBrowser

可以看到显示三种基因组数据:1.FASTA:单纯的DNA碱基序列 2.BAM:DNA测序结果序列 3.VCF: DNA测序检测出来的基因变异。

实现效果:

FASTA

BAM

这个项目iOS的部分也只是涉及了一些OpenGL绘制图形的内容,大部分工作其实都在查看JS代码,编译静态库,了解生物知识=。=

后面我们又接着尝试将Web端注明的开源框架D3的功能在原生应用中实现。除了基本图形之外还有一些很经典的图形比如弦图和力图(点之间力的关系)

弦图

力图

其他还有基本图形比如饼图、折线图还有各种自定义图形。

由于D3主要用SVG来显示图形,所以原生代码基本只能参考数据处理部分,包括Json的解析还有各种容器封装。实际在绘制上实现都是用了OpenGL、core animation还有core graphics,并将它们进行封装。

当前网速较慢或者你使用的浏览器不支持博客特定功能,请尝试刷新或换用Chrome、Firefox等现代浏览器