java - JUNG - 大图可视化

Question

我目前正在开发一种使用图形可视化宏基因组数据的工具，因此开发了 Java JUNG 图形可视化库。

当显示大约 1000 个节点时，我遇到了延迟，无论是通过移动相机还是拖动一些节点。

是否有任何黑客可以用来改善这种情况？ 我阅读了一些关于将窗口分成 block 的内容，并且只使用正在显示的面板 block ，但我无法理解这一点。

谢谢。

Answer 1

这个问题可能被认为过于宽泛，因为优化的自由度实在是太多了。如果不是重复的话，有些问题至少是相关的( Improve the rendering of a JUNG graph 、 JUNG cannot display large graphs? 或其他)。

但是，我会尝试在这里回答:

一般来说，使用 JUNG，您可以创建一个漂亮的图形，具有令人印象深刻的默认功能(交互)和许多功能，只需几行代码即可轻松完成。在这方面，JUNG 的主要目标并不是绘制具有 1000 个顶点的图形。相反，它旨在绘制具有数十个(或可能只有数百个)顶点和边的图形很好地。

(事实上，从理论和信息可视化的角度来看，绘制具有 >1000 个顶点的图几乎没有任何意义。您将无法直观地从这样的图中提取任何信息- 至少，不是没有过度缩放和平移)

当你想渲染一个有很多顶点和很多边的图形时，有一些选项可以提高性能。 (你没有说边的数量。在很多情况下，这些是最昂贵的东西!)。

根据我的经验，提高渲染性能最重要的事情是......

禁用抗锯齿!

说真的，这真的很贵。在 JUNG 中，这可以通过

visualizationViewer.getRenderingHints().remove(
    RenderingHints.KEY_ANTIALIASING)

除此之外，还有许多提高性能的选项，但当然，它们都取决于您要牺牲的视觉特征。下面的示例显示了一个包含 2500 个顶点和 5000 条边的图。默认情况下，它非常慢。 improvePerformance 方法包含几个有关如何加快可视化速度的选项。即使只禁用抗锯齿，性能在我的(相当慢的)机器上也是可以接受的。

_{根据评论进行编辑/扩展:}

import java.awt.Dimension;
import java.awt.RenderingHints;
import java.awt.Stroke;
import java.awt.geom.Point2D;
import java.util.Random;

import javax.swing.JFrame;
import javax.swing.SwingUtilities;

import org.apache.commons.collections15.Predicate;

import edu.uci.ics.jung.algorithms.layout.FRLayout;
import edu.uci.ics.jung.algorithms.layout.Layout;
import edu.uci.ics.jung.graph.DirectedSparseGraph;
import edu.uci.ics.jung.graph.Graph;
import edu.uci.ics.jung.graph.util.Context;
import edu.uci.ics.jung.graph.util.Pair;
import edu.uci.ics.jung.visualization.Layer;
import edu.uci.ics.jung.visualization.RenderContext;
import edu.uci.ics.jung.visualization.VisualizationViewer;
import edu.uci.ics.jung.visualization.control.DefaultModalGraphMouse;
import edu.uci.ics.jung.visualization.decorators.EdgeShape;
import edu.uci.ics.jung.visualization.renderers.BasicEdgeRenderer;
import edu.uci.ics.jung.visualization.transform.shape.GraphicsDecorator;

public class JungPerformance 
{
    public static void main(String[] args) 
    {
        SwingUtilities.invokeLater(new Runnable()
        {
            @Override
            public void run()
            {
                createAndShowGUI();
            }
        });
    }

    private static void createAndShowGUI()
    {
        JFrame f = new JFrame();
        f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

        Graph<String, String> g = createGraph();

        Dimension size = new Dimension(800,800);
        VisualizationViewer<String, String> vv = 
            new VisualizationViewer<String, String>(
                new FRLayout<String, String>(g, size));
        DefaultModalGraphMouse<String, Double> graphMouse = 
            new DefaultModalGraphMouse<String, Double>();
        vv.setGraphMouse(graphMouse); 

        improvePerformance(vv);

        f.getContentPane().add(vv);
        f.setSize(size);
        f.setLocationRelativeTo(null);
        f.setVisible(true);
    }

    // This method summarizes several options for improving the painting
    // performance. Enable or disable them depending on which visual features
    // you want to sacrifice for the higher performance.
    private static <V, E> void improvePerformance(
        VisualizationViewer<V, E> vv)
    {
        // Probably the most important step for the pure rendering performance:
        // Disable anti-aliasing
        vv.getRenderingHints().remove(RenderingHints.KEY_ANTIALIASING);

        // Skip vertices that are not inside the visible area. 
        doNotPaintInvisibleVertices(vv);

        // May be helpful for performance in general, but not appropriate 
        // when there are multiple edges between a pair of nodes: Draw
        // the edges not as curves, but as straight lines:
        vv.getRenderContext().setEdgeShapeTransformer(new EdgeShape.Line<V,E>());

        // May be helpful for painting performance: Omit the arrow heads
        // of directed edges
        Predicate<Context<Graph<V, E>, E>> edgeArrowPredicate = 
            new Predicate<Context<Graph<V,E>,E>>()
        {
            @Override
            public boolean evaluate(Context<Graph<V, E>, E> arg0)
            {
                return false;
            }
        };
        vv.getRenderContext().setEdgeArrowPredicate(edgeArrowPredicate);

    }

    // Skip all vertices that are not in the visible area. 
    // NOTE: See notes at the end of this method!
    private static <V, E> void doNotPaintInvisibleVertices(
        VisualizationViewer<V, E> vv)
    {
        Predicate<Context<Graph<V, E>, V>> vertexIncludePredicate = 
            new Predicate<Context<Graph<V,E>,V>>()
        {
            Dimension size = new Dimension();

            @Override
            public boolean evaluate(Context<Graph<V, E>, V> c)
            {
                vv.getSize(size);
                Point2D point = vv.getGraphLayout().transform(c.element);
                Point2D transformed = 
                    vv.getRenderContext().getMultiLayerTransformer()
                        .transform(point);
                if (transformed.getX() < 0 || transformed.getX() > size.width)
                {
                    return false;
                }
                if (transformed.getY() < 0 || transformed.getY() > size.height)
                {
                    return false;
                }
                return true;
            }
        };
        vv.getRenderContext().setVertexIncludePredicate(vertexIncludePredicate);

        // NOTE: By default, edges will NOT be included in the visualization
        // when ONE of their vertices is NOT included in the visualization.
        // This may look a bit odd when zooming and panning over the graph.
        // Calling the following method will cause the edges to be skipped
        // ONLY when BOTH their vertices are NOT included in the visualization,
        // which may look nicer and more intuitive
        doPaintEdgesAtLeastOneVertexIsVisible(vv);
    }

    // See note at end of "doNotPaintInvisibleVertices"
    private static <V, E> void doPaintEdgesAtLeastOneVertexIsVisible(
        VisualizationViewer<V, E> vv)
    {
        vv.getRenderer().setEdgeRenderer(new BasicEdgeRenderer<V, E>()
        {
            @Override
            public void paintEdge(RenderContext<V,E> rc, Layout<V, E> layout, E e) 
            {
                GraphicsDecorator g2d = rc.getGraphicsContext();
                Graph<V,E> graph = layout.getGraph();
                if (!rc.getEdgeIncludePredicate().evaluate(
                        Context.<Graph<V,E>,E>getInstance(graph,e)))
                    return;

                Pair<V> endpoints = graph.getEndpoints(e);
                V v1 = endpoints.getFirst();
                V v2 = endpoints.getSecond();
                if (!rc.getVertexIncludePredicate().evaluate(
                        Context.<Graph<V,E>,V>getInstance(graph,v1)) && 
                    !rc.getVertexIncludePredicate().evaluate(
                        Context.<Graph<V,E>,V>getInstance(graph,v2)))
                    return;

                Stroke new_stroke = rc.getEdgeStrokeTransformer().transform(e);
                Stroke old_stroke = g2d.getStroke();
                if (new_stroke != null)
                    g2d.setStroke(new_stroke);

                drawSimpleEdge(rc, layout, e);

                // restore paint and stroke
                if (new_stroke != null)
                    g2d.setStroke(old_stroke);
            }
        });
    }


    public static Graph<String, String> createGraph() 
    {
        Random random = new Random(0);
        int numVertices = 2500;
        int numEdges = 5000;
        Graph<String, String> g = new DirectedSparseGraph<String, String>();
        for (int i=0; i<numVertices; i++)
        {
            g.addVertex("v"+i);
        }
        for (int i=0; i<numEdges; i++)
        {
            int v0 = random.nextInt(numVertices);
            int v1 = random.nextInt(numVertices);
            g.addEdge("e"+i, "v"+v0, "v"+v1);
        }
        return g;
    }    
}