mxGraph 显示网格,但不显示图像
mxGraph shows grid, but does not show images
我正在使用 mxGraph 在网页中开发可绘制区域。
这是遗留代码,我正在尝试理解它,因为该区域除了网格外没有显示任何图像。
这是我的javascript代码来显示一个简单的图表
//define a window to show the image and put a grid as background
container.style.background = 'url("js/src/images/grid.gif")';
//some other definitions here
var model = new mxGraphModel();
var graph = new mxGraph(container, model);
var id = _GET("id");
mxUtils.post("../Diagram",
"action=get&id="+id,
function(req)
{
var node = req.getDocumentElement();
var dec = new mxCodec(node.ownerDocument);
dec.decode(node, graph.getModel());
},
function(error){
console.log("Error in the design area");
console.log(error);
});
../Diagram
是一个 servlet Java,您可以在下面看到:
try {
BufferedReader buffRead = new BufferedReader(new FileReader("/home/glassfish/mySite/Repository/"+getId()+"/"+getName()+".txt"));
String line = "";
while (true) {
if (line != null) {
file = line;
} else {
break;
}
line = buffRead.readLine();
}
buffRead.close();
} catch(Exception e) {
System.out.println("File not found");
}
return file;
返回的XML(文件)如下:
<root>
<mxCell id="0"/>
<mxCell id="1" parent="0"/>
<mxCell id="2" parent="1" style="shape=ellipse;fillColor=#33CCFF" value="Objective" vertex="1">
<mxGeometry as="geometry" height="40" width="100" x="262" y="90"/>
</mxCell>
</root>
然而,屏幕上的结果总是只有网格
当我调试行 dec.decode(node, graph.getModel());
以查看 node
值时,我得到一个 XML 对象,其中包含 Java.
返回的信息
在 Chrome 中,我没有在控制台中收到任何消息,但是当我在 Firefox 中测试它时,我收到一条警告,说我有一个 "XML parsing error in the file graph.properties",但这个文件不是XML(其实我也不知道这个文件是什么)。我也在这里粘贴文件
graph.properties
alreadyConnected=Nodes already connected
containsValidationErrors=Contains validation errors
updatingDocument=Updating Document. Please wait...
updatingSelection=Updating Selection. Please wait...
collapse-expand=Collapse/Expand
doubleClickOrientation=Doubleclick to change orientation
close=Close
error=Error
done=Done
cancel=Cancel
ok=OK
更新
我的问题还是没有解决,但是我得到了新的证据。
当我调试 dec.decode(node, graph.getModel());
行时,我有两个 dec
变量的属性。一个 XML 文档和一个空数组。我认为问题可能出在编码部分,但我没有在 page about mxCodec.
中找到任何提示
我终于找到了解决问题的方法。
错误在Javascript部分,不知道为什么控制台没有显示任何问题。不管怎样,用下面的代码替换原来的成功函数就解决了问题。
function(req)
{
var doc = req.getDocumentElement();
var codec = new mxCodec(doc);
var elt = doc.firstChild;
var cells = [];
while (elt != null)
{
cells.push(codec.decode(elt));
elt = elt.nextSibling;
}
graph.addCells(cells);
}
我正在使用 mxGraph 在网页中开发可绘制区域。
这是遗留代码,我正在尝试理解它,因为该区域除了网格外没有显示任何图像。
这是我的javascript代码来显示一个简单的图表
//define a window to show the image and put a grid as background
container.style.background = 'url("js/src/images/grid.gif")';
//some other definitions here
var model = new mxGraphModel();
var graph = new mxGraph(container, model);
var id = _GET("id");
mxUtils.post("../Diagram",
"action=get&id="+id,
function(req)
{
var node = req.getDocumentElement();
var dec = new mxCodec(node.ownerDocument);
dec.decode(node, graph.getModel());
},
function(error){
console.log("Error in the design area");
console.log(error);
});
../Diagram
是一个 servlet Java,您可以在下面看到:
try {
BufferedReader buffRead = new BufferedReader(new FileReader("/home/glassfish/mySite/Repository/"+getId()+"/"+getName()+".txt"));
String line = "";
while (true) {
if (line != null) {
file = line;
} else {
break;
}
line = buffRead.readLine();
}
buffRead.close();
} catch(Exception e) {
System.out.println("File not found");
}
return file;
返回的XML(文件)如下:
<root>
<mxCell id="0"/>
<mxCell id="1" parent="0"/>
<mxCell id="2" parent="1" style="shape=ellipse;fillColor=#33CCFF" value="Objective" vertex="1">
<mxGeometry as="geometry" height="40" width="100" x="262" y="90"/>
</mxCell>
</root>
然而,屏幕上的结果总是只有网格
当我调试行 dec.decode(node, graph.getModel());
以查看 node
值时,我得到一个 XML 对象,其中包含 Java.
在 Chrome 中,我没有在控制台中收到任何消息,但是当我在 Firefox 中测试它时,我收到一条警告,说我有一个 "XML parsing error in the file graph.properties",但这个文件不是XML(其实我也不知道这个文件是什么)。我也在这里粘贴文件
graph.properties
alreadyConnected=Nodes already connected
containsValidationErrors=Contains validation errors
updatingDocument=Updating Document. Please wait...
updatingSelection=Updating Selection. Please wait...
collapse-expand=Collapse/Expand
doubleClickOrientation=Doubleclick to change orientation
close=Close
error=Error
done=Done
cancel=Cancel
ok=OK
更新
我的问题还是没有解决,但是我得到了新的证据。
当我调试 dec.decode(node, graph.getModel());
行时,我有两个 dec
变量的属性。一个 XML 文档和一个空数组。我认为问题可能出在编码部分,但我没有在 page about mxCodec.
我终于找到了解决问题的方法。
错误在Javascript部分,不知道为什么控制台没有显示任何问题。不管怎样,用下面的代码替换原来的成功函数就解决了问题。
function(req)
{
var doc = req.getDocumentElement();
var codec = new mxCodec(doc);
var elt = doc.firstChild;
var cells = [];
while (elt != null)
{
cells.push(codec.decode(elt));
elt = elt.nextSibling;
}
graph.addCells(cells);
}