更新到OpenLayers 3

我希望将我的应用程序从OpenLayers 2更新到OpenLayers 3

---

有人知道迁移指南（或类似的东西）会对此有所帮助吗？

OpenLayers3有一个新的设计和概念，并且建模不同，因此没有直接的翻译

我认为最好的选择是开始阅读现有的书籍，这样你就可以学习并评估自己：

• OpenLayers3（）的书籍，带有示例（）
• OpenLayers 3：初学者指南（）

---

考虑到OL3比OL2有许多改进，但并非OL2的所有功能都在OL3中实现。

FWIW-我们希望在将我们的简单页面从OL2迁移到OL3时有所贡献。问题看起来很难解决，但很多问题是ol3看起来比ol2好得多，示例看起来也有很大的改进，文档也有很大的改进，但它们是不同的，如果你最终习惯了ol2文档，它们会让人困惑

名称空间已更改，由于某些语义差异，某些API调用的顺序必须更改。下面是一个简单的一阶映射迁移。这个简单的练习花了大约一个小时，主要是因为上面提到的新文档混乱：

/*                                                                                         
  Very simple OpenLayers2 map                                                              
 */
var map, layer, center;

function init() {
    map = new OpenLayers.Map('map');
    layer = new OpenLayers.Layer.OSM("Simple OSM Map");
    map.addLayer(layer); // this must come before the following                            
    center = new OpenLayers.LonLat(-71.147, 42.472)
        .transform(
                   new OpenLayers.Projection("EPSG:4326"),
                   map.getProjectionObject()
                   );
    map.setCenter(center, 5);
}

---

顶层html在标记中有一些变化，包括一些包装器的变化（上面的内容在js/main.js文件中）：

>diff-btw../*[23]/index.html
7c7
<         
---
> 
11c11
<         
---
> 

代码库完全不同，很多都转移到了Google closure、事件处理程序等。据我所知，这被认为是一次突破性的升级，因此迁移几乎意味着重写。感谢@JohnBarça，我对新代码库与旧代码库的区别有着类似的感觉。我仍然希望有人能编一些指南来帮助升级……我们现在已经完成了从ol2到ol6的升级。该站点处于活动状态。使用Matt Walker的ol layerswitcher和我使用ol.Features模拟的ol2兴趣点示例。

/*                                                                                         
  Very simple OpenLayers3 map                                                              
 */                                                                                        
var map, layer, center;                                                                    

function init(){                                                                           
    map = new ol.Map({                                                                     
            target:'map',                                                                  
            renderer:'canvas',                                                             
            view: new ol.View({                                                            
                    projection: 'EPSG:900913',                                             
                })                                                                         
        });                                                                                
    layer = new ol.layer.Tile({                                                            
            source: new ol.source.OSM()                                                    
        });                                                                                
    map.addLayer(layer); // this can actually come up last                                 
    center = new ol.proj.transform([-71.147, 42.472],                                      
                                   'EPSG:4326', // essentially LonLat                      
                                   map.getView().getProjection());                         
    map.getView().setCenter(center);                                                       
    map.getView().setZoom(5);                                                              
}

> diff -btw ../*[23]/index.html
7c7
<         <script src='OpenLayers-2.13.1/OpenLayers.js'></script>
---
> <script src='v3.10.1/build/ol.js'></script>
11c11
<         <link rel='stylesheet' href='OpenLayers-2.13.1/theme/default/style.css'>
---
> <link rel='stylesheet' href='v3.10.1/css/ol.css'>