需求描述
cytoscape里面默认的node只能分配一个颜色。想要对每个node在某一份组当中的具体的值。类似这种的
image.png
数据准备
cytoscpe图形可视化需要准备的数据包括两个：
- 显示网络数据的文件，其中包括不同node之前的相互作用关系。例如从string数据库中导出的tsv文件。或者自己形成一个一一对应关系的文件即可。
image.png
- 每个node的注释文件：这个文件有一个包含所有node的的列，其余的是对于每个node的注释。例如在每个分组当中的值
image.png
数据导入
我们通过file - import导入数据：其中netword from file导入网络文件。table from file导入注释文件
image.png
图形调整
- Layout调整：导入后的数据是这样的
image.png
我们通过调整layout以及简单的style可以可以调整为：
image.png
- 添加注释图形：cytoscape里面我们一般来设置每个node的颜色可以在
Fill color以及Border Paint里面来设置填充色以及边框颜色。但是cytoscape里面还有一个image/Chart的选项可以让我们来加入图片和简单的统计图形。如果我们需要显示同种颜色可以使用这个选项里面的扇形图
image.png
我们点击image/Chart。可以看到。这里设立选择图片或者的图标。
image.png
如果我们选择其中一个图片，我们的node里面就会显示这个图片的内容。例如：
image.png
同时我们也可以在open image manager里面来添加自己想要的图形。
如果我们选择Charts就可以加载简单的数据图形。这里可以选择的包括：柱状图；箱式图；热图；线图；饼图以及环图。我们在选择pie同时把想要进行可视化的数据放到右边边框。
image.png
点击Apply即可看到这个对于不同分组占比的可视化了。
image.png
如果对图形感觉颜色不满意，我们可以在Options对颜色以及不同分组之间的边框进行调整
image.png
image.png
- 显示多个图形；加入我有多个不同分组的数据想要可视化，怎么添加更多类型的图形呢？
在自定义调整当中，系统默认显示的是常用的几个选项。我们可以点击Properties-Paint就会发现可以添加最多9种自定义图形。同时默认的图形都是在node的中间。所以系统也会提供自定义图形摆放的位置。
image.png
例如：我用上面的数据再做个一个简单的柱状图然后放到node的右边。
image.png
- 进一步优化：如果细心观察每个node都在添加图形之后，虽然掩盖了node的颜色，但是会有一部分没有掩盖好，这个自己看会影响美观的。
image.png
如果要去掉的话，试过把fill color调整为白色，但是发现也很突兀。
image.png
想了想最后把Transparency透明度0.感觉好了一点。别的实在没有想到别的办法。
image.png
网友评论