可视化工具solo show-----Processing Prefuse show

  继上篇《可视化工具solo show》罗列出一些主要基于Java开发的软件、插件之后,又仔细揣摩了下哪些可以为我所用。

  一番端详之后,准备挑出其中Processing和Prefuse两位大将出来一展雄威!

  (备注:上次和此次“solo show”都未提及gephi,并不是说它不入流,不上档次,恰恰它是一款高大上、优秀的可视化工具,只是这两篇都是在笔者继初探gephi源码绊脚后对一些工具的探讨对比,所以没有将其入列。)

1.Processing:

  Processing 的最初目标是开发图形的 sketchbook 和环境,用来形象地教授计算机科学的基础知识。之后,它逐渐演变成了可用于创建图形可视化专业项目的一种环境。

  Processing 是用 Java 编程语言写的。

  Processing的API地址:http://processing.org/reference/ 有如何着色、画线、呈现图形图像等介绍。

http://processing.org/reference/javadoc/core/

  官网地址:http://www.processing.org/

  Processing开发的是Java Applet应用程序。Java小程序,也就是Java Applet,可以在Web浏览器中运行。Java Applet必须以<applet>脚本的形式嵌入到HTML页面中,才能在web浏览器中运行。它的缺点之一是要使用到Java小应用程序,在某些计算机上载入时可能会很慢,而且并不是每个人都安装了Java(尽管多数人都安装了)。不过这也有解决办法,Processing已经发布了它的JavaScript版本。

  但是Java Applet有自己的短处,效率低,需要JVM支持,没有成型的IDE工具。Java小程序,也就是Java Applet,可以在Web浏览器中运行。Java Applet必须以<applet>脚本的形式嵌入到HTML页面中,才能在web浏览器中运行。)

  下面简要介绍Processing API的一部分:

  Processing 应用程序是有一定结构的,这一点在开发能够持续运行且随时更改显示窗口的图形应用程序(比动画)时非常重要。在这种情况下,就凸显了 setup 和 draw 这两个函数的重要性。

  setup() 函数用于初始化,由 Processing 运行时执行一次。通常,setup() 函数包含 size ()函数(用于定义窗口的边界)以及在操作期间要使用的变量的初始化。Processing 运行时会不断执行 draw ()函数。每次 draw() 函数结束后,就会在显示窗口绘制一个新的画面,并且 draw() 函数也会被再次调用。默认的绘制速度是每秒 60 个画面,但是您也可以通过调用 frameRate() 函数来更改这个速度。

  此外,还可以使用 noLoop() 和 draw() 来控制在何时绘制画面。noLoop() 函数会导致绘制停止,而使用 loop ()函数则可以重新开始绘制。通过调用redraw() 可以控制 draw 在何时调用。

  size() 关键字指定显示窗口的 X 和 Y 坐标。 size ()接受可选的第三个参数 mode。 mode 用来定义要使用的呈现引擎并支持 PDF(直接呈现为 Adobe® PDF 文档)、OPENGL (利用一个可用的 Open-GL 图形适配器)、P3D(为了迅速的 3-D 呈现)等。默认的是 JAVA2D,它最适合于高质量的 2-D 成像。

  可以使用 get() 操作来读取显示中的一个给定像素点的颜色。虽然 set() 很简单,但它不是操做显示的最快方式。要想快速访问,可以使用pixels 数组(与 loadPixels 和 updatePixels 函数一致)。

  在 Processing 内使用单个函数绘制形状十分简单。要设置在绘制形状时使用何种颜色,可以利用 stroke ()函数。此函数可接受一个单独的灰度参数或三个 RGB 参数。此外,还可以用 fill 命令定义这个形状的填充色。

  line() 函数接受四个参数,代表的是要在其间绘制线条的点。rect ()函数可绘制一个矩形,并且前两个点定义位置,而后面两个点则分别定义宽度和高度。ellipse ()函数也接受四个参数,分别定义位置和宽/高度。当宽和高相等时,就是一个圆形。还可以使用 ellipseMode() 函数定制椭圆,它指定 x,y 位置是否代表了椭圆的角(CORNER)或中心(CENTER)。

   quad() 可以很容易地绘制有四个边的多边形。四边形接受八个参数,代表的是这个四边形的四个顶点。

  Processing支持对于键盘和鼠标的事件监听,如keyPressed()、keyRealeased()、mousePressed()、mouseMoved()等。

  Processing支持面向对象编程。

  但是Processing不像下面要介绍的Prefuse已经集成有布局算法了。

  参考资料:http://www.ibm.com/developerworks/cn/opensource/os-datavis/

  下面是在Processing客户端运行的一个demo(当然也可以在Eclipse/Myeclipse中运行,需要安装Processing的插件):

 1 void setup() {
 2   size(640, 360, P3D);
 3   noStroke();
 4 }
 5 
 6 void draw() {
 7   background(0);
 8   translate(width / 2, height / 2);
 9   
10   // Orange point light on the right
11   pointLight(150, 100, 0, // Color
12              200, -150, 0); // Position
13 
14   // Blue directional light from the left
15   directionalLight(0, 102, 255, // Color
16                    1, 0, 0); // The x-, y-, z-axis direction
17 
18   // Yellow spotlight from the front
19   spotLight(255, 255, 109, // Color
20             0, 40, 200, // Position
21             0, -0.5, -0.5, // Direction
22             PI / 2, 2); // Angle, concentration
23   
24   rotateY(map(mouseX, 0, width, 0, PI));
25   rotateX(map(mouseY, 0, height, 0, PI));
26   box(150);
27 }

运行的效果图:

2.Prefuse:

  Prefuse的API地址:http://prefuse.org/doc/api/

  Prefuse的用户手册:http://prefuse.org/doc/manual/

  Prefuse是采用Java语言开发的数据可视化工具。其支持丰富的数据模型、可视化、交互的特性,具有表格、树形、一系列的布局和动画的效果。Prefuse使用Java的2D图形库编程,能够有效集成到Java Swing的应用程序和Applets中,并且是free to use。------源码可得。

  官网地址:http://prefuse.org/

  Prefuse是一个提供交互式信息可视化的用户界面工具包。

  Prefuse绘制的图形可以是一个文件系统、计算机网络、网站、生物分类或是社交网络等,图形的展示需要数据,所以需要先得到数据并导入。

  Prefuse提供了图形接口包括节点、边、树状节点、图、树等多种展现形式,其也提供了图形读写接口,包括读取XML、CSV等格式的数据文件。

  Prefuse提供图形过滤功能,包括锁定某一限定范围的图形进行展示和操作。ItemRegistry(组件注册机制)是Prefuse中的核心数据结构机制,它控制原始图形到可视化组件展现之间的映射关系,并且可以针对需要过滤组件提供一个快速迭代的队列。

  Renderers(渲染器)负责画图以及计算图形边界,其也是RendererFacotry针对给定的可视化组件进行可视化呈现的途径。

  渲染器提供了包括图形渲染(ShapeRenderer)、文本渲染(TextRenderer)、文本图像渲染(TextImageRederer)、边渲染(EdgeRenderer)、聚合子树渲染(SubtreeAggregateRenderer)等多种渲染方式。

  数据展示类(Display)提供了在屏幕上画图以及互动性操作,该类继承了javax.swing.JComponent,并通过ControlListener接口以及prefuse.controls进行图形界面监听以及反馈。该类支持屏幕图形的文本编辑、图形变换、平移以及缩放。

  图形处理操作(比如过滤、布局、分配属性等)是通过构造一个叫做Actions的处理模块管道来实现的。ActionLists通过向ActivityManager提交任务并执行。

  Actions中主要包括如下操作:

  Filters: GraphFilter, TreeFilter, FisheyeTreeFilter, FisheyeGraphFilter

  Layout: ForceDirectedLayout, RadialLayout, SquarifiedTreeMapLayout, …

  Assignment: ColorFunction, SizeFunction, FontFunction

  Interpolation: ColorInterpolator, LinearInterpolator, PolarInterpolator

  如何使用Prefuse构建一个app:

  1. 设计可视化界面,确定如何布局、交互;
  2. 确定图数据的输入、输出;
  3. 初始化ItemRegistry和Display(s)类;
  4. 选择或实现Renderers(渲染器)和RendererFactory(渲染工厂);
  5. 构建各种必须的ActionLists;
  6. 使用Actions现有的库,或是定制的模块(或者子模块比如Force函数);
  7. 编写用户回调界面来协调ActionLists。

  补充:Vizster is a prefuse-built visualization of online social network services such as Friendster and Orkut.

Vizster也是基于Prefuse开发的一款在线社交网络可视化软件。

  下面我们看看两个Prefuse自带demo的显示效果:

综上可以发现:Processing简单灵活,只需几行代码即可绘制绚丽的图形,其更侧重艺术效果,如3D效果、投光角度等;

Prefuse灵活度更高,API粒度小,操控方便,而且内置力导向布局、树状布局、网格布局等多种布局方式。

如需转载请标明出处:http://www.cnblogs.com/bigdataZJ/p/VisualizationSoloShow2.html

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏hightopo

基于 HTML5 Canvas 绘制的电信网络拓扑图

32630
来自专栏我的小碗汤

极致简洁的markdown编辑神器

Markdown 其实向来是文字爱好者和码农们的小众需求,市面上也涌现出了形形色色的 Markdown 编辑器,Mou、Typed、Ulysess、Macdow...

29950
来自专栏张戈的专栏

张戈博客成功启用移动端主题:Mobile Pack

建站以来,总是忙于 PC 端主题的折腾,移动端主题只是偷懒的使用了 WPtouch 插件。现在 PC 端主题已完善七七八八了,是时候折腾下移动端自适应主题了,毕...

39860
来自专栏nimomeng的自我进阶

Event官方文档

当系统传递一个touch event,首先会send到一个特定的view。对于touch view来讲,这个view就是被hitTest:withEve...

14120
来自专栏小程序之家

如何在小程序中使用罗盘

现代生活中,经常会用到导航系统,导航系统必不可少的一个功能就是罗盘,何为罗盘?简单罗盘通过磁力将内部的指针指向某个方向,从而实现判别方位。现代技术以及将罗盘缩小...

70050
来自专栏有趣的django

博客园美化终极版-(自定义导航栏)----什么CSDN、简书、腾讯云专栏、个人博客和微信公众号都弱爆了

82800
来自专栏Material Design组件

Human Interface Guidelines —— Pickers

11720
来自专栏韩伟的专栏

Unity 2D 手册部分翻译

Unity 2D 原文地址 ? 本章包括Unity 2D的文档 你可以从以下 文档 得到如何切换2D/3D模式的更多细节。 参看 2D和3D项目 了解使用2D或...

45550
来自专栏携程技术中心

干货 | React Fiber 初探

22620
来自专栏QQ音乐技术团队的专栏

web实时长图实践

本文将介绍几种浏览器端和服务器端 web 实时生成图片的方案,欲知详情请看文章详情。

1.4K80

扫码关注云+社区

领取腾讯云代金券