【问题标题】:OpenLayers: Does not work in internet explorerOpenLayers:在 Internet Explorer 中不起作用
【发布时间】:2015-12-17 22:39:15
【问题描述】:

我有这个简单的代码:

<HTML>
<head>
<title>Vector Icon Example</title>
<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
<link rel="stylesheet" href="../apidoc/styles/bootstrap.min.css">
<script src="../apidoc/scripts/bootstrap.min.js"></script>
    <link rel="stylesheet" href="../css/ol.css" type="text/css">
<script src="../build/ol.js"></script>


</head>
<BODY>
<div id="map" style="width: 100%, height: 400px">ggg</div>
<script>
  new ol.Map({
    layers: [
      new ol.layer.Tile({source: new ol.source.OSM()})
    ],
    view: new ol.View({
      center: [0, 0],
      zoom: 2
    }),
    target: 'map'
  });
</script>
</BODY>
</HTML>

它在 chrome 中正常工作,但在 IE 11 中没有任何显示。问题出在哪里?

【问题讨论】:

标签: internet-explorer-11 openlayers openstreetmap x-ua-compatible


【解决方案1】:

这解决了我的问题:

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

【讨论】:

    【解决方案2】:
    new OpenLayers.Layer.OSM()
    

    在 IE11 上也不适用于我。

    我尝试使用 https 方案,因为对于 openstreetmap 磁贴从 http 重定向到 https 进行了更改:

    new OpenLayers.Layer.OSM({
                name: "OpenStreetMap",
                url: ["https://a.tile.openstreetmap.org/${z}/${x}/${y}.png",
                    "https://b.tile.openstreetmap.org/${z}/${x}/${y}.png",
                    "https://c.tile.openstreetmap.org/${z}/${x}/${y}.png"],
                tileOptions: {crossOriginKeyword: null},
                crossOrigin: null
            });
    

    在 IE11 中仍然没有从我的本地渲染。还提供元标记无济于事...

    另一个工作正常(但我需要 X.tile.openstreetmap.org 进行渲染):

     new OpenLayers.Layer.OSM("OpenCycleMap",
                       ["http://a.tile.opencyclemap.org/cycle/${z}/${x}/${y}.png",
                        "http://b.tile.opencyclemap.org/cycle/${z}/${x}/${y}.png",
                "http://c.tile.opencyclemap.org/cycle/${z}/${x}/${y}.png"]);
    

    【讨论】:

      【解决方案3】:

      这对我有用:

      new OpenLayers.Layer.OSM("OpenStreetMap", ["https://a.tile.openstreetmap.org/${z}/${x}/${y}.png", "https://b.tile.openstreetmap.org/${z}/${x}/${y}.png", "https://c.tile.openstreetmap.org/${z}/${x}/${y}.png"]);

      【讨论】:

        猜你喜欢
        • 2015-03-22
        • 2013-12-14
        • 2012-06-07
        • 2015-03-16
        • 2012-05-06
        • 2011-06-02
        • 2013-04-30
        • 2013-09-25
        • 1970-01-01
        相关资源
        最近更新 更多