Sensible default tilegrid for vector tiles

examples/mapbox-vector-tiles.js

@@ -10,7 +10,6 @@ goog.require('ol.style.Icon');
 goog.require('ol.style.Stroke');
 goog.require('ol.style.Style');
 goog.require('ol.style.Text');
-goog.require('ol.tilegrid');
 
 
 var key = 'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiRk1kMWZaSSJ9.E5BkluenyWQMsBLsuByrmg';
@@ -23,7 +22,6 @@ var map = new ol.Map({
           '© <a href="https://www.openstreetmap.org/copyright">' +
           'OpenStreetMap contributors</a>',
         format: new ol.format.MVT(),
-        tileGrid: ol.tilegrid.createXYZ({tileSize: 512, maxZoom: 22}),
         url: 'https://{a-d}.tiles.mapbox.com/v4/mapbox.mapbox-streets-v6/' +
             '{z}/{x}/{y}.vector.pbf?access_token=' + key
       }),

src/ol/source/vectortile.js

@@ -27,16 +27,26 @@ goog.require('ol.source.UrlTile');
  * @api
  */
 ol.source.VectorTile = function(options) {
+  var projection = options.projection || 'EPSG:3857';
+
+  var extent = options.extent || ol.tilegrid.extentFromProjection(projection);
+
+  var tileGrid = options.tileGrid || ol.tilegrid.createXYZ({
+    extent: extent,
+    maxZoom: options.maxZoom || 22,
+    minZoom: options.minZoom,
+    tileSize: options.tileSize || 512
+  });
 
   ol.source.UrlTile.call(this, {
     attributions: options.attributions,
     cacheSize: options.cacheSize !== undefined ? options.cacheSize : 128,
-    extent: options.extent,
+    extent: extent,
     logo: options.logo,
     opaque: false,
-    projection: options.projection,
+    projection: projection,
     state: options.state,
-    tileGrid: options.tileGrid,
+    tileGrid: tileGrid,
     tileLoadFunction: options.tileLoadFunction ?
       options.tileLoadFunction : ol.VectorImageTile.defaultLoadFunction,
     tileUrlFunction: options.tileUrlFunction,

test/spec/ol/source/vectortile.test.js

@@ -6,13 +6,11 @@ goog.require('ol.proj');
 goog.require('ol.source.VectorTile');
 goog.require('ol.tilegrid');
 
-
 describe('ol.source.VectorTile', function() {
 
   var format = new ol.format.MVT();
   var source = new ol.source.VectorTile({
     format: format,
-    tileGrid: ol.tilegrid.createXYZ({tileSize: 512}),
     tilePixelRatio: 8,
     url: 'spec/ol/data/{z}-{x}-{y}.vector.pbf'
   });
@@ -22,9 +20,16 @@ describe('ol.source.VectorTile', function() {
     it('sets the format on the instance', function() {
       expect(source.format_).to.equal(format);
     });
+
     it('uses ol.VectorTile as default tileClass', function() {
       expect(source.tileClass).to.equal(ol.VectorTile);
     });
+
+    it('creates a 512 XYZ tilegrid by default', function() {
+      var tileGrid = ol.tilegrid.createXYZ({tileSize: 512});
+      expect(source.tileGrid.tileSize_).to.equal(tileGrid.tileSize_);
+      expect(source.tileGrid.extent_).to.equal(tileGrid.extent_);
+    });
   });
 
   describe('#getTile()', function() {