OpenLayers 3 を使ってみよう（番外3：OpenLayers ver. 3.0.0 と 3.7.0 の違いについて）

OpenLayers 3 を使ってみよう（その0：はじめに：地理院地図を表示）に目次がある。

---

　ここでは OpenLayers 3.0.0 と OpenLayers 3.7.0 の違いについて述べようと思う。
2014年9月に OpenLayers 3 を使ってみよう（その0：はじめに：地理院地図を表示）として，OpenLayers ver.3.0.0 について一連の投稿を書いた。 その時点では，ver 2.13.1 からのメジャーアップデートがなされた後で，v3 となったことで v2.13.1 とかなり違っていた。 それがしばらく気にしないでいたら，いつの間にか v3.7.0 に上がっていた。 v3.7.0 でも v3.0.0 の時に書いたコードがそのまま使えるか，と思っていたら， いくつか変更がなされてそのままでは動かなくなっていた。 そこで，今回の投稿を書いている。
（ちなみに，OpenLayers 3 を使ってみよう（その0：はじめに：地理院地図を表示）から始まる一連のページは v3.7.0 用に徐々に変更しておこうと思う。）

---

v3.0.0 から v3.7.0 までの間に，いくつかの大きな変更がなされている。 それらに関しては各バージョンのリリースノート (https://github.com/openlayers/ol3/releases/tag/v3.5.0 や https://github.com/openlayers/ol3/releases/tag/v3.7.0 など) を見ると変更点が書かれている。 あるいは https://github.com/openlayers/ol3/releases/ に行けば，OpenLayers v3 の alpha バージョンからの全てのバージョンのリリースノートを見ることができる。そのリリースノートから，OpenLayers 3 を使ってみよう（その0：はじめに：地理院地図を表示）から始まる一連のページで使ったいた Function 等の変更点について書いていこう。

(1) ol.source.KML の廃止
　まず，最初は v3.5.0 がリリースされた際に行われた変更のうちの一つについて書こう。 これは https://github.com/openlayers/ol3/releases/tag/v3.5.0 に記載がある。
　内容としては，いくつかの vector class が廃止された，というものである。 私のサイトに関連するものとしては，ol.source.KML が廃止されてコードに変更が必要になった。 他には，ol.source.GeoJSON，ol.source.GML，ol.source.GPX，ol.source.IGC，ol.source.OSMXML，ol.source.TopoJSON が廃止になった。 これらの代わりに ol.source.Vector と ol.format を使え，ということだった。

　例えば，ol.source.KML の場合について見てみると， v3.4.0 以前に以下のようにしていた場合は，

var source = new ol.source.KML({
  url: 'features.kml',
  extractStyles: false,
  projection: 'EPSG:3857'
});

下記のように ol.format を使うように指示されている。

var source = new ol.source.Vector({
  url: 'features.kml',
  format: new ol.format.KML({
    extractStyles: false
  })
});

　つまり，ol.source.KML という KML ファイル専用の Vector class の代わりに，より一般的な ol.source.Vector を使い， その中で ol.format.KML を使って KML ファイルということを指定せよ，ということだった。 ソースコードの書き換えは，vector class 同士の変更になるので，定義を変更するぐらいで，関数など他の部分はほぼ変更は必要ない（はず）。

(2) ol.View.fitExtent() と ol.View.fitGeometry() の ol.View.fit() への統合
　これは https://github.com/openlayers/ol3/releases/tag/v3.7.0 に記載がある。
内容としては， ol.View に対する関数の ol.View.fitExtent() と ol.View.fitGeometry() が ol.View.fit() に統合された，というもの。 ソースコード上の変更点としては，ol.View.fitExtent() と ol.View.fitGeometry() を，単に ol.View.fit() に書き換えるだけでいいみたい。

(3) ol.featureOverlay の廃止
　今回の投稿でもっと影響が大きいのが，この「ol.featureOverlay の廃止」である。 これも https://github.com/openlayers/ol3/releases/tag/v3.7.0 に記載がある。
これは ol.featureOverlay を廃止して ol.layer.Vector に統合する，というものである。 今まで ol.featureOverlay は ol.layer.Vector などの ol.layer 群に比べると異質な感じがするものだった。 ol.layer.XXXX のような中身なのに，より下層にありそうな feature というのが名前に入っていて，捉えにくい class だった。 それが ol.layer.Vector に統合されたので，ユーザーからすると少しわかりやすくなったのではないだろうか？

　使い方としては，今まで下記のようにしていたものを，

var featureOverlay = new ol.FeatureOverlay({
  map: map,
  style: overlayStyle
});
featureOverlay.addFeature(feature);
featureOverlay.removeFeature(feature);
var collection = featureOverlay.getFeatures();

これからは以下のようにしなさい，と書かれている。

var collection = new ol.Collection();
var featureOverlay = new ol.layer.Vector({
  map: map,
  source: new ol.source.Vector({
    features: collection,
    useSpatialIndex: false // optional, might improve performance
  }),
  style: overlayStyle,
  updateWhileAnimating: true, // optional, for instant visual feedback
  updateWhileInteracting: true // optional, for instant visual feedback
});
featureOverlay.getSource().addFeature(feature);
featureOverlay.getSource().removeFeature(feature);

　代替の方法は，まず feature の配列としての ol.Collection クラスの変数を用意する。 そして，その ol.Collection クラスの変数 (feature の配列) を要素として持つ ol.source.Vector クラスの変数を要素として持つ ol.layer.Vector クラスの変数として featureOverlay という名前の変数を定義する，というものである。 つまり，今まではこのように定義されたものを特別に ol.featureOverlay という名前をつけていたが，紛らわしいのでやめた，という感じみたいである。

　コードを書く際の変数定義以外の変更点としては，以下の2点などがあげられる（今回は以下の2点の変更が必要だった）

featureOverlay.getFeatures() ==> featureOverlay.getSource().getFeaturesCollection()
featureOverlay.addFeature(...) ==> featureOverlay.getSource().addFeature(...)

変更点としては，図形の点の配置などのデータを保持している feature (の配列である ol.Collection) が，ol.layer.Vector の中の ol.source.Vector の中に定義されているので getSource() という関数が必要になった点があげられる。 上記の2行とも，getSource() という関数が追加されている。 また，最初の行の方は，これまで getFeatures() という名前の関数で feature を取り出していたが，getFeaturesCollection() という関数にしないといけなくなったことによる。 関数名が getFeaturesCollection() となったことで，feature の配列 (ol.Collection) が得られると明示されるので，わかりやすくなったような気がする。

　ここに書いた以外にも変更はあると思うので，適宜 http://openlayers.org/en/v3.7.0/apidoc/ol.html などのリファレンスや，Examples を参照してみてほしい。