- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我需要一个组织结构图树,并且我希望能够折叠和展开任何级别的节点。我是 JGraphX 的新手,但从我读到的内容来看,实现折叠的方法似乎是对顶点进行分组。问题是当我创建组时,它会将所有子顶点放在父顶点内。
下面是一些示例代码,它提供了很好的布局但不支持折叠:
package com.mxgraph.examples.swing;
import java.util.ArrayList;
import java.util.List;
import javax.swing.JFrame;
import javax.swing.SwingConstants;
import com.mxgraph.layout.mxCompactTreeLayout;
import com.mxgraph.layout.hierarchical.mxHierarchicalLayout;
import com.mxgraph.model.mxGeometry;
import com.mxgraph.swing.mxGraphComponent;
import com.mxgraph.util.mxConstants;
import com.mxgraph.util.mxPoint;
import com.mxgraph.util.mxRectangle;
import com.mxgraph.view.mxGraph;
import com.mxgraph.layout.hierarchical.mxHierarchicalLayout;
public class HelloWorld extends JFrame
{
/**
*
*/
private static final long serialVersionUID = -2707712944901661771L;
public HelloWorld()
{
super("Hello, puppies!");
mxGraph graph = new mxGraph();
Object parent = graph.getDefaultParent();
graph.getModel().beginUpdate();
try
{
//Notice that the parent is the default parent...
//The hierarchical structure looks great but I cannot collapse/expand the tree.
Object vDogsRoot = graph.insertVertex(parent, null, "DOG", 0, 0, 80, 30);
Object v2 = graph.insertVertex(parent, null, "Shar Pei", 0, 0, 80, 30);
Object v3 = graph.insertVertex(parent, null, "Pug", 0, 0, 80, 30);
Object v4 = graph.insertVertex(parent, null, "Cocker Spaniel", 0, 0, 80, 30);
Object v5 = graph.insertVertex(parent, null, "Pit Bull", 0, 0, 80, 30);
Object v6 = graph.insertVertex(parent, null, "Chihuahua", 0, 0, 80, 30);
graph.insertEdge(parent, null, "", vDogsRoot, v2);
graph.insertEdge(parent, null, "", vDogsRoot, v3);
graph.insertEdge(parent, null, "", vDogsRoot, v4);
graph.insertEdge(parent, null, "", vDogsRoot, v5);
graph.insertEdge(parent, null, "", vDogsRoot, v6);
mxHierarchicalLayout layout = new mxHierarchicalLayout(graph);
layout.setUseBoundingBox(false);
layout.execute(parent);
}
finally
{
graph.getModel().endUpdate();
}
mxGraphComponent graphComponent = new mxGraphComponent(graph);
getContentPane().add(graphComponent);
}
public static void main(String[] args)
{
HelloWorld frame = new HelloWorld();
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setSize(400, 320);
frame.setVisible(true);
}
}
产生:
不错的开始,但没有折叠按钮。以下代码演示了我遇到的问题。为了支持折叠,我尝试通过将顶点的父级从默认父级更改为作为树根的 vDogVertex 来创建一个组。这变得可折叠,但是所有子顶点都在 vDogVertex 内部,这会破坏树布局。
package com.mxgraph.examples.swing;
import java.util.ArrayList;
import java.util.List;
import javax.swing.JFrame;
import javax.swing.SwingConstants;
import com.mxgraph.layout.mxCompactTreeLayout;
import com.mxgraph.layout.hierarchical.mxHierarchicalLayout;
import com.mxgraph.model.mxGeometry;
import com.mxgraph.swing.mxGraphComponent;
import com.mxgraph.util.mxConstants;
import com.mxgraph.util.mxPoint;
import com.mxgraph.util.mxRectangle;
import com.mxgraph.view.mxGraph;
import com.mxgraph.layout.hierarchical.mxHierarchicalLayout;
public class HelloWorld extends JFrame
{
/**
*
*/
private static final long serialVersionUID = -2707712944901661771L;
public HelloWorld()
{
super("Hello, puppies!");
mxGraph graph = new mxGraph();
Object parent = graph.getDefaultParent();
graph.getModel().beginUpdate();
try
{
//Notice this time the parent is the vDogsRoot vertex.
//This creates a cell group if I understand correctly.
Object vDogsRoot = graph.insertVertex(parent, null, "DOG", 0, 0, 80, 30, "");
Object v2 = graph.insertVertex(vDogsRoot, null, "Shar Pei", 0, 0, 80, 30, "");
Object v3 = graph.insertVertex(vDogsRoot, null, "Pug", 0, 0, 80, 30, "");
Object v4 = graph.insertVertex(vDogsRoot, null, "Cocker Spaniel", 0, 0, 80, 30, "");
Object v5 = graph.insertVertex(vDogsRoot, null, "Pit Bull", 0, 0, 80, 30, "");
Object v6 = graph.insertVertex(vDogsRoot, null, "Chihuahua", 0, 0, 80, 30, "");
graph.insertEdge(parent, null, "", vDogsRoot, v2);
graph.insertEdge(parent, null, "", vDogsRoot, v3);
graph.insertEdge(parent, null, "", vDogsRoot, v4);
graph.insertEdge(parent, null, "", vDogsRoot, v5);
graph.insertEdge(parent, null, "", vDogsRoot, v6);
mxHierarchicalLayout layout = new mxHierarchicalLayout(graph);
layout.setUseBoundingBox(false);
layout.execute(vDogsRoot); //apply the layout to the root group node.
layout.execute(parent);
}
finally
{
graph.getModel().endUpdate();
}
mxGraphComponent graphComponent = new mxGraphComponent(graph);
getContentPane().add(graphComponent);
}
public static void main(String[] args)
{
HelloWorld frame = new HelloWorld();
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setSize(400, 320);
frame.setVisible(true);
}
}
产生:(注意折叠按钮)
如何防止顶点位于单元组的父单元内?我希望保留树层次结构但可折叠。我使用 Cell Groups 的方法是否正确?我做错了什么?
我怀疑我只需要告诉单元格组 (vDogsRoot) 的父级允许将单元格绘制到其边界之外,但我还没有找到执行此操作的方法。或者也许我采取了完全错误的方法。认为这应该是一件微不足道的事情,但我已经尝试了很多不同的事情并用谷歌搜索/阅读了许多文档但还没有成功。
更新 1:
组不是我在这里需要的。我只需要遍历有向树并切换显示所选节点下方的节点。在 mxGraph 示例文件夹中找到一个名为 tree.html 的 java 脚本示例。只需将该示例从 JavaScript 转换为 Java。
最佳答案
哎呀,不确定我对此有何看法,但这是一个解决方案。我部分转换了 tree.html example从 JavaScript 到 Java。我没有将所有代码都转换为 Java;我什至没有尝试,因为我不关心折叠按钮的位置。我确实得到了我想要的功能。我确实添加了一些 super 方法正在执行的代码,以防该部分很重要。
如果有人想完成示例的转换并将其提供给我,我很乐意将答案授予您,而不是将答案授予自己。获得答案的其他方法 - 指出我的代码中的错误,以某种方式改进它或提供更好的代码方法。
这是我的 Java 代码:
package com.mxgraph.examples.swing;
import java.util.ArrayList;
import java.util.List;
import javax.swing.JFrame;
import com.mxgraph.layout.mxCompactTreeLayout;
import com.mxgraph.swing.mxGraphComponent;
import com.mxgraph.util.mxEvent;
import com.mxgraph.util.mxEventObject;
import com.mxgraph.util.mxEventSource.mxIEventListener;
import com.mxgraph.view.mxGraph;
/**
* A foldable directed acyclic graph (DAG) where each child has only one parent. AKA a Tree.
*
* @author some programmer
*
*/
class FoldableTree extends mxGraph
{
/**
* Need to add some conditions that will get us the expand/collapse icon on the vertex.
*/
@Override
public boolean isCellFoldable(Object cell, boolean collapse)
{
//I want to keep the original behavior for groups in case I use a group someday.
boolean result = super.isCellFoldable(cell, collapse);
if(!result)
{
//I also want cells with outgoing edges to be foldable...
return this.getOutgoingEdges(cell).length > 0;
}
return result;
}
/**
* Need to define how to fold cells for our DAG. In this case we want to traverse the tree collecting
* all child vertices and then hide/show them and their edges as needed.
*/
@Override
public Object[] foldCells(boolean collapse, boolean recurse, Object[] cells, boolean checkFoldable)
{
//super.foldCells does this so I will too...
if(cells == null)
{
cells = getFoldableCells(getSelectionCells(), collapse);
}
this.getModel().beginUpdate();
try
{
toggleSubtree(this, cells[0], !collapse);
this.model.setCollapsed(cells[0], collapse);
fireEvent(new mxEventObject(mxEvent.FOLD_CELLS, "cells", cells, "collapse", collapse, "recurse", recurse));
}
finally
{
this.getModel().endUpdate();
}
return cells;
}
// Updates the visible state of a given subtree taking into
// account the collapsed state of the traversed branches
private void toggleSubtree(mxGraph graph, Object cellSelected, boolean show)
{
List<Object> cellsAffected = new ArrayList<>();
graph.traverse(cellSelected, true, new mxICellVisitor() {
@Override
public boolean visit(Object vertex, Object edge) {
// We do not want to hide/show the vertex that was clicked by the user to do not
// add it to the list of cells affected.
if(vertex != cellSelected)
{
cellsAffected.add(vertex);
}
// Do not stop recursing when vertex is the cell the user clicked. Need to keep
// going because this may be an expand.
// Do stop recursing when the vertex is already collapsed.
return vertex == cellSelected || !graph.isCellCollapsed(vertex);
}
});
graph.toggleCells(show, cellsAffected.toArray(), true/*includeEdges*/);
}
}
public class ChampsTree extends JFrame
{
private static final long serialVersionUID = -2707712944901661771L;
public ChampsTree()
{
super("Hello, World!");
FoldableTree graph = new FoldableTree();
mxCompactTreeLayout layout = new mxCompactTreeLayout(graph, false);
layout.setUseBoundingBox(false);
layout.setEdgeRouting(false);
layout.setLevelDistance(30);
layout.setNodeDistance(10);
Object parent = graph.getDefaultParent();
graph.getModel().beginUpdate();
try
{
Object root = graph.insertVertex(parent, "treeRoot", "Root", 0, 0, 60, 40);
Object v1 = graph.insertVertex(parent, "v1", "Child 1", 0, 0, 60, 40);
graph.insertEdge(parent, null, "", root, v1);
Object v2 = graph.insertVertex(parent, "v2", "Child 2", 0, 0, 60, 40);
graph.insertEdge(parent, null, "", root, v2);
Object v3 = graph.insertVertex(parent, "v3", "Child 3", 0, 0, 60, 40);
graph.insertEdge(parent, null, "", root, v3);
Object v11 = graph.insertVertex(parent, "v11", "Child 1.1", 0, 0, 60, 40);
graph.insertEdge(parent, null, "", v1, v11);
Object v12 = graph.insertVertex(parent, "v12", "Child 1.2", 0, 0, 60, 40);
graph.insertEdge(parent, null, "", v1, v12);
Object v21 = graph.insertVertex(parent, "v21", "Child 2.1", 0, 0, 60, 40);
graph.insertEdge(parent, null, "", v2, v21);
Object v22 = graph.insertVertex(parent, "v22", "Child 2.2", 0, 0, 60, 40);
graph.insertEdge(parent, null, "", v2, v22);
Object v221 = graph.insertVertex(parent, "v221", "Child 2.2.1", 0, 0, 60, 40);
graph.insertEdge(parent, null, "", v22, v221);
Object v222 = graph.insertVertex(parent, "v222", "Child 2.2.2", 0, 0, 60, 40);
graph.insertEdge(parent, null, "", v22, v222);
Object v31 = graph.insertVertex(parent, "v31", "Child 3.1", 0, 0, 60, 40);
graph.insertEdge(parent, null, "", v3, v31);
layout.execute(parent);
}
finally
{
graph.getModel().endUpdate();
}
graph.addListener(mxEvent.FOLD_CELLS, new mxIEventListener() {
@Override
public void invoke(Object sender, mxEventObject evt) {
layout.execute(graph.getDefaultParent());
}
});
mxGraphComponent graphComponent = new mxGraphComponent(graph);
getContentPane().add(graphComponent);
}
public static void main(String[] args)
{
ChampsTree frame = new ChampsTree();
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setSize(400, 320);
frame.setVisible(true);
}
}
注意树在折叠时变得更紧凑(其余节点靠得更近)。这是因为在折叠发生后调用布局的处理程序。这降低了树的视觉复杂性,这很好,因为我的真实树会非常大。
关于java - 如何在 JGraphX 中创建具有可折叠节点的层次树,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47972193/
关于 B 树与 B+ 树,网上有一个比较经典的问题:为什么 MongoDb 使用 B 树,而 MySQL 索引使用 B+ 树? 但实际上 MongoDb 真的用的是 B 树吗?
如何将 R* Tree 实现为持久(基于磁盘)树?保存 R* 树索引或保存叶值的文件的体系结构是什么? 注意:此外,如何在这种持久性 R* 树中执行插入、更新和删除操作? 注意事项二:我已经实现了一个
目前,我正在努力用 Java 表示我用 SML 编写的 AST 树,这样我就可以随时用 Java 遍历它。 我想知道是否应该在 Java 中创建一个 Node 类,其中包含我想要表示的数据,以及一个数
我之前用过这个库http://www.cs.umd.edu/~mount/ANN/ .但是,它们不提供范围查询实现。我猜是否有一个 C++ 范围查询实现(圆形或矩形),用于查询二维数据。 谢谢。 最佳
在进一步分析为什么MySQL数据库索引选择使用B+树之前,我相信很多小伙伴对数据结构中的树还是有些许模糊的,因此我们由浅入深一步步探讨树的演进过程,在一步步引出B树以及为什么MySQL数据库索引选择
书接上回,今天和大家一起动手来自己实现树。 相信通过前面的章节学习,大家已经明白树是什么了,今天我们主要针对二叉树,分别使用顺序存储和链式存储来实现树。 01、数组实现 我们在上一节中说过,
书节上回,我们接着聊二叉树,N叉树,以及树的存储。 01、满二叉树 如果一个二叉树,除最后一层节点外,每一层的节点数都达到最大值,即每个节点都有两个子节点,同时所有叶子节点都在最后一层,则这个
树是一种非线性数据结构,是以分支关系定义的层次结构,因此形态上和自然界中的倒挂的树很像,而数据结构中树根向上树叶向下。 什么是树? 01、定义 树是由n(n>=0)个元素节点组成的
操作系统的那棵“树” 今天从一颗 开始,我们看看如何从小树苗长成一颗苍天大树。 运转CPU CPU运转起来很简单,就是不断的从内存取值执行。 CPU没有好好运转 IO是个耗费时间的活,如果CPU在取值
我想为海洋生物学类(class)制作一个简单的系统发育树作为教育示例。我有一个具有分类等级的物种列表: Group <- c("Benthos","Benthos","Benthos","Be
我从这段代码中删除节点时遇到问题,如果我插入数字 12 并尝试删除它,它不会删除它,我尝试调试,似乎当它尝试删除时,它出错了树的。但是,如果我尝试删除它已经插入主节点的节点,它将删除它,或者我插入数字
B+ 树的叶节点链接在一起。将 B+ 树的指针结构视为有向图,它不是循环的。但是忽略指针的方向并将其视为链接在一起的无向叶节点会在图中创建循环。 在 Haskell 中,如何将叶子构造为父内部节点的子
我在 GWT 中使用树控件。我有一个自定义小部件,我将其添加为 TreeItem: Tree testTree = new Tree(); testTree.addItem(myWidget); 我想
它有点像混合树/链表结构。这是我定义结构的方式 struct node { nodeP sibling; nodeP child; nodeP parent; char
我编写了使用队列遍历树的代码,但是下面的出队函数生成错误,head = p->next 是否有问题?我不明白为什么这部分是错误的。 void Levelorder(void) { node *tmp,
例如,我想解析以下数组: var array1 = ["a.b.c.d", "a.e.f.g", "a.h", "a.i.j", "a.b.k"] 进入: var json1 = { "nod
问题 -> 给定一棵二叉树和一个和,确定该树是否具有从根到叶的路径,使得沿路径的所有值相加等于给定的和。 我的解决方案 -> public class Solution { public bo
我有一个创建 java 树的任务,它包含三列:运动名称、运动类别中的运动计数和上次更新。类似的东西显示在下面的图像上: 如您所见,有 4 种运动:水上运动、球类运动、跳伞运动和舞蹈运动。当我展开 sk
我想在 H2 数据库中实现 B+ Tree,但我想知道,B+ Tree 功能在 H2 数据库中可用吗? 最佳答案 H2 已经使用了 B+ 树(PageBtree 类)。 关于mysql - H2数据库
假设我们有 5 个字符串数组: String[] array1 = {"hello", "i", "cat"}; String[] array2 = {"hello", "i", "am"}; Str
我是一名优秀的程序员,十分优秀!