将新顶点拖放到mxGraph canavas
将新顶点拖放到mxGraph canvas是指在mxGraph图形编辑器中，通过拖拽操作将一个新的顶点（节点）添加到画布上。
mxGraph是一款基于JavaScript的图形编辑器库，用于创建和编辑图形化的网络图、流程图、组织结构图等。它提供了丰富的功能和交互性，可以通过拖放操作在画布上添加、移动、连接和编辑各种图形元素。
拖放新顶点到mxGraph canvas的步骤如下：
- 打开mxGraph图形编辑器，创建一个新的画布。
- 在工具栏或侧边栏中找到顶点（节点）的图标，通常表示为一个矩形或圆形。
- 使用鼠标点击并按住顶点图标，然后将其拖动到画布上的目标位置。
- 在释放鼠标按钮之前，可以调整顶点的位置和大小。
- 松开鼠标按钮后，新的顶点将被添加到画布上，并可以进行进一步的编辑和连接。
mxGraph的优势在于其强大的图形编辑和交互功能，以及丰富的扩展性和定制性。它可以广泛应用于各种领域，包括流程建模、网络拓扑图、组织结构图、UML图等。
腾讯云提供了一系列与图形编辑器相关的产品和服务，例如腾讯云白板、腾讯云文档等，可以满足用户在图形编辑和协作方面的需求。具体产品介绍和链接地址可以参考腾讯云官方网站的相关页面。
相关·内容
1回答
我正在定制jGraph附带的mxGraph java编辑器。当通过拖出一个边来“克隆”节点时，value对象会发生什么情况？新节点是否与父节点共享相同的值对象？如何覆盖任何默认行为？
浏览 1提问于2011-02-21得票数 1
回答已采纳
我正在使用javascript在mxGraph中创建一个工具栏。在工具栏中，我设置了一些图像，比如三角形，并将这些图像拖放到我的图形div区域。我要添加这样的图片
addVertex('rounded.gif', 100, 40, 'shape=rounded');
现在我想添加外部顶点图像，比如汽车，笔记本电脑。请有人建议我怎么做。而不是，shape=rounded，，我必须付出的。
浏览 11提问于2016-09-14得票数 1
回答已采纳
我们正在编写一个使用mxgraph生成图形的程序。我们的需求是“我们需要将图像显示为顶点”。我们已经尝试了许多代码，但我们无法获得图像。(图像的路径是正确的)我们可以改变节点的形状并添加颜色，但不能将图像作为顶点。我们的代码如下
Document xmlDocument = mxDomUtils.createDocument();
Element sourceNode = xmlDocument.createElement("Source");
Element targetNode = xmlDocument.createE
浏览 0提问于2014-03-14得票数 2
删除图中的一个顶点后，我想在与MxGraph中删除的顶点相连的两个相邻顶点之间创建一条边。例: A->B->C->D是一个图，在删除'C‘顶点后，我想要一个介于'B’和'D‘之间的边。图形将看起来像A->B->D。我可以像这样删除一个特定的单元格。
var keyHandler = new mxKeyHandler(graph);
keyHandler.bindKey(46, function(evt)
{
if (graph.isEnabled())
浏览 99提问于2020-02-26得票数 0
1回答
我的mxGraph需要有展开/折叠功能。
场景是这样的，有三个顶点，分别是v1、v2和v3。v2和v3链接到v1。现在在顶点v1中有一个小图标，当用户单击该图标时，顶点v2和v3应该隐藏在v1中，而当用户单击该图标时，顶点v2和v3应该是可见的。它类似于顶点v1的展开和折叠。
我尝试使用graph.foldCells()和graph.groupCells()。但是什么都不起作用。下面是我的代码。
import java.awt.BorderLayout;
import java.awt.Dimension;
import javax.swing.JFrame;
import javax.sw
浏览 3提问于2013-12-26得票数 2
2回答
我使用mxgraph来展示这个过程。我需要通过编程选择一条边。mxgraph提供了selectEdges(true，false，false)，它将选择图中的所有边。但我需要在图中选择特定的边。
假设有vertex1、vertex2和vertex3。这些顶点中的每一个都使用边连接。我需要选择vertex2和vertex3之间的边。mxgraph是否为dod so提供了任何api？请帮帮我。
浏览 8提问于2012-04-19得票数 0
回答已采纳
我正在用JGraphX构建一个图表。使用以下代码，与类似的图形实现(如JGraphT )相比，它需要非常长的时间来构建。为什么会这样呢？创建顶点的速度很快，但创建边的嵌套循环需要很长时间，特别是当数组大小为1000时。
Vertex[] verts = new Vertex[1000]; // My own vertex class
mxCell[] cells = new mxCell[1000]; // From com.mxGraph.model.mxCell
// Create graph
mxGraph mx = new mxGraph(); // from com.mxgraph
浏览 13提问于2013-05-25得票数 4
回答已采纳
1回答
在图中插入顶点
、、
我想在现有的图中添加一个新的顶点。因此，我创建了一个新的单元格，我试图重新连接我的边，但我的图表没有更新(对于边缘)
这是我的密码：
mxGraph graph = editor.getGraph();
mxCell selectedElt = (mxCell) graph.getSelectionCell();
Object cells[] = { selectedElt };
if (selectedElt.isEdge()) {
// cell is an edge, so we have source and target
System.out.printl
浏览 0提问于2015-11-03得票数 1
回答已采纳
有没有办法在mxGraph的矩形顶点内控制文本的高度？
我只想从矩形的底部隐藏额外的文本。
请看下面的截图，看看发生了什么。
浏览 3提问于2019-10-23得票数 0
回答已采纳
1回答
我已经使用.In my编辑器创建了一个自定义编辑器，用户应该能够创建一个acyclic graph。当用户will try to make a cycle in the graph时，会出现一个弹出窗口，通知用户应该在图中进行cycles are not permitted并进行回滚。
mxGraph对象具有属性multigraph (boolean)，该属性指定图形是否应该允许同一对顶点之间的多个连接，并且具有与我前面描述的类似的行为。
我已经在mxGraph对象的代码中搜索过任何类似的属性，声明该图应该是无圈的，但是到目前为止还没有发现任何东西。我也许可以实现我自己的自定义逻辑来使图形无循
浏览 0提问于2020-06-15得票数 0
在mxGraph-js中，我使用以下代码向顶点添加覆盖。
graph.addCellOverlay(cell, overlay);
将图形编码为xml，并使用
var graph = new mxGraph(container);
var xml = encoder.encode(graph.getModel());
然后使用下面的方法进行解码。
var doc = mxUtils.parseXml(xml);
var codec = new mxCodec(doc);
codec.decode(doc.documentElement, graph.getModel());
我的问题是，当解码
浏览 2提问于2017-02-18得票数 1
我已经在使用snapToPoint了，所以连接只能在顶点的约束上进行。但是，目前我可以将多条边连接到同一连接点。有没有一种内置的方法来允许每个连接点只有一个连接？ 如果没有，而且我还是个mxGraph新手，有没有什么建议可以把代码放在哪里，以便获得想要的行为，比如听mxEvent.CELL_CONNECTED或mxEvent.CONNECT_CELL？或者我必须重写/重用任何预定义的方法，如mxGraph.cellConnected
浏览 26提问于2019-09-24得票数 0
我正试图在mxGraph中的工具栏中添加一个边缘。顶点，跟我的例子一样，我可以做得很好。但我做不到，有人能帮我吗？我声明一种链接样式，但它不起作用。
var addVertex = function(icon, w, h, style)
{
var vertex = new mxCell(null, new mxGeometry(0, 0, w, h), style);
vertex.setVertex(true);
var img = addToo
浏览 4提问于2018-01-13得票数 0
5回答
我正在致力于角4，我想将mxGraph集成到我的项目中。我已经搜索了它，但我没有得到完整的工作例子。
我试过跟随，但它也不适用于我。
我所遵循的步骤：
已安装的mxgraph图：npm install mxgraph --save
for图的npm包：
已安装的mxgraph图-类型：npm install lgleim/mxgraph-typings --save
of图的Github Repo -
现在我已经将它导入到我的组件：import {mxgraph} from 'mxgraph';中
在.ange-cli.json资产数组中添加了以下一行，以使m
浏览 0提问于2018-04-19得票数 9
回答已采纳
我试图用特定的边缘样式绘制一个边缘，而不是默认的。问题是，我在一个单元格和一个点之间画了一个边，这样边看起来就好像是从一个单元格到一个空间一样。
edge = graph.insertEdge(parentCell, null, label, myCell,null);
我有例外：
"java.lang.ClassCastException: com.mxgraph.util.mxPoint cannot be cast to com.mxgraph.model.mxICell"
当我使用这个代码时：
mxGeometry geoCell = myCell.getGeometr
浏览 1提问于2013-12-04得票数 1
回答已采纳
我正在尝试使用angular js和mxgraph。
以下是我的代码
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.products = ["Milk", "Bread", "Cheese"];
$scope.main = function(container)
{
alert("hai");
浏览 0提问于2018-04-09得票数 0
嗨，我正在尝试拖放顶点从创建按钮到mxGraph的canavas。与draw.io中的相同。 我的TS是这样的： addShape(shape: string,event) {
event.stopPropagation();
const doc = (<any>window).mxUtils.createXmlDocument();
var node = doc.createElement("aaa");
node.setAttribute(AppSettings.SINGLE_LINE_DIAGRAM_ATTRIBUTES.LABEL, this.DEFAU
浏览 12提问于2020-03-29得票数 0
我是mxGraph领域的新手，我有几个问题。
1-可以在顶点中插入"div“吗？如果是，是如何实现的？
2-当我们在我们的图形上缩放时，我们可以绘制一个缩放的背景网格吗？目前，我只有一张网格的图片作为我的背景。
3-当我们在顶点中写文本时，我们如何根据文本长度改变框的大小？
感谢所有人的回复:)
浏览 23提问于2020-06-04得票数 0
我有一个mxGraph，就标签而言，它的顶点非常小，因为它从1，2，3开始。这些小于10的顶点的默认大小对于工具提示滚动来说太小了。如何设置顶点的最小大小，以便在最小的顶点上获得一些额外的宽度，并在鼠标翻转时触发工具提示？ ?
浏览 56提问于2020-01-02得票数 0
回答已采纳
我想执行一个操作，该操作与在mxGraph()中形成xmlString时所做的操作相反。
mxGraph graph = new mxGraph();
Object parent = graph.GetDefaultParent();
graph.Model.BeginUpdate();
try
{
Object v1 = graph.InsertVertex(parent, null, "Hello,", 20, 20, 80, 30);
Object v2 =
浏览 0提问于2015-12-09得票数 4
我有一个可编辑的表，您可以用按钮动态地添加行，但是我不能将可拖的东西放到新的行中，即使它们有可下垂的-Selektor。我试图为新行使用委托和droppable()修复它，但失败了。有什么建议或想法吗？
Here is my Code:
浏览 5提问于2013-10-22得票数 0
回答已采纳
1回答
使用jGraphx，我能够构建一个简单的图表来反映程序的结构。这个图将是只读的，也就是说，用户可以改变顶点的位置，但是没有其他的(BTW，我已经设置了可编辑的单元格和可连接的边为false，但是仍然可以绘制连接(?) )。
问题是，当用户单击顶点时，我希望能够显示上下文菜单。我怎么能这么做？我的代码大致如下：
mxGraph graph = new mxGraph();
graph.getModel().beginUpdate();
...
Object box = graph.insertVertex( parent, null, obj.getName(), pos, level, 60
浏览 2提问于2016-04-27得票数 1
回答已采纳
我有一个Draggable部分，其中元素打开了包含项目列表的popover (作为React )，我试图从popover中拖动子元素，并将其放到Droppable部分的外部。如何才能做到这一点？
我试过的是：
将列表项封装在Draggable内的弹出器中，以使项目可拖放，但它不允许拖放到门户之外
浏览 3提问于2022-08-31得票数 0
当我们将对象拖放到关系图画布中并将其拖放到图画布中时，id属性将被分配给该对象。id值是唯一的。mxgraph中的哪个Javascript函数调用单元格的分配id值？
浏览 4提问于2017-10-30得票数 0
回答已采纳
我正在尝试将MXGraph持久化到DB，并根据用户请求重新生成。下面是如何使用用户流：
为顶点创建HTML
图的加法顶点(v)
选择HTML元素(v.getElementById())
修改(V)顶点中的HTML
获取图的XML。下面是创建XML的代码Snippt im usig
var enc =新mxCodec(mxUtils.createXmlDocument())；var节点= enc.encode(_editor.graph.getModel())；var xml =mxUtils.getPrettyXml(节点)；
将其保存到DB
从上面，我
浏览 6提问于2014-09-21得票数 0
回答已采纳
情况
我有一个可视化使用。图形由另一个线程更新，与实例化的线程不同。
预期行为
图形应该由不同的工作线程更新。线程调用更新图形的函数是syncronized，因此工作线程不会导致它们之间的并发问题。
实际行为
在绘制时，在AWT线程中有一个异常(正常情况下)。有时是空指针，有时是超出界限的索引。下面是堆栈跟踪：
线程"AWT-EventQueue-0“中的异常(在com.mxgraph.shape.mxConnectorShape.translatePoint(Unknown源)在com.mxgraph.shape.mxConnectorShape.paintShape(Unknow
浏览 2提问于2011-07-14得票数 2
回答已采纳
我有一个使用mxgraph包的Vue JS组件：https://www.npmjs.com/package/mxgraph 并像这样导入它： import * as mxgraph from 'mxgraph';
const {
mxClient,
mxStackLayout,
mxGraph,
mxRubberband,
mxUtils,
mxFastOrganicLayout,
mxSwimlaneLayout,
mxEvent,
mxGraphModel,
mxConstants,
mxHierarchicalLayout,
浏览 60提问于2021-10-29得票数 0
2回答
我是mxGraph的新手。有人知道如何从mxGraph编辑器()将文件保存到本地存储区吗？顺便说一句，用draw.io创建的XML文件是否与mxGraph兼容？谢谢。
浏览 9提问于2017-11-16得票数 3
回答已采纳
在mxgraph中，必须将一个单元格拖到另一个单元格(其父单元格)上，但应限制其位置。特别是，我希望避免拖放到父级中的单元格彼此重叠。
我重写了isValidDropTarget()，并编写了自己的版本。这里我想检查droptarget，如果要丢弃的单元占用的区域是空闲的/没有被其他单元占用。
可以在父级中找到单元格的坐标和高度/宽度，但我需要知道要包含的单元格的坐标。具体地说，我希望获得拖动矩形的坐标
浏览 0提问于2019-05-31得票数 0
1回答
我是mxgraph的新手。我使用的是angular 4。在这里，托盘在一个组件中，图在另一个组件中。所以我需要把对象从一个托盘拖到另一个图中。但是对象不会被放到画布中。有人能帮我在angular 4中连接托盘和图表吗？
浏览 0提问于2017-10-18得票数 0
我试着在react项目中使用mxgraph。但我不能用use图来反应。
我安装了mxgraph图形：
npm install mxgraph
然后我写道：
import {
mxGraph,
mxGraphHandler,
mxGraphModel,
...
} from "mxgraph";
InitGraph =()={
let container = document.createElement("div");
this.setContainerStyle();
let model = new mxGr
浏览 1提问于2019-02-20得票数 3
我很难在文档中找到我需要的东西。我知道有常量，但似乎找不到一个可以做我想要的。
我希望创建mxGraph，这样您就不能断开边连接控制柄与顶点的连接。我不想让他们露面。另外，标签句柄，我希望删除。
我该怎么做呢？
function main(container) {
// Enables rotation handle
mxVertexHandler.prototype.rotationEnabled = false;
mxVertexHandler.prototype.guidesEnabled = false;
// Alt disables guides
浏览 0提问于2017-11-18得票数 1
嗨，如何在连接过程中获取mxgraph中的连接点名称
下面是我如何为所有人定义连接点：
mxShape.prototype.constraints = [
new mxConnectionConstraint(new mxPoint(0.5, 0), true,'top'),
new mxConnectionConstraint(new mxPoint(0.5, 1), true, 'bottom')
];
以下是mxConnectionConstraint：的文档
注：--我已经给出了点名为top，bottom
问题：只在连接时尝试将这两个单元格与
浏览 8提问于2022-10-04得票数 1
我正在尝试重新签署一个已经过期签名的java applet。
applet是，Dokuwiki的插件。
我遵循其他帖子的指示，用我自己的钥匙创建了一个密钥存储库，然后我打开了这些罐子，重新打包，用我自己的签名签名。
现在，这个插件安装得很好，但是当我运行它时，我会得到以下错误：
java.lang.NoClassDefFoundError: com/mxgraph/swing/util/mxSwingConstants
at com.hammurapi.jdraw.JDrawApplet.start(JDrawApplet.java:42)
at com.sun.deploy.
浏览 2提问于2014-08-20得票数 0
回答已采纳
我有一个简单的服务器-客户端架构。我想用javascript在客户端使用自定义xml创建mxgraph。下面是我的xml的结构：
<mycustomroot>
<!-- some not mxgraph related tags -->
<some-custom-tag>
......
</some-custom-tag>
<!-- this is standard mxgraph model-->
<mxGraphModel>
......
</mxGraphModel>
<!-- this
浏览 6提问于2017-01-26得票数 0
1回答
当将mxHierarchicalLayout与strokeWidth > 1边框一起使用时，所有最顶部和最左边的顶点都会被不正确地显示。见下面的截图：
这是因为边框宽度不算总顶点高度/宽度。
是否有可能为mxGraph设置盒大小模型，就像box-sizing: border-box;对CSS一样？
如果没有，是否有可能在布局引擎将整个图形上下文向下移动或向左移动？
浏览 2提问于2019-08-05得票数 0
回答已采纳
拒绝来自Nginx中特定路径的所有json文件的请求。 我们必须阻止所有的json文件，这些文件由/home/assests/js/提供。 location /home/assets/js/mxgraph/package1.json {
deny all;
}
location /home/assets/js/mxgraph/package2.json {
deny all;
}
location /home/assets/js/mxgraph/package3.json {
deny all;
}
location /home/assets/js/mxgrap
浏览 80提问于2021-04-28得票数 1
1回答
我正在使用安卓系统的COCOS2D。我想旋转一个矩形精灵并将其缩放到不同的高度，但它的两个顶点在一个固定的位置。我的意思是，在一个矩形的四个顶点中，我只想让两个顶点移动到不同的点，甚至将矩形缩放到不同的长度。类似的例子改变长度:温度计，其中矩形水银水平上升和下降固定在底部的两个顶点。
浏览 0提问于2012-04-09得票数 0
回答已采纳
1回答
我用raphael路径创建了一个多边形。多边形的顶点可以被拖动到拉伸以改变多边形的形状/大小。
测试正在运行
现在，我想要实现的是，如果我在边缘单击，它应该创建一个新的顶点。这样它就能起到拖点的作用。
有人能帮我找出路径中某个点的位置吗？
var p = r.path("M100,300L100,100L250,300z");
如果在200,250上发生鼠标事件，如何确定路径数组中的位置，新的point命令是否适合？
var p = r.path("M100,300L200,250L100,100L250,300z");
或
var p = r.path(
浏览 2提问于2013-08-21得票数 0
我正在使用JGraphX来绘制不同大小的工作流。我遇到了一个问题，一旦命中了一定数量的单元，mxCellRenderer方法createBufferedImage()就会失败，并返回一个OutOfMemoryError。无论是否正确保存，JGraphX都会在Swing JFrame中正确呈现图表。
是否有已知的变通方法或对类和/或方法的修改来支持大图像？
示例代码：
public void generatePNG() throws IOException {
BufferedImage image = mxCellRenderer.createBufferedImage(graph,
浏览 21提问于2017-07-11得票数 0
2回答
我正在为我的可下垂的div使用tolerance: "fit"，它工作得很好。只有当可拖的对象符合可下垂的div时，它才会下降。
$('#drag').draggable({ revert: "invalid"});
$('#drop').droppable({ tolerance: "fit" });
我想要的是，如果用户删除不适合下拉式的可拖式div，我想提醒您一条消息，上面写着“请将对象放到容器中”。知道怎么做吗？这件事我什么也没发现。
浏览 2提问于2016-02-10得票数 1
2回答
我有一些使用JAXB注释映射的实体可以将它们转换为xml，但是在这些实体mxCell中有一个对象，我如何在代码库中添加注释来映射这个对象呢？
这是我的奥贝托班：
@XmlRootElement
@XmlAccessorType(XmlAccessType.NONE)
@XmlSeeAlso({mxCell.class})
public abstract class ObjetoImpl implements Serializable, Objeto {
@XmlAttribute
protected String nome;
@XmlAnyElement
浏览 0提问于2013-09-01得票数 2
回答已采纳
我是MXGraph用法的新手(通过javascript)，我正在尝试从工具栏拖放一个图像(png)。
从toolbar.html示例开始，我可以在工具栏中添加新图标，但不知道如何在图形中添加自定义图像。有人能告诉我怎么做吗？
浏览 5提问于2018-12-18得票数 0
我需要一个组织结构图树，我希望能够在任何级别上折叠和扩展节点。我对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.layo
浏览 9提问于2017-12-25得票数 3
回答已采纳
我不能拖这个div，一旦它被放到可下垂的绑定div中。
我有一个多行，这些行设置为可下垂，其中插入了textbox、复选框等控件。每个控件都用可拖动的div包装。
当一个列被拖放到可下垂的绑定div中时，这是第一次，它工作得很好，然后就停止了拖放。在删除div之后，我尝试重新初始化draggable，但它也不起作用。
下面是我如何为每个列实现，在每个列之后，这些列被附加在一个容器中以呈现：
function buildRow()
{
var formRow = $("div").attr('id', 'mainform')
浏览 2提问于2016-10-07得票数 0
回答已采纳
1回答
在导航栏上放置条形按钮时发出
、、、、
我想要
在导航栏的右上角添加一个bar按钮。
我拖
然后把UI库中的bar按钮放到我的导航栏中。它把我的酒吧按钮放在视图的底部。
我怎样才能防止这种情况再次发生呢？
浏览 1提问于2018-10-31得票数 0
回答已采纳
1回答
剧作家-拖放带偏移量
、、、
我们有一个使用剧作家webdriver的CodeceptJS自动化框架，测试中的应用程序在类型记录中。是否有方法将元素拖放到页面上的特定位置？我希望能够通过某个像素水平或垂直地拖放。当前的dragAnddrop()剧作家方法将拖放元素带回到它原来的位置，因为我不能拖它足够长的时间将它拖到占位符中。类似硒的拖曳物(dragFrom，dragTo，offsetX)；
谢谢
浏览 5提问于2020-09-15得票数 0
1回答
如何从mxgraph中现有的XML模型开始。我有一个默认的 XML图，我想在mxgraph加载上导入它(开始)
浏览 1提问于2019-02-22得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
