v1.13.1

Author: w-zz-w-zz-w

bower.json

@@ -13,12 +13,13 @@
   "dependencies": {
     "angular": "1.4.9",
     "angular-sanitize": "1.4.9",
-    "openlayers3": "https://github.com/tombatossals/ol3-compiled.git#3.8.2"
+    "openlayers": "https://github.com/openlayers/ol3/releases/download/v3.16.0/v3.16.0-dist.zip"
   },
   "devDependencies": {
     "jquery": "*",
     "angular-route": "1.4.9",
-    "angular-mocks": "1.4.9"
+    "angular-mocks": "1.4.9",
+    "js-polyfills": "^0.1.20"
   },
   "ignore": [
     "**/.*",

dist/angular-openlayers-directive.js

@@ -1347,8 +1347,9 @@ angular.module('openlayers-directive').factory('olHelpers', ["$q", "$log", "$htt
                 case 'JSONP':
                 case 'TopoJSON':
                 case 'KML':
-                case 'TileVector':
                     return 'Vector';
+                case 'TileVector':
+                    return 'TileVector';
                 default:
                     return 'Tile';
             }
@@ -1434,7 +1435,7 @@ angular.module('openlayers-directive').factory('olHelpers', ["$q", "$log", "$htt
                     url: source.url,
                     attributions: createAttribution(source),
                     crossOrigin: (typeof source.crossOrigin === 'undefined') ? 'anonymous' : source.crossOrigin,
-                    params: source.params,
+                    params: deepCopy(source.params),
                     ratio: source.ratio
                 });
                 break;
@@ -1447,7 +1448,7 @@ angular.module('openlayers-directive').factory('olHelpers', ["$q", "$log", "$htt
 
                 var wmsConfiguration = {
                     crossOrigin: (typeof source.crossOrigin === 'undefined') ? 'anonymous' : source.crossOrigin,
-                    params: source.params,
+                    params: deepCopy(source.params),
                     attributions: createAttribution(source)
                 };
 
@@ -1645,7 +1646,7 @@ angular.module('openlayers-directive').factory('olHelpers', ["$q", "$log", "$htt
                 if (!source.url || !source.format) {
                     $log.error('[AngularJS - Openlayers] - TileVector Layer needs valid url and format properties');
                 }
-                oSource = new ol.source.TileVector({
+                oSource = new ol.source.VectorTile({
                     url: source.url,
                     projection: projection,
                     attributions: createAttribution(source),
@@ -1769,6 +1770,17 @@ angular.module('openlayers-directive').factory('olHelpers', ["$q", "$log", "$htt
         return oSource;
     };
 
+    var deepCopy = function(oldObj) {
+        var newObj = oldObj;
+        if (oldObj && typeof oldObj === 'object') {
+            newObj = Object.prototype.toString.call(oldObj) === '[object Array]' ? [] : {};
+            for (var i in oldObj) {
+                newObj[i] = deepCopy(oldObj[i]);
+            }
+        }
+        return newObj;
+    };
+
     var createAttribution = function(source) {
         var attributions = [];
         if (isDefined(source.attribution)) {
@@ -2055,6 +2067,9 @@ angular.module('openlayers-directive').factory('olHelpers', ["$q", "$log", "$htt
                 case 'Vector':
                     oLayer = new ol.layer.Vector(layerConfig);
                     break;
+                case 'TileVector':
+                    oLayer = new ol.layer.VectorTile(layerConfig);
+                    break;
             }
 
             // set a layer name if given
@@ -2197,7 +2212,7 @@ angular.module('openlayers-directive').factory('olHelpers', ["$q", "$log", "$htt
             element.css('display', 'block');
             var ov = new ol.Overlay({
                 position: pos,
-                element: element,
+                element: element[0],
                 positioning: 'center-left'
             });
 

dist/angular-openlayers-directive.min.js

@@ -1347,8 +1347,9 @@ angular.module('openlayers-directive').factory('olHelpers', function($q, $log, $
                 case 'JSONP':
                 case 'TopoJSON':
                 case 'KML':
-                case 'TileVector':
                     return 'Vector';
+                case 'TileVector':
+                    return 'TileVector';
                 default:
                     return 'Tile';
             }
@@ -1434,7 +1435,7 @@ angular.module('openlayers-directive').factory('olHelpers', function($q, $log, $
                     url: source.url,
                     attributions: createAttribution(source),
                     crossOrigin: (typeof source.crossOrigin === 'undefined') ? 'anonymous' : source.crossOrigin,
-                    params: source.params,
+                    params: deepCopy(source.params),
                     ratio: source.ratio
                 });
                 break;
@@ -1447,7 +1448,7 @@ angular.module('openlayers-directive').factory('olHelpers', function($q, $log, $
 
                 var wmsConfiguration = {
                     crossOrigin: (typeof source.crossOrigin === 'undefined') ? 'anonymous' : source.crossOrigin,
-                    params: source.params,
+                    params: deepCopy(source.params),
                     attributions: createAttribution(source)
                 };
 
@@ -1645,7 +1646,7 @@ angular.module('openlayers-directive').factory('olHelpers', function($q, $log, $
                 if (!source.url || !source.format) {
                     $log.error('[AngularJS - Openlayers] - TileVector Layer needs valid url and format properties');
                 }
-                oSource = new ol.source.TileVector({
+                oSource = new ol.source.VectorTile({
                     url: source.url,
                     projection: projection,
                     attributions: createAttribution(source),
@@ -1769,6 +1770,17 @@ angular.module('openlayers-directive').factory('olHelpers', function($q, $log, $
         return oSource;
     };
 
+    var deepCopy = function(oldObj) {
+        var newObj = oldObj;
+        if (oldObj && typeof oldObj === 'object') {
+            newObj = Object.prototype.toString.call(oldObj) === '[object Array]' ? [] : {};
+            for (var i in oldObj) {
+                newObj[i] = deepCopy(oldObj[i]);
+            }
+        }
+        return newObj;
+    };
+
     var createAttribution = function(source) {
         var attributions = [];
         if (isDefined(source.attribution)) {
@@ -2055,6 +2067,9 @@ angular.module('openlayers-directive').factory('olHelpers', function($q, $log, $
                 case 'Vector':
                     oLayer = new ol.layer.Vector(layerConfig);
                     break;
+                case 'TileVector':
+                    oLayer = new ol.layer.VectorTile(layerConfig);
+                    break;
             }
 
             // set a layer name if given
@@ -2197,7 +2212,7 @@ angular.module('openlayers-directive').factory('olHelpers', function($q, $log, $
             element.css('display', 'block');
             var ov = new ol.Overlay({
                 position: pos,
-                element: element,
+                element: element[0],
                 positioning: 'center-left'
             });
 

dist/angular-openlayers-directive.min.no-header.js

@@ -75,14 +75,13 @@ Great, let's see now the complete HTML and inline javascript code needed to load
 
 You can see this example in action on the [simple-example demo file](http://tombatossals.github.io/angular-openlayers-directive/examples/01-simple-example.html).
 
-Take a look at the [AnguarJS controller documentation](http://docs.angularjs.org/guide/controller) if you want to learn more about Angular controller definition, or to the [AngularJS ngApp](http://docs.angularjs.org/api/ng.directive:ngApp) to know how to bootstrap an Angular application.
+Take a look at the [AngularJS controller documentation](http://docs.angularjs.org/guide/controller) if you want to learn more about Angular controller definition, or to the [AngularJS ngApp](http://docs.angularjs.org/api/ng.directive:ngApp) to know how to bootstrap an Angular application.
 
 Attributes Documentation
 ========================
 
 We have much more possibilities than showing a simple map, but this will need that we take a closer look at the attributes, listed below:
 
-- [ol-defaults attribute](https://github.com/tombatossals/angular-openlayers-directive/blob/master/doc/defaults-attribute.md)
-- [ol-center attribute](https://github.com/tombatossals/angular-openlayers-directive/blob/master/doc/center-attribute.md)
-- [ol-layers attribute](https://github.com/tombatossals/angular-openlayers-directive/blob/master/doc/layers-attribute.md)
-- [ol-markers attribute](https://github.com/tombatossals/angular-openlayers-directive/blob/master/doc/markers-attribute.md)
+- [ol-defaults attribute](https://github.com/tombatossals/angular-openlayers-directive/blob/master/doc/03-defaults-attribute.md)
+- [ol-center attribute](https://github.com/tombatossals/angular-openlayers-directive/blob/master/doc/02-center-attribute.md)
+- [ol-layers attribute](https://github.com/tombatossals/angular-openlayers-directive/blob/master/doc/04-layers-attribute.md)

dist/angular-openlayers-directive.pre.js

@@ -1,14 +1,14 @@
 <!DOCTYPE html>
 <html ng-app="demoapp">
   <head>
-    <script src="../bower_components/openlayers3/build/ol.js"></script>
+    <script src="../bower_components/openlayers/ol.js"></script>
     <script src="../bower_components/angular/angular.min.js"></script>
     <script src="../bower_components/angular-sanitize/angular-sanitize.min.js"></script>
     <script src="../dist/angular-openlayers-directive.js"></script>
     <script>
         var app = angular.module("demoapp", ['openlayers-directive']);
     </script>
-    <link rel="stylesheet" href="../bower_components/openlayers3/build/ol.css" />
+    <link rel="stylesheet" href="../bower_components/openlayers/ol.css" />
   </head>
   <body>
     <openlayers width="100%" height="400px"></openlayers>

doc/01-openlayers-directive.md

@@ -1,11 +1,11 @@
 <!DOCTYPE html>
 <html ng-app="demoapp">
   <head>
-    <script src="../bower_components/openlayers3/build/ol.js"></script>
+    <script src="../bower_components/openlayers/ol.js"></script>
     <script src="../bower_components/angular/angular.min.js"></script>
     <script src="../bower_components/angular-sanitize/angular-sanitize.min.js"></script>
     <script src="../dist/angular-openlayers-directive.js"></script>
-    <link rel="stylesheet" href="../bower_components/openlayers3/build/ol.css" />
+    <link rel="stylesheet" href="../bower_components/openlayers/ol.css" />
     <script>
         var app = angular.module('demoapp', ['openlayers-directive']);
         app.controller('DemoController', [ '$scope', function($scope) {

examples/010-simple-example.html

@@ -1,11 +1,11 @@
 <!DOCTYPE html>
 <html ng-app="demoapp">
   <head>
-    <script src="../bower_components/openlayers3/build/ol.js"></script>
+    <script src="../bower_components/openlayers/ol.js"></script>
     <script src="../bower_components/angular/angular.min.js"></script>
     <script src="../bower_components/angular-sanitize/angular-sanitize.min.js"></script>
     <script src="../dist/angular-openlayers-directive.js"></script>
-    <link rel="stylesheet" href="../bower_components/openlayers3/build/ol.css" />
+    <link rel="stylesheet" href="../bower_components/openlayers/ol.css" />
     <script>
         var app = angular.module('demoapp', ['openlayers-directive']);
         app.controller('DemoController', [ '$scope', '$location', '$timeout', function($scope, $location, $timeout) {

examples/020-center-example.html

@@ -1,11 +1,11 @@
 <!DOCTYPE html>
 <html ng-app="demoapp">
   <head>
-    <script src="../bower_components/openlayers3/build/ol.js"></script>
+    <script src="../bower_components/openlayers/ol.js"></script>
     <script src="../bower_components/angular/angular.min.js"></script>
     <script src="../bower_components/angular-sanitize/angular-sanitize.min.js"></script>
     <script src="../dist/angular-openlayers-directive.js"></script>
-    <link rel="stylesheet" href="../bower_components/openlayers3/build/ol.css" />
+    <link rel="stylesheet" href="../bower_components/openlayers/ol.css" />
     <script>
         var app = angular.module('demoapp', ['openlayers-directive']);
         app.controller('DemoController', [ '$scope', function($scope) {