Use vector source in snap example

examples_src/snap.js

@@ -1,4 +1,3 @@
-goog.require('ol.FeatureOverlay');
 goog.require('ol.Map');
 goog.require('ol.View');
 goog.require('ol.interaction');
@@ -7,7 +6,9 @@ goog.require('ol.interaction.Modify');
 goog.require('ol.interaction.Select');
 goog.require('ol.interaction.Snap');
 goog.require('ol.layer.Tile');
+goog.require('ol.layer.Vector');
 goog.require('ol.source.MapQuest');
+goog.require('ol.source.Vector');
 goog.require('ol.style.Circle');
 goog.require('ol.style.Fill');
 goog.require('ol.style.Stroke');
@@ -17,20 +18,8 @@ var raster = new ol.layer.Tile({
   source: new ol.source.MapQuest({layer: 'sat'})
 });
 
-var map = new ol.Map({
-  layers: [raster],
-  target: 'map',
-  view: new ol.View({
-    center: [-11000000, 4600000],
-    zoom: 4
-  })
-});
-
-// The features are not added to a regular vector layer/source,
-// but to a feature overlay which holds a collection of features.
-// This collection is passed to the modify and also the draw
-// interaction, so that both can add or modify features.
-var featureOverlay = new ol.FeatureOverlay({
+var vector = new ol.layer.Vector({
+  source: new ol.source.Vector(),
   style: new ol.style.Style({
     fill: new ol.style.Fill({
       color: 'rgba(255, 255, 255, 0.2)'
@@ -45,8 +34,16 @@ var featureOverlay = new ol.FeatureOverlay({
         color: '#ffcc33'
       })
     })
-  }),
-  map: map
+  })
+});
+
+var map = new ol.Map({
+  layers: [raster, vector],
+  target: 'map',
+  view: new ol.View({
+    center: [-11000000, 4600000],
+    zoom: 4
+  })
 });
 
 var Modify = {
@@ -86,15 +83,15 @@ var Draw = {
     this.Polygon.setActive(false);
   },
   Point: new ol.interaction.Draw({
-    features: featureOverlay.getFeatures(),
+    source: vector.getSource(),
     type: /** @type {ol.geom.GeometryType} */ ('Point')
   }),
   LineString: new ol.interaction.Draw({
-    features: featureOverlay.getFeatures(),
+    source: vector.getSource(),
     type: /** @type {ol.geom.GeometryType} */ ('LineString')
   }),
   Polygon: new ol.interaction.Draw({
-    features: featureOverlay.getFeatures(),
+    source: vector.getSource(),
     type: /** @type {ol.geom.GeometryType} */ ('Polygon')
   }),
   getActive: function() {
@@ -144,6 +141,6 @@ Modify.setActive(false);
 // in order for its map browser event handlers to be fired first. Its handlers
 // are responsible of doing the snapping.
 var snap = new ol.interaction.Snap({
-  features: featureOverlay.getFeatures()
+  source: vector.getSource()
 });
 map.addInteraction(snap);