Question

我在Iframe中显示了一个Openlayers 2.11地图。它在IE和Firefox中运行良好。在Chrome中，图层未对齐。使用Openlayers示例可以轻松地重现这一点。创建一个这样的aspx页面（如下）。加载后，通过拖动平移地图。它在IE和Firefox中的表现与预期的一样。在Chrome中，图层会独立移动。无论我是否在图层上设置了sphereMercator = true（我在本地都有示例），都会发生这种情况。如果示例不在iframe中，那么它可以正常工作。重要的是我可以在iframe中运行地图。

任何建议表示赞赏。

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">

    <div style="float:right;width:800px;height:600px">
        <iframe runat="server" frameborder="0" src="http://openlayers.org/dev/examples/vector-features.html" width="100%" height="100%"></iframe>
    </div>
    </form>
</body>
</html>

Answer 1

问题在这里描述：

http://code.google.com/p/ala-citizenscience/issues/detail?id=6

解决方案是拥有自己的OpenLayers版本并进行一些小的更改（需要jQuery）：搜索：

renderers:['SVG','VML','Canvas']

并将其更改为：

renderers:(jQuery.browser.webkit?['Canvas','VML']:['SVG','Canvas','VML'])

（如果OpenLayer的代码被最小化，这是包含多条指令的长行的一部分）

如果你使用OpenLayers图像和样式而你想保留它们，你也应该改变：

如果是OpenLayers 2.11：

return(function(){return l;})

与

return(function(){return "http://www.openlayers.org/api/";})

如果是OpenLayers 2.10：

var scriptLocation;

与

var scriptLocation = "http://www.openlayers.org/api/";

Openlayers与Chrome中的iframe中显示的地图对齐

1 个答案: