首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何使用Prefuse制作堆叠面积图?

如何使用Prefuse制作堆叠面积图?
EN

Stack Overflow用户
提问于 2011-02-02 12:05:45
回答 2查看 858关注 0票数 4

我想用prefuse做一个堆积面积图,类似于下面的:http://prefuse.org/gallery/namevoyager/

但是,我不太确定从哪里开始,也没有这些图表的示例代码。我确实找到了prefuse.action.layout.StackedAreaChart,但不确定如何处理它。

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2011-02-08 22:47:11

你检查过Prefuse manual了吗?(不是太完整,但这是一个开始)。

在其中,您可以找到一个sample application,它向您展示了如何在图元素上加载一些数据,以及如何将其部署到可视化项。

要生成StackedAreaChart,您需要将数据加载到prefuse.data.Table对象中,通过示例,您可以从CSV文件加载该对象:

代码语言:javascript
复制
CSVTableReader reader=new CSVTableReader();
Table myTable=reader.readTable("/myDataFile.csv");

然后,将该表作为数据组添加到可视化中,即" table“

代码语言:javascript
复制
Visualization vis = new Visualization();
vis.add("table", myTable);

然后,创建StackedAreaChart,并将其添加到可视化操作集合中:

代码语言:javascript
复制
//params: name of the data group to layout, name of the data field in which to store computed polygons, and an array containing the names of the various data fields, in sorted order, that should be referenced for each consecutive point of a stack layer
StackedAreaChart chart=new StackedAreaChart ("table", fieldName, csvColumnsToCompute);
//add the layout action with a unique key
 vis.putAction("myChartLayout", chart);

然后,您可以配置各种布局操作或其他可视化方面(请参阅链接的示例)。

最后,为了显示图表,您必须创建一个显示对象,绑定可视化,并在其上运行布局操作:

代码语言:javascript
复制
//this Display initialization is extracted from the Example app
Display d = new Display(vis);
d.setSize(720, 500); // set display size
// drag individual items around
d.addControlListener(new DragControl());
// pan with left-click drag on background
d.addControlListener(new PanControl()); 
// zoom with right-click drag
d.addControlListener(new ZoomControl());

// create a new window to hold the visualization
JFrame frame = new JFrame("prefuse example");
// ensure application exits when window is closed
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.add(d);
frame.pack();           // layout components in window
frame.setVisible(true); // show the window

//At the end: RUN THE CHART ACTION:
vis.run("myChartLayout");

希望这会有所帮助,至少作为第一次开始是这样(代码片段不是用于复制-粘贴的,可能包含一些编译错误)。

祝好运。

票数 1
EN

Stack Overflow用户

发布于 2011-02-11 13:18:14

下面是一个使用StackedAreaChart布局的可编译示例。我之所以把它写在这里,是因为我在其他地方找不到它,希望它能作为其他人的参考。这里的关键是要理解StackedAreaChart假设您的表遵循以下模式:

  1. 一列表示id,表示"name",
  2. 表示对应于id的实际数据的一列或多列。
  3. 表示名为"_polygon“、"_polygon:start”和"_polygon:end“的计算多边形的三列。这就是StackedAreaChart类的设计方式。"_polygon“实际上是常量VisualItem.POLYGON,因此您可以使用常量,如下例所示。

这就是它:

代码语言:javascript
复制
import javax.swing.JFrame;
import prefuse.Constants;
import prefuse.Display;
import prefuse.Visualization;
import prefuse.action.ActionList;
import prefuse.action.RepaintAction;
import prefuse.action.assignment.ColorAction;
import prefuse.action.assignment.DataColorAction;
import prefuse.action.layout.StackedAreaChart;
import prefuse.data.Table;
import prefuse.render.DefaultRendererFactory;
import prefuse.render.PolygonRenderer;
import prefuse.util.ColorLib;
import prefuse.visual.VisualItem;

class Main {
    public static void main(String[] args) {
        ActionList color = new ActionList();
        int[] palette = new int[] {
            ColorLib.rgba(255,200,200,150),
            ColorLib.rgba(200,255,200,150)
        };
        ColorAction fillColor = new DataColorAction("table", "name",
                Constants.NOMINAL, VisualItem.FILLCOLOR, palette);
        color.add(fillColor);

        ActionList layout = new ActionList();
        layout.add(new RepaintAction());
        String[] fields = { "1980s", "1990s", "2000s" };
        layout.add(new StackedAreaChart("table", VisualItem.POLYGON, fields));

        Visualization vis = new Visualization();
        Table table = new Table();
        vis.add("table", table);

        table.addColumn("name", String.class);
        table.addColumn("1980s", int.class);
        table.addColumn("1990s", int.class);
        table.addColumn("2000s", int.class);
        table.addColumn(VisualItem.POLYGON, float[].class, null);
        table.addColumn(VisualItem.POLYGON+":start", float[].class, null);
        table.addColumn(VisualItem.POLYGON+":end", float[].class, null);

        int rowNumber = table.addRow();
        table.setString(rowNumber, "name", "Bob");
        table.setInt(rowNumber, "1980s", 1000);
        table.setInt(rowNumber, "1990s", 500);
        table.setInt(rowNumber, "2000s", 300);

        rowNumber = table.addRow();
        table.setString(rowNumber, "name", "Mary");
        table.setInt(rowNumber, "1980s", 800);
        table.setInt(rowNumber, "1990s", 1500);
        table.setInt(rowNumber, "2000s", 3200);

        vis.putAction("layout", layout);
        vis.putAction("color", color);

        DefaultRendererFactory drf = new DefaultRendererFactory();
        drf.add("ingroup('table')", new PolygonRenderer());
        vis.setRendererFactory(drf);

        Display display = new Display(vis);
        display.setSize(720, 500);

        JFrame frame = new JFrame("Prefuse StackedAreaChart Example");
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.add(display);
        frame.pack();
        frame.setVisible(true);

        vis.run("layout");
        vis.run("color");
    }
}

要让它显示轴,请参考prefuse发行版中包含的Congress.java演示。

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/4870679

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档