我正在尝试将 Chart.js 图表 ( http://www.chartjs.org ) 集成到当前的 GWT 项目中。我的项目可以识别 javaScript，但是当我尝试实例化图表时，我的浏览器会抛出以下 JavaScript 错误:
Unable to get property 'insertBefore' of undefined or null reference
使用以下 GWT 代码片段似乎是问题的根源:
Public class PieChart implements IsWidget
{
Canvas c;
public JavaScriptObject jsChart;
public PieChart()
{
c = Canvas.createIfSupported();
if (c.getContext2d().getCanvas().getParentNode() == null)
{
//Debug message here
}
jsChart = init(c.getContext2d());
}
private native JavaScriptObject init(Context2d ctx)
/*-{
var data = [];
return new $wnd.Chart(ctx).Pie(data); //<-- *Explodes here*
}-*/;
@Override
public Widget asWidget() { return c; }
}
此 PieChart 类的实例是在客户端创建期间创建并添加到 VerticalPanel 中的。
空调试检查条件表明，parentNode 确实为空，并且深入研究 JavaScript 发现在创建 Chart 对象期间对“parentNode.insertBefore”的调用 - 因此自然会失败。
Canvas c 的空检查显示了一个有效的对象，但没有parentNode，所以在我看来，要么我的 html 文档有问题，使得 Canvas 是最顶层的对象，要么我的项目整体存在配置问题，导致对 Canvas 创建方法的调用返回一个构造不良的实例。
有没有办法人为地将我创建的 Canvas 埋下一层，这样父节点就不会为空(或类似的东西)？或者我在某个地方错过了一个步骤？
这是我的页面的 HTML:
<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link type="text/css" rel="sytlesheet" href="viewer.css">
<title>Viewer</title>
<script type="text/javascript" language="javascript" src="viewer/moment.js"></script>
<script type="text/javascript" language="javascript" src="viewer/Chart.js"></script>
<script type="text/javascript" language="javascript" src="viewer/viewer.nocache.js"></script>
</head>
<body>
<noscript>
...
</noscript>
</body>
</html>
该项目无法托管在公共(public)互联网上，因此需要像 Chart.js 这样的离线解决方案
我也愿意接受与 GWT 配合良好的替代离线图表包。但是，替代方案必须获得开源许可或以其他方式在全局范围内自由商业分发，以符合 ITAR 导出合规性。
谢谢大家!
最佳答案
private native JavaScriptObject init(Context2d ctx)
/*-{
var data = [];
return $wnd.Chart(e).Pie(data); //<-- *Explodes here*
}-*/;
什么是e？当您将其传递给图表时，是否允许此时未定义？
快速浏览一下链接的项目，您应该使用 new 创建该 Chart，并且应该将 Canvas Context2d 实例 ctx 传递到其中，而不是这个未知的 e。
由于 Canvas 的工作方式，如果您的 Canvas 未附加到 dom，并且您的 PieChart 构造函数在调用 init 之前未附加它，则很可能无法正常运行。如果这是一个要求，您可能不需要调用 init，直到小部件的 Attach 事件发生或调用 onAttach 为止，但您应该了解有关如何包装此项目的更多信息。
有 GWT 兼容的图表库，包括 Lienzo、GXT 和 Highcharts。坦白说，我与 Sencha 一起构建 GXT 已有好几年了，因此对那里有明显的偏好。
关于javascript - GWT Chart.js 实现抛出 'unable to get property ' insertBefore' 未定义或空引用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33511024/