ASP.NET页面，加载谷歌图表和threejs有时不起作用
我正在编写一个ASP.NET页面，它加载3个数据数组（X，Y，Z轴）并在3D动画和2D折线图中显示它们。
为此，我使用ThreeJS和Google Chart。
我的页面从父页面打开为IFrame。 Chrome上每次都能正常运行。 在IE和Firefox中，第一次运行良好但如果我关闭然后重新打开IFrame，我的页面未正确加载：DIV没有以正确的方式定位并且3D动画被渲染但不旋转。
我放置了一个“重置按钮”，以测试问题是否在代码中或在加载过程中发生了什么。
我的“重置按钮”有效！ 事实上，点击后，一切都在怀特的地方，动画旋转。
我搜索了很多，我在document.ready（）和google.load函数之间看到了一些“冲突”或类似内容……我几乎尝试过任何东西，但仍然没有工作……
这里有一些代码可以更好地解释
[...] google.load("visualization", "1", { packages: ["corechart"] }); [...] $(document).ready(function () { //here I initialize my 3D object resetPositions(); }); function resetPositions() { $('#graph2DLineChart').css('position', 'absolute'); $('#graph2DLineChart').css('top', '253px'); $('#graph2DLineChart').css('left', '652px'); $('#graph2DLineChart').css('background-color', '#ffffff'); $('#graph2DLineChart').css('color', '#000000'); $('#graph2DLineChart').css('width', '280px'); $('#graph2DLineChart').css('height', '300px'); $('#graph2DLineChart').css('z-index', '50'); $('#graph3DContainer').css('position', 'relative'); $('#graph3DContainer').css('top', '0px'); $('#graph3DContainer').css('left', '0px'); $('#graph3DContainer').css('background-color', '#333F47'); $('#graph3DContainer').css('color', '#ffffff'); $('#graph3DContainer').css('width', '906px'); $('#graph3DContainer').css('height', '670px'); $('#graph3DContainer').css('z-index', '1'); WIDTH = 906; HEIGHT = 670; camera.aspect = WIDTH / HEIGHT; camera.updateProjectionMatrix(); renderer.setSize(WIDTH, HEIGHT); controls.handleResize(); drawChart(); } [...] [...] 至少，我也试过这个文件。已经解决方案：
$(document).ready(function () { //here I initialize my 3D object setTimeout(function () { resetPositions(); }, 1000); });
这个解决方案每次都有效!!!! 但我真的很讨厌它…请有不同的方法来确保一个页面将被完全加载???
非常感谢！
好吧，我已经改变了我的观点…答案是在setTimeout（fn，500）的作用。
正如本文所述： 为什么setTimeout（fn，0）有时会有用？
setTimeout向浏览器事件队列添加一个新事件，并且渲染引擎已经在该队列中（不完全正确，但足够接近），因此它在setTimeout事件之前执行。 – David Mulder 12年4月4日14:30
所以，我用这种方式改变了我的代码：
$(document).ready(function () { //here I initialize my 3D object setTimeout(function () { resetPositions(); }, 0); });
没有改变… ：（
我有点疯了……
文档就绪可能在加载Visualization API之前触发，因此当您尝试绘制图表时，它会因为未加载API而失败。 您应该摆脱文档就绪事件处理程序并将resetPositions函数移动到谷歌加载器回调：
google.load("visualization", "1", { packages: ["corechart"], callback: resetPositions });