- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我在调整单元格大小和内置 mxGraph 布局时遇到问题。如果我将一个单元格放在 Canvas 上,然后尝试调整它的大小,即使是一个像素,它也会变得很大,大约 50000px x 30000px,因此它会拉伸(stretch)我的整个 Canvas ,当然它无法使用。如果我从数据库的 xml 文件加载图表,我可以毫无问题地调整单元格大小。
内置布局也会发生类似的情况。我想使用紧凑的树布局(我喜欢它的原因是因为它与我的整个水平对齐)。当我绘制图表并尝试使用该布局时,我的图表变得疯狂,也拉伸(stretch)到 50000 像素 x 30000 像素(示例尺寸,但滚动很小,我几乎无法用鼠标瞄准它)。如果我从数据库中的 xml 加载图表,紧凑的树形布局效果非常好。但是,一旦我在其中添加另一个单元格,并尝试再次使用紧凑的树布局,它就会再次变得疯狂。
我对容纳 Canvas 的 div 使用绝对定位,与此处的示例相同 ( http://jgraph.github.io/mxgraph/javascript/examples/editors/workfloweditor.html )
这是我的 css 和 html :
<head>
<style type="text/css">
#graphContainer {
background: url('../../resources/jgraph/src/images/grid.gif');
left: 20px;
right: 20px;
top: 65px;
bottom: 20px;
position: absolute;
border: 1px solid #F2F2F2;
white-space: nowrap;
font-family: Arial;
font-size: 8pt;
display: block;
}
</style>
</head>
<body>
<div id="graphContainer"></div>
<script>
$(document).ready(function(){
mc.init(document.getElementById('graphContainer'));
});
</script>
</body>
</html>
这是我用于图形初始化的 javascript(以及几个事件,因为我不确定它们是否是问题所在):
mxConnectionHandler.prototype.connectImage = new mxImage('../../resources/jgraph/src/images/connector.gif', 14, 14);
if (!mxClient.isBrowserSupported()) {
mxUtils.error('Browser is not supported!', 200, false);
} else {
var root = new mxCell();
root.insert(new mxCell());
var model = new mxGraphModel(root);
if (mxClient.IS_QUIRKS)
{
document.body.style.overflow = 'hidden';
new mxDivResizer(graphContainer);
}
var editor = new mxEditor();
editor.setGraphContainer(graphContainer);
editor.readGraphModel(model);
var graph = editor.graph;
graph.setConnectable(true);
new mxRubberband(graph);
/* CODE FOR ADDING THE TOOLBAR, excluded from example */
//code for writing out the node name
graph.convertValueToString = function(cell)
{
if (mxUtils.isNode(cell.value))
{
var outValue = cell.value.getAttribute('nodeName');
if (outValue != null && outValue.length > 0)
{
return outValue;
}
return '';
}
return '';
};
//defining on select event
graph.getSelectionModel().addListener(mxEvent.CHANGE, function(sender, evt)
{
events.cellSelectionChanged(graph, graph.getSelectionCell());
});
//triggering the on select event
events.cellSelectionChanged(graph);
//cells added event
graph.addListener(mxEvent.CELLS_ADDED, function(sender, evt) {
var vertex = evt.getProperties().cells[0];
if(vertex.isVertex()){
var decoder = new mxCodec();
var nodeModel = decoder.decode(vertex.value);
if(nodeModel.type=='node' || nodeModel.type=='branch'){
utils.changeCellAttribute(vertex, 'nodeName', 'Node_' + vertex.id);
}else if(nodeModel.type=='start'){
utils.changeCellAttribute(vertex, 'nodeName', 'START');
}else if(nodeModel.type=='end'){
utils.changeCellAttribute(vertex, 'nodeName', 'END');
}else if(nodeModel.type=='form'){
utils.changeCellAttribute(vertex, 'nodeName', 'Form');
}
}
});
//on connect event
graph.connectionHandler.addListener(mxEvent.CONNECT, function(sender, evt){
var model = graph.getModel();
var edge = evt.getProperty('cell');
var source = model.getTerminal(edge, true);
var target = model.getTerminal(edge, false);
});
}
有什么想法可能是什么问题吗?
最佳答案
解决方案:
从数据库加载完整的图形和单元格配置(在本示例中),包括单元格的宽度和高度。
问题是为某些单元格类型添加工具栏项目,更精确的是,删除单元格默认宽度和高度。正如我所说,我们正在从数据库加载配置,它完全是字符串化的,宽度和高度也是如此。
它们都必须转换为 JavaScript Number 对象才能调整大小和布局才能正常运行。
关于mxGraph 单元格大小调整和图形布局,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16084381/
我已经尝试在我的 CSS 中添加一个元素来删除每三个 div 的 margin-right。不过,似乎只是出于某种原因影响了第 3 次和第 7 次。需要它在第 3、6、9 等日工作... CSS .s
如何使 div/input 闪烁或“脉冲”?例如,假设表单字段输入了无效值? 最佳答案 使用 CSS3 类似 on this page ,您可以将脉冲效果添加到名为 error 的类中: @-webk
我目前正在尝试构建一个简单的 wireframe来自 lattice 的情节包,但由沿 y 轴的数百个点组成。这导致绘图被线框网格淹没,您看到的只是一个黑色块。我知道我可以用 col=FALSE 完全
在知道 parent>div CSS 选择器在 IE 中无法识别后,我重新编码我的 CSS 样式,例如: div#bodyMain div#paneLeft>div{/*styles here*/}
我有两个 div,一个在另一个里面。当我将鼠标悬停 到最外面的那个时,我想改变它的颜色,没问题。但是,当我将鼠标悬停 到内部时,我只想更改它的颜色。这可能吗?换句话说,当 将鼠标悬停到内部 div 上
我需要展示这样的东西 有人可以帮忙吗?我可以实现以下输出 我正在使用以下代码:: GridView.builder( scrollDirection: Axis.vertical,
当 Bottom Sheet 像 Android 键盘一样打开时,是否有任何方法可以手动上推布局( ScrollView 或回收器 View 或整个 Activity )?或者你可以说我想以 Bott
我有以下代码,用于使用纯 HTML 和 CSS 显示翻转。当您将鼠标悬停在文本上时,它会更改左右图像。 在我测试的所有浏览器中都运行良好,Safari 4 除外。据我收集的信息,Safari 4 支持
我构建了某种 CMS,但在使用 TinyMCE 和 Bootstrap 时遇到了一些问题。 我有一个页面,其中概述了一个 div,如果用户单击该 div,他们可以从模态中选择图像。该图像被插入到一个
出于某种原因,当我设置一个过渡时,当我的鼠标悬停在一个元素上时,背景会改变颜色,它只适用于一个元素,但它们都共享同一个类?任何帮助我的 CSS .outer_ad { position:rel
好吧,这真的很愚蠢。我不知道 Android Studio 中的调试监视框架发生了什么。我有 1.5.1 的工作室。 是否有一些来自 intellij 的 secret 知识来展示它。 最佳答案 与以
我有这个标记: some code > 我正在尝试获取此布局: 注意:上一个和下一个按钮靠近#player 我正在尝试这样: .nextBtn{
网站:http://avuedesigns.com/index 首页有 6 个菜单项。我希望每件元素在您经过时都有自己的颜色。 这是当您将鼠标悬停在 div 上时将所有内容更改为白色的行 li#hom
我需要在 index.php 文件中显示它,但没有任何效果。我所有的文章都没有正确定位。我将其用作代码: 最佳答案 您可以首先检查您
我是一名优秀的程序员,十分优秀!