我刚开始使用JSXGraph。我有一些代码,当我开始移动它们时,板的内容会立即消失。这只发生在Firefox(47.0)上,而代码在Chrome和MSIE上正常运行。我使用的是Windows 7专业版,JSXGraph版本是0.99.4。
以下是演示此问题的最小示例。只需加载页面(在Firefox上)并移动点。我知道如果我摆脱桌面,我可以解决这个问题,但我认为HTML仍然有效。我想知道我做错了什么。
<!DOCTYPE html>
<html>
<head>
<meta charset="iso-8859-1">
<link rel="stylesheet" type="text/css" href="jsxgraph.css" />
<script type="text/javascript" src="jsxgraphcore.js" charset="utf-8"></script>
</head>
<body>
<table>
<tr>
<td><div id="box" class="jxgbox" style="width:180px; height:180px;"></div></td>
<td style="width:20%;"> </td>
<td><div class="jxgbox" style="width:360px; height:360px;"></div></td>
</tr>
</table>
<script type="text/javascript">
var board = JXG.JSXGraph.initBoard("box", {
boundingbox: [-10, 10, 10, -10],
grid: false,
axis: false
});
var ax = board.create('axis', [[0, 0], [1, 0]]);
ax.removeAllTicks();
var p1 = board.create("point", [3, 2]);
</script>
</body>
</html>
答案 0 :(得分:1)
这似乎是Firefox中的一个错误。如果
,JSXGraph板将正常工作valign=top
。如果JSGraph <div>
垂直浮动在它的表格单元格中,Firefox正在失去对SVG元素的控制 - 原因不明。一个简单的解决方法是使用canvas
作为渲染引擎而不是SVG。
var board = JXG.JSXGraph.initBoard("box", {
renderer: 'canvas',
boundingbox: [-10, 10, 10, -10],
grid: false,
axis: false
});