Use simple forms to create attributions in examples

examples/flight-animation.js

@@ -76,10 +76,8 @@ var animateFlights = function(event) {
 
 flightsSource = new ol.source.Vector({
   wrapX: false,
-  attributions: [new ol.Attribution({
+  attributions: 'Flight data by ' +
-    html: 'Flight data by ' +
+        '<a href="http://openflights.org/data.html">OpenFlights</a>,',
-        '<a href="http://openflights.org/data.html">OpenFlights</a>,'
-  })],
   loader: function() {
     var url = 'data/openflights/flights.json';
     fetch(url).then(function(response) {

examples/igc.js

@@ -86,10 +86,7 @@ var map = new ol.Map({
     new ol.layer.Tile({
       source: new ol.source.OSM({
         attributions: [
-          new ol.Attribution({
+          'All maps © <a href="http://www.opencyclemap.org/">OpenCycleMap</a>',
-            html: 'All maps &copy; ' +
-                '<a href="http://www.opencyclemap.org/">OpenCycleMap</a>'
-          }),
           ol.source.OSM.ATTRIBUTION
         ],
         url: 'http://{a-c}.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png'

examples/localized-openstreetmap.js

@@ -9,10 +9,7 @@ goog.require('ol.source.OSM');
 var openCycleMapLayer = new ol.layer.Tile({
   source: new ol.source.OSM({
     attributions: [
-      new ol.Attribution({
+      'All maps © <a href="http://www.opencyclemap.org/">OpenCycleMap</a>',
-        html: 'All maps &copy; ' +
-            '<a href="http://www.opencyclemap.org/">OpenCycleMap</a>'
-      }),
       ol.source.OSM.ATTRIBUTION
     ],
     url: 'http://{a-c}.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png'
@@ -22,10 +19,7 @@ var openCycleMapLayer = new ol.layer.Tile({
 var openSeaMapLayer = new ol.layer.Tile({
   source: new ol.source.OSM({
     attributions: [
-      new ol.Attribution({
+      'All maps © <a href="http://www.openseamap.org/">OpenSeaMap</a>',
-        html: 'All maps &copy; ' +
-            '<a href="http://www.openseamap.org/">OpenSeaMap</a>'
-      }),
       ol.source.OSM.ATTRIBUTION
     ],
     opaque: false,

examples/mapbox-vector-tiles-advanced.js

@@ -45,11 +45,9 @@ var map = new ol.Map({
     new ol.layer.VectorTile({
       preload: Infinity,
       source: new ol.source.VectorTile({
-        attributions: [new ol.Attribution({
+        attributions: '© <a href="https://www.mapbox.com/map-feedback/">Mapbox</a> ' +
-          html: '© <a href="https://www.mapbox.com/map-feedback/">Mapbox</a> ' +
           '© <a href="http://www.openstreetmap.org/copyright">' +
-              'OpenStreetMap contributors</a>'
+          'OpenStreetMap contributors</a>',
-        })],
         format: new ol.format.MVT(),
         tileGrid: new ol.tilegrid.TileGrid({
           extent: ol.proj.get('EPSG:3857').getExtent(),

examples/mapbox-vector-tiles.js

@@ -17,11 +17,9 @@ var map = new ol.Map({
   layers: [
     new ol.layer.VectorTile({
       source: new ol.source.VectorTile({
-        attributions: [new ol.Attribution({
+        attributions: '© <a href="https://www.mapbox.com/map-feedback/">Mapbox</a> ' +
-          html: '© <a href="https://www.mapbox.com/map-feedback/">Mapbox</a> ' +
           '© <a href="http://www.openstreetmap.org/copyright">' +
-              'OpenStreetMap contributors</a>'
+          'OpenStreetMap contributors</a>',
-        })],
         format: new ol.format.MVT(),
         tileGrid: ol.tilegrid.createXYZ({maxZoom: 22}),
         tilePixelRatio: 16,

examples/reprojection.js

@@ -81,12 +81,8 @@ layers['wms4326'] = new ol.layer.Tile({
 
 layers['wms21781'] = new ol.layer.Tile({
   source: new ol.source.TileWMS({
-    attributions: [new ol.Attribution({
+    attributions: '© <a href="http://www.geo.admin.ch/internet/geoportal/' +
-      html: '&copy; ' +
+      'en/home.html">Pixelmap 1:1000000 / geo.admin.ch</a>',
-          '<a href="http://www.geo.admin.ch/internet/geoportal/' +
-          'en/home.html">' +
-          'Pixelmap 1:1000000 / geo.admin.ch</a>'
-    })],
     crossOrigin: 'anonymous',
     params: {
       'LAYERS': 'ch.swisstopo.pixelkarte-farbe-pk1000.noscale',
@@ -120,10 +116,8 @@ layers['grandcanyon'] = new ol.layer.Tile({
     crossOrigin: '',
     tilePixelRatio: 2,
     maxZoom: 15,
-    attributions: [new ol.Attribution({
+    attributions: 'Tiles © USGS, rendered with ' +
-      html: 'Tiles &copy; USGS, rendered with ' +
       '<a href="http://www.maptiler.com/">MapTiler</a>'
-    })]
   })
 });
 

examples/static-image.js

@@ -21,11 +21,7 @@ var map = new ol.Map({
   layers: [
     new ol.layer.Image({
       source: new ol.source.ImageStatic({
-        attributions: [
+        attributions: '© <a href="http://xkcd.com/license.html">xkcd</a>',
-          new ol.Attribution({
-            html: '&copy; <a href="http://xkcd.com/license.html">xkcd</a>'
-          })
-        ],
         url: 'http://imgs.xkcd.com/comics/online_communities.png',
         projection: projection,
         imageExtent: extent

examples/vector-esri-edit.js

@@ -53,14 +53,10 @@ var vector = new ol.layer.Vector({
   source: vectorSource
 });
 
-var attribution = new ol.Attribution({
-  html: 'Tiles &copy; <a href="http://services.arcgisonline.com/ArcGIS/' +
-      'rest/services/World_Topo_Map/MapServer">ArcGIS</a>'
-});
-
 var raster = new ol.layer.Tile({
   source: new ol.source.XYZ({
-    attributions: [attribution],
+    attributions: 'Tiles © <a href="http://services.arcgisonline.com/ArcGIS/' +
+        'rest/services/World_Topo_Map/MapServer">ArcGIS</a>',
     url: 'http://server.arcgisonline.com/ArcGIS/rest/services/' +
         'World_Topo_Map/MapServer/tile/{z}/{y}/{x}'
   })

examples/vector-esri.js

@@ -95,15 +95,10 @@ var vector = new ol.layer.Vector({
   }
 });
 
-
-var attribution = new ol.Attribution({
-  html: 'Tiles &copy; <a href="http://services.arcgisonline.com/ArcGIS/' +
-      'rest/services/World_Topo_Map/MapServer">ArcGIS</a>'
-});
-
 var raster = new ol.layer.Tile({
   source: new ol.source.XYZ({
-    attributions: [attribution],
+    attributions: 'Tiles © <a href="http://services.arcgisonline.com/ArcGIS/' +
+        'rest/services/World_Topo_Map/MapServer">ArcGIS</a>',
     url: 'http://server.arcgisonline.com/ArcGIS/rest/services/' +
         'World_Topo_Map/MapServer/tile/{z}/{y}/{x}'
   })

examples/wms-custom-proj.js

@@ -48,12 +48,8 @@ var layers = [
     source: new ol.source.TileWMS({
       url: 'http://wms.geo.admin.ch/',
       crossOrigin: 'anonymous',
-      attributions: [new ol.Attribution({
+      attributions: '© <a href="http://www.geo.admin.ch/internet/geoportal/' +
-        html: '&copy; ' +
+          'en/home.html">Pixelmap 1:1000000 / geo.admin.ch</a>',
-            '<a href="http://www.geo.admin.ch/internet/geoportal/' +
-            'en/home.html">' +
-            'Pixelmap 1:1000000 / geo.admin.ch</a>'
-      })],
       params: {
         'LAYERS': 'ch.swisstopo.pixelkarte-farbe-pk1000.noscale',
         'FORMAT': 'image/jpeg'
@@ -66,12 +62,8 @@ var layers = [
     source: new ol.source.TileWMS({
       url: 'http://wms.geo.admin.ch/',
       crossOrigin: 'anonymous',
-      attributions: [new ol.Attribution({
+      attributions: '© <a href="http://www.geo.admin.ch/internet/geoportal/' +
-        html: '&copy; ' +
+          'en/home.html">National parks / geo.admin.ch</a>',
-            '<a href="http://www.geo.admin.ch/internet/geoportal/' +
-            'en/home.html">' +
-            'National parks / geo.admin.ch</a>'
-      })],
       params: {'LAYERS': 'ch.bafu.schutzgebiete-paerke_nationaler_bedeutung'},
       serverType: 'mapserver'
     })

examples/wms-image-custom-proj.js

@@ -36,12 +36,8 @@ var layers = [
     source: new ol.source.ImageWMS({
       url: 'http://wms.geo.admin.ch/',
       crossOrigin: 'anonymous',
-      attributions: [new ol.Attribution({
+      attributions: '© <a href="http://www.geo.admin.ch/internet/geoportal/' +
-        html: '&copy; ' +
+          'en/home.html">Pixelmap 1:1000000 / geo.admin.ch</a>',
-            '<a href="http://www.geo.admin.ch/internet/geoportal/' +
-            'en/home.html">' +
-            'Pixelmap 1:1000000 / geo.admin.ch</a>'
-      })],
       params: {
         'LAYERS': 'ch.swisstopo.pixelkarte-farbe-pk1000.noscale',
         'FORMAT': 'image/jpeg'
@@ -54,12 +50,8 @@ var layers = [
     source: new ol.source.ImageWMS({
       url: 'http://wms.geo.admin.ch/',
       crossOrigin: 'anonymous',
-      attributions: [new ol.Attribution({
+      attributions: '© <a href="http://www.geo.admin.ch/internet/geoportal/' +
-        html: '&copy; ' +
+          'en/home.html">National parks / geo.admin.ch</a>',
-            '<a href="http://www.geo.admin.ch/internet/geoportal/' +
-            'en/home.html">' +
-            'National parks / geo.admin.ch</a>'
-      })],
       params: {'LAYERS': 'ch.bafu.schutzgebiete-paerke_nationaler_bedeutung'},
       serverType: /** @type {ol.source.wms.ServerType} */ ('mapserver')
     })

examples/wms-no-proj.js

@@ -11,12 +11,8 @@ goog.require('ol.source.TileWMS');
 var layers = [
   new ol.layer.Tile({
     source: new ol.source.TileWMS({
-      attributions: [new ol.Attribution({
+      attributions: '© <a href="http://www.geo.admin.ch/internet/geoportal/' +
-        html: '&copy; ' +
+          'en/home.html">Pixelmap 1:1000000 / geo.admin.ch</a>',
-            '<a href="http://www.geo.admin.ch/internet/geoportal/' +
-            'en/home.html">' +
-            'Pixelmap 1:1000000 / geo.admin.ch</a>'
-      })],
       crossOrigin: 'anonymous',
       params: {
         'LAYERS': 'ch.swisstopo.pixelkarte-farbe-pk1000.noscale',
@@ -27,12 +23,8 @@ var layers = [
   }),
   new ol.layer.Image({
     source: new ol.source.ImageWMS({
-      attributions: [new ol.Attribution({
+      attributions: '© <a href="http://www.geo.admin.ch/internet/geoportal/' +
-        html: '&copy; ' +
+          'en/home.html">National parks / geo.admin.ch</a>',
-            '<a href="http://www.geo.admin.ch/internet/geoportal/' +
-            'en/home.html">' +
-            'National parks / geo.admin.ch</a>'
-      })],
       crossOrigin: 'anonymous',
       params: {'LAYERS': 'ch.bafu.schutzgebiete-paerke_nationaler_bedeutung'},
       serverType: 'mapserver',

examples/wmts-dimensions.js

@@ -33,13 +33,9 @@ var wmtsSource = new ol.source.WMTS({
   format: 'image/png',
   matrixSet: 'EPSG:3857',
   attributions: [
-    new ol.Attribution({
+    '<a href="http://scalgo.com">SCALGO</a>',
-      html: '<a href="http://scalgo.com">SCALGO</a>'
+    '<a href="http://www.cgiar-csi.org/data/' +
-    }),
-    new ol.Attribution({
-      html: '<a href="http://www.cgiar-csi.org/data/' +
         'srtm-90m-digital-elevation-database-v4-1">CGIAR-CSI SRTM</a>'
-    })
   ],
   tileGrid: tileGrid,
   style: 'default',

examples/wmts.js

@@ -21,12 +21,6 @@ for (var z = 0; z < 14; ++z) {
   matrixIds[z] = z;
 }
 
-var attribution = new ol.Attribution({
-  html: 'Tiles &copy; <a href="http://services.arcgisonline.com/arcgis/rest/' +
-      'services/Demographics/USA_Population_Density/MapServer/">ArcGIS</a>'
-});
-
-
 var map = new ol.Map({
   layers: [
     new ol.layer.Tile({
@@ -36,7 +30,8 @@ var map = new ol.Map({
     new ol.layer.Tile({
       opacity: 0.7,
       source: new ol.source.WMTS({
-        attributions: [attribution],
+        attributions: 'Tiles © <a href="http://services.arcgisonline.com/arcgis/rest/' +
+            'services/Demographics/USA_Population_Density/MapServer/">ArcGIS</a>',
         url: 'http://services.arcgisonline.com/arcgis/rest/' +
             'services/Demographics/USA_Population_Density/MapServer/WMTS/',
         layer: '0',

examples/xyz-esri-4326-512.js

@@ -6,7 +6,7 @@ goog.require('ol.proj');
 goog.require('ol.source.XYZ');
 
 var attribution = new ol.Attribution({
-  html: 'Copyright:© 2013 ESRI, i-cubed, GeoEye'
+  html: 'Copyright:© 2013 ESRI, i-cubed, GeoEye'
 });
 
 var projection = ol.proj.get('EPSG:4326');

examples/xyz-esri.js

@@ -7,7 +7,7 @@ goog.require('ol.source.XYZ');
 
 
 var attribution = new ol.Attribution({
-  html: 'Tiles &copy; <a href="http://services.arcgisonline.com/ArcGIS/' +
+  html: 'Tiles © <a href="http://services.arcgisonline.com/ArcGIS/' +
       'rest/services/World_Topo_Map/MapServer">ArcGIS</a>'
 });
 

examples/xyz-retina.js

@@ -6,12 +6,6 @@ goog.require('ol.proj');
 goog.require('ol.source.OSM');
 goog.require('ol.source.XYZ');
 
-
-var attribution = new ol.Attribution({
-  html: 'Tiles © USGS, rendered with ' +
-      '<a href="http://www.maptiler.com/">MapTiler</a>'
-});
-
 var mapMinZoom = 1;
 var mapMaxZoom = 15;
 var mapExtent = [-112.261791, 35.983744, -112.113981, 36.132062];
@@ -25,7 +19,8 @@ var map = new ol.Map({
     new ol.layer.Tile({
       extent: ol.proj.transformExtent(mapExtent, 'EPSG:4326', 'EPSG:3857'),
       source: new ol.source.XYZ({
-        attributions: [attribution],
+        attributions: 'Tiles © USGS, rendered with ' +
+            '<a href="http://www.maptiler.com/">MapTiler</a>',
         url: 'http://tileserver.maptiler.com/grandcanyon@2x/{z}/{x}/{y}.png',
         tilePixelRatio: 2, // THIS IS IMPORTANT
         minZoom: mapMinZoom,