更新到OpenLayers 3

Question

我想将我的应用程序从OpenLayers 2更新到OpenLayers 3.

是否有人知道有助于此的迁移指南(或类似的东西)？

Answer 1

FWIW-我们希望为我们的http://www.nufosmatic.com上简单的页面从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);
}

/*                                                                                         
  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);                                                              
}

顶层html通过一些包装更改（其中上面是js / main.js文件中的内容）对标记进行了一些更改：

> 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'>

Answer 2

OpenLayers3有新的设计和概念并且建模不同，所以没有直接翻译。

我认为最好的选择是开始阅读当前可用的书籍，这样您就可以学习它并评估自己：

• OpenLayers3 的书 ( https://leanpub.com/thebookofopenlayers3 )，带有示例 ( http://acanimal.github.io/thebookofopenlayers3/ )。
• OpenLayers 3：初学者指南 ( https://www.packtpub.com/web-development/openlayers-3-beginner%E2%80%99s-guide )

考虑到OL3比OL2有很多改进，但OL3还没有实现OL2的所有功能。