Prefuse：为GraphView演示添加边权重 [英] Prefuse : Adding edge weights to the GraphView Demo

问题描述

我正在使用prefuse可视化工具包，工具包中的GraphView Demo非常棒，提供了各种控件来可视化数据。

I am using the prefuse visualization toolkit, The GraphView Demo in the toolkit is amazing providing a variety of controls to visualize the data.

我能够生成GraphML对于我的数据集并使用GraphView对其进行可视化，我希望有一个额外的事情是用权重或颜色编码标记边缘以展示两个节点之间的强度。

I am able to generate GraphML for my dataset and visualize it using GraphView, One additional thing that i would love to have is to label the edges with weights or color coding to demonstrate the strength between two nodes.

非常感谢任何有关相同的输入。谢谢..

Any input about the same are greatly appreciated..Thanks..

推荐答案

免责声明：我还没有使用过API检查文档:)似乎API有一个EdgeRenderer接口，您应该实现该接口以实现所需的行为。

Disclaimer: I haven't worked with the API just checked the documentation:) It seems that the API has an EdgeRenderer interface that you should implement to achieve the desired behaviour.

Ref： http://prefuse.org/doc/manual/introduction/example/ ， http://prefuse.org/doc/api/prefuse/rend呃/ DefaultRendererFactory.html

更新：首先是修正：实际上EdgeRenderer不是一个iterface而是一个类。我做了一个简单的演示来说明如何实现自定义边缘渲染。

Update: First a correction: in fact EdgeRenderer is not an iterface but a class. I've made a simple demo to illustrate how to implement custom edge rendering.

为包含节点标签首字母的边添加标签

Add label to edges containing the initials of the node labels

我做了一个快速而又脏的解决方案，即复制LabelRenderer并进行修改以处理边缘。

I made a quick and dirty solution, that is copied LabelRenderer and modified in order to handle edges.

我将该课程命名为 MyEdgeRenderer ：

public class MyEdgeRenderer extends AbstractShapeRenderer {

使用原始 EdgeRenderer 绘制边线（参见下面的 render（） for the renderer in action）：

use the original EdgeRenderer to draw edge lines (see render() below for the renderer in action):

protected EdgeRenderer m_edgeRenderer = new EdgeRenderer();

修改 getText（）获取缩写来自节点：

modify getText() to get the initials from nodes:

protected String getText(VisualItem item) {
    EdgeItem edge = (EdgeItem)item;
    VisualItem item1 = edge.getSourceItem();
    VisualItem item2 = edge.getTargetItem();    

    String t1 = null, t2 = null;
    if ( item1.canGetString(m_labelName) ) {
        t1 = item1.getString(m_labelName).substring(0,1);            
    };
    if ( item2.canGetString(m_labelName) ) {
        t2 = item2.getString(m_labelName).substring(0,1);            
    };
    if (t1 != null && t2 != null)
        return t1 + "-" + t2;
    else
        return null;
}

修改后的 getAlignedPoint（）将标签定位在边缘的一半：

modified getAlignedPoint() to position the label half way on the edge:

protected void getAlignedPoint(Point2D p, VisualItem item, 
        double w, double h, int xAlign, int yAlign)
{
    double x=0, y=0;                

    EdgeItem edge = (EdgeItem)item;
    VisualItem item1 = edge.getSourceItem();
    VisualItem item2 = edge.getTargetItem();

    // label is positioned to the center of the edge
    x = (item1.getX()+item2.getX())/2;
    y = (item1.getY()+item2.getY())/2;      
    ...

修改 render（）到（I）首先绘制线条，（II）使用黑色颜色：

modify render() to (I) first draw the line and (II) use black color:

public void render(Graphics2D g, VisualItem item) {         
    m_edgeRenderer.render(g, item);
    ...

    // render text
    int textColor = ColorLib.color(Color.BLACK); // item.getTextColor() 
    if ( text != null && ColorLib.alpha(textColor) > 0 ) {
    ...

为了测试，我修改了Prefuse网站上的样本（http://prefuse.org/doc/manual/introduction/example/Example.java） ：

For testing I modified the sample found on the Prefuse website (http://prefuse.org/doc/manual/introduction/example/Example.java):

    // -- 3. the renderers and renderer factory ---------------------------

    // draw the "name" label for NodeItems
    LabelRenderer ir = new LabelRenderer("name");
    ir.setRoundedCorner(8, 8); // round the corners

    // draw the "name" initials for EdgeItems
    MyEdgeRenderer er = new MyEdgeRenderer("name");
    er.setRoundedCorner(8, 8); // round the corners

    // create a new default renderer factory
    // return our name label renderer as the default for all non-EdgeItems
    // includes straight line edges for EdgeItems by default
    vis.setRendererFactory(new DefaultRendererFactory(ir, er));

这只是一个演示自定义渲染的演示。实际上，您可能会从图形模型中检索标签文本和颜色，即： EdgeItem.getString（），getTextColor（）。我想这两个属性都可以来自GraphML数据。此外，示例代码显示了如何为节点设置颜色，它也可能适用于边缘（虽然我还没有尝试过）：

This is just a demo to illustrate custom rendering. In real you would probably retrieve label text and color from the graph model, ie: EdgeItem.getString(), getTextColor(). I guess both attribute could come from the GraphML data. Also the example code shows how to set colors for nodes, it might be adapted for edges as well (though I haven't tried):

    // -- 4. the processing actions ---------------------------------------
    ...
    // use black for node text
    ColorAction text = new ColorAction("graph.nodes",
            VisualItem.TEXTCOLOR, ColorLib.gray(0));

这篇关于Prefuse：为GraphView演示添加边权重的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！