From db3ad70a3d7598254cbf11b7a6540b9fba3773ab Mon Sep 17 00:00:00 2001
From: Nicholas L <nicholas-l@users.noreply.github.com>
Date: Fri, 8 Jan 2016 23:41:24 +1300
Subject: [PATCH] Remove use of goog.bind and use ES5 .bind

---
 config/examples/example.html                  |  2 +-
 examples/geolocation-orientation.html         |  1 +
 examples/mobile-full-screen.html              |  1 +
 src/ol/format/kmlformat.js                    |  4 +-
 src/ol/geolocation.js                         |  4 +-
 src/ol/imagecanvas.js                         |  2 +-
 .../interaction/mousewheelzoominteraction.js  |  2 +-
 src/ol/interaction/snapinteraction.js         |  4 +-
 src/ol/layer/heatmaplayer.js                  |  4 +-
 src/ol/map.js                                 |  4 +-
 src/ol/mapbrowserevent.js                     |  4 +-
 src/ol/pointer/pointereventhandler.js         |  2 +-
 src/ol/pointer/touchsource.js                 |  2 +-
 src/ol/renderer/maprenderer.js                |  2 +-
 src/ol/renderer/webgl/webglmaprenderer.js     | 46 ++++++++++---------
 src/ol/reproj/tile.js                         |  2 +-
 src/ol/source/bingmapssource.js               |  2 +-
 src/ol/source/imagesource.js                  |  4 +-
 src/ol/source/imagevectorsource.js            |  2 +-
 src/ol/source/rastersource.js                 |  2 +-
 src/ol/source/tilearcgisrestsource.js         |  2 +-
 src/ol/source/tileimagesource.js              |  4 +-
 src/ol/source/tilejsonsource.js               |  4 +-
 src/ol/source/tileutfgridsource.js            |  6 +--
 src/ol/source/tilewmssource.js                |  2 +-
 src/ol/style/circlestyle.js                   |  4 +-
 src/ol/style/regularshapestyle.js             |  4 +-
 27 files changed, 64 insertions(+), 58 deletions(-)

diff --git a/config/examples/example.html b/config/examples/example.html
index dd568a12b7..567b54ada0 100644
--- a/config/examples/example.html
+++ b/config/examples/example.html
@@ -11,7 +11,7 @@
     <link rel="stylesheet" href="./resources/layout.css" type="text/css">
     {{{ extraHead.local }}}
     {{{ css.tag }}}
-    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=fetch"></script>
+    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=fetch,Function.prototype.bind|gated"></script>
     <script src="./resources/zeroclipboard/ZeroClipboard.min.js"></script>
     <title>{{ title }}</title>
   </head>
diff --git a/examples/geolocation-orientation.html b/examples/geolocation-orientation.html
index 6cbd755a15..4a6b5d433e 100644
--- a/examples/geolocation-orientation.html
+++ b/examples/geolocation-orientation.html
@@ -13,6 +13,7 @@ tags: "fullscreen, geolocation, orientation, mobile"
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="../css/ol.css" type="text/css">
     <link rel="stylesheet" href="./resources/layout.css" type="text/css">
+    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=Function.prototype.bind|gated"></script>
     <title>Mobile Geolocation Tracking with Orientation</title>
     <style type="text/css">
       html, body, .map {
diff --git a/examples/mobile-full-screen.html b/examples/mobile-full-screen.html
index 3b427d805f..ebc4e00fd0 100644
--- a/examples/mobile-full-screen.html
+++ b/examples/mobile-full-screen.html
@@ -13,6 +13,7 @@ cloak:
     <meta http-equiv="X-UA-Compatible" content="chrome=1">
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
     <title>Mobile full screen example</title>
+    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=Function.prototype.bind|gated"></script>
     <style type="text/css">
       html, body, .map {
         margin: 0;
diff --git a/src/ol/format/kmlformat.js b/src/ol/format/kmlformat.js
index 033557a752..d853520b85 100644
--- a/src/ol/format/kmlformat.js
+++ b/src/ol/format/kmlformat.js
@@ -1763,8 +1763,8 @@ ol.format.KML.prototype.readDocumentOrFolder_ = function(node, objectStack) {
         'Document': ol.xml.makeArrayExtender(this.readDocumentOrFolder_, this),
         'Folder': ol.xml.makeArrayExtender(this.readDocumentOrFolder_, this),
         'Placemark': ol.xml.makeArrayPusher(this.readPlacemark_, this),
-        'Style': goog.bind(this.readSharedStyle_, this),
-        'StyleMap': goog.bind(this.readSharedStyleMap_, this)
+        'Style': this.readSharedStyle_.bind(this),
+        'StyleMap': this.readSharedStyleMap_.bind(this)
       });
   var features = ol.xml.pushParseAndPop(/** @type {Array.<ol.Feature>} */ ([]),
       parsersNS, node, objectStack, this);
diff --git a/src/ol/geolocation.js b/src/ol/geolocation.js
index 79896c1eae..3a37b599e3 100644
--- a/src/ol/geolocation.js
+++ b/src/ol/geolocation.js
@@ -135,8 +135,8 @@ ol.Geolocation.prototype.handleTrackingChanged_ = function() {
     var tracking = this.getTracking();
     if (tracking && this.watchId_ === undefined) {
       this.watchId_ = goog.global.navigator.geolocation.watchPosition(
-          goog.bind(this.positionChange_, this),
-          goog.bind(this.positionError_, this),
+          this.positionChange_.bind(this),
+          this.positionError_.bind(this),
           this.getTrackingOptions());
     } else if (!tracking && this.watchId_ !== undefined) {
       goog.global.navigator.geolocation.clearWatch(this.watchId_);
diff --git a/src/ol/imagecanvas.js b/src/ol/imagecanvas.js
index d12faf242b..a61695e08d 100644
--- a/src/ol/imagecanvas.js
+++ b/src/ol/imagecanvas.js
@@ -80,7 +80,7 @@ ol.ImageCanvas.prototype.load = function() {
     goog.asserts.assert(this.loader_, 'this.loader_ must be set');
     this.state = ol.ImageState.LOADING;
     this.changed();
-    this.loader_(goog.bind(this.handleLoad_, this));
+    this.loader_(this.handleLoad_.bind(this));
   }
 };
 
diff --git a/src/ol/interaction/mousewheelzoominteraction.js b/src/ol/interaction/mousewheelzoominteraction.js
index d6106b90e4..b71442a578 100644
--- a/src/ol/interaction/mousewheelzoominteraction.js
+++ b/src/ol/interaction/mousewheelzoominteraction.js
@@ -98,7 +98,7 @@ ol.interaction.MouseWheelZoom.handleEvent = function(mapBrowserEvent) {
 
     goog.global.clearTimeout(this.timeoutId_);
     this.timeoutId_ = goog.global.setTimeout(
-        goog.bind(this.doZoom_, this, map), timeLeft);
+        this.doZoom_.bind(this, map), timeLeft);
 
     mapBrowserEvent.preventDefault();
     stopEvent = true;
diff --git a/src/ol/interaction/snapinteraction.js b/src/ol/interaction/snapinteraction.js
index f2d7d9af33..cb63622736 100644
--- a/src/ol/interaction/snapinteraction.js
+++ b/src/ol/interaction/snapinteraction.js
@@ -120,7 +120,7 @@ ol.interaction.Snap = function(opt_options) {
    * @type {function(ol.interaction.Snap.SegmentDataType, ol.interaction.Snap.SegmentDataType): number}
    * @private
    */
-  this.sortByDistance_ = goog.bind(ol.interaction.Snap.sortByDistance, this);
+  this.sortByDistance_ = ol.interaction.Snap.sortByDistance.bind(this);
 
 
   /**
@@ -170,7 +170,7 @@ ol.interaction.Snap.prototype.addFeature = function(feature, opt_listen) {
     if (listen) {
       this.geometryModifyListenerKeys_[feature_uid] = geometry.on(
           goog.events.EventType.CHANGE,
-          goog.bind(this.handleGeometryModify_, this, feature),
+          this.handleGeometryModify_.bind(this, feature),
           this);
       this.geometryChangeListenerKeys_[feature_uid] = feature.on(
           ol.Object.getChangeEventType(feature.getGeometryName()),
diff --git a/src/ol/layer/heatmaplayer.js b/src/ol/layer/heatmaplayer.js
index 35875a1898..73ad1c0512 100644
--- a/src/ol/layer/heatmaplayer.js
+++ b/src/ol/layer/heatmaplayer.js
@@ -102,7 +102,7 @@ ol.layer.Heatmap = function(opt_options) {
   goog.asserts.assert(goog.isFunction(weightFunction),
       'weightFunction should be a function');
 
-  this.setStyle(goog.bind(function(feature, resolution) {
+  this.setStyle(function(feature, resolution) {
     goog.asserts.assert(this.styleCache_, 'this.styleCache_ expected');
     goog.asserts.assert(this.circleImage_ !== undefined,
         'this.circleImage_ should be defined');
@@ -123,7 +123,7 @@ ol.layer.Heatmap = function(opt_options) {
       this.styleCache_[index] = style;
     }
     return style;
-  }, this));
+  }.bind(this));
 
   // For performance reasons, don't sort the features before rendering.
   // The render order is not relevant for a heatmap representation.
diff --git a/src/ol/map.js b/src/ol/map.js
index 6ee7cc9583..2e9faa1794 100644
--- a/src/ol/map.js
+++ b/src/ol/map.js
@@ -392,8 +392,8 @@ ol.Map = function(options) {
    * @type {ol.TileQueue}
    */
   this.tileQueue_ = new ol.TileQueue(
-      goog.bind(this.getTilePriority, this),
-      goog.bind(this.handleTileChange_, this));
+      this.getTilePriority.bind(this),
+      this.handleTileChange_.bind(this));
 
   /**
    * Uids of features to skip at rendering time.
diff --git a/src/ol/mapbrowserevent.js b/src/ol/mapbrowserevent.js
index 73432c38d8..7ac9799128 100644
--- a/src/ol/mapbrowserevent.js
+++ b/src/ol/mapbrowserevent.js
@@ -236,12 +236,12 @@ ol.MapBrowserEventHandler.prototype.emulateClick_ = function(pointerEvent) {
     this.dispatchEvent(newEvent);
   } else {
     // click
-    this.clickTimeoutId_ = goog.global.setTimeout(goog.bind(function() {
+    this.clickTimeoutId_ = goog.global.setTimeout(function() {
       this.clickTimeoutId_ = 0;
       var newEvent = new ol.MapBrowserPointerEvent(
           ol.MapBrowserEvent.EventType.SINGLECLICK, this.map_, pointerEvent);
       this.dispatchEvent(newEvent);
-    }, this), 250);
+    }.bind(this), 250);
   }
 };
 
diff --git a/src/ol/pointer/pointereventhandler.js b/src/ol/pointer/pointereventhandler.js
index b86c27a180..83fddca587 100644
--- a/src/ol/pointer/pointereventhandler.js
+++ b/src/ol/pointer/pointereventhandler.js
@@ -120,7 +120,7 @@ ol.pointer.PointerEventHandler.prototype.registerSource = function(name, source)
       var handler = s.getHandlerForEvent(e);
 
       if (handler) {
-        this.eventMap_[e] = goog.bind(handler, s);
+        this.eventMap_[e] = handler.bind(s);
       }
     }, this);
     this.eventSourceList_.push(s);
diff --git a/src/ol/pointer/touchsource.js b/src/ol/pointer/touchsource.js
index 5eb165dac9..820cb15eb4 100644
--- a/src/ol/pointer/touchsource.js
+++ b/src/ol/pointer/touchsource.js
@@ -150,7 +150,7 @@ ol.pointer.TouchSource.prototype.removePrimaryPointer_ = function(inPointer) {
  */
 ol.pointer.TouchSource.prototype.resetClickCount_ = function() {
   this.resetId_ = goog.global.setTimeout(
-      goog.bind(this.resetClickCountHandler_, this),
+      this.resetClickCountHandler_.bind(this),
       ol.pointer.TouchSource.CLICK_COUNT_TIMEOUT);
 };
 
diff --git a/src/ol/renderer/maprenderer.js b/src/ol/renderer/maprenderer.js
index 68d1253087..500e5f1427 100644
--- a/src/ol/renderer/maprenderer.js
+++ b/src/ol/renderer/maprenderer.js
@@ -368,7 +368,7 @@ ol.renderer.Map.prototype.scheduleRemoveUnusedLayerRenderers = function(frameSta
   for (layerKey in this.layerRenderers_) {
     if (!(layerKey in frameState.layerStates)) {
       frameState.postRenderFunctions.push(
-          goog.bind(this.removeUnusedLayerRenderers_, this));
+          this.removeUnusedLayerRenderers_.bind(this));
       return;
     }
   }
diff --git a/src/ol/renderer/webgl/webglmaprenderer.js b/src/ol/renderer/webgl/webglmaprenderer.js
index f1ef14ec8d..68df7370da 100644
--- a/src/ol/renderer/webgl/webglmaprenderer.js
+++ b/src/ol/renderer/webgl/webglmaprenderer.js
@@ -128,20 +128,19 @@ ol.renderer.webgl.Map = function(container, map) {
    * @type {ol.structs.PriorityQueue.<Array>}
    */
   this.tileTextureQueue_ = new ol.structs.PriorityQueue(
-      goog.bind(
-          /**
-           * @param {Array.<*>} element Element.
-           * @return {number} Priority.
-           * @this {ol.renderer.webgl.Map}
-           */
-          function(element) {
-            var tileCenter = /** @type {ol.Coordinate} */ (element[1]);
-            var tileResolution = /** @type {number} */ (element[2]);
-            var deltaX = tileCenter[0] - this.focus_[0];
-            var deltaY = tileCenter[1] - this.focus_[1];
-            return 65536 * Math.log(tileResolution) +
-                Math.sqrt(deltaX * deltaX + deltaY * deltaY) / tileResolution;
-          }, this),
+      /**
+       * @param {Array.<*>} element Element.
+       * @return {number} Priority.
+       * @this {ol.renderer.webgl.Map}
+       */
+      (function(element) {
+        var tileCenter = /** @type {ol.Coordinate} */ (element[1]);
+        var tileResolution = /** @type {number} */ (element[2]);
+        var deltaX = tileCenter[0] - this.focus_[0];
+        var deltaY = tileCenter[1] - this.focus_[1];
+        return 65536 * Math.log(tileResolution) +
+            Math.sqrt(deltaX * deltaX + deltaY * deltaY) / tileResolution;
+      }).bind(this),
       /**
        * @param {Array.<*>} element Element.
        * @return {string} Key.
@@ -150,11 +149,14 @@ ol.renderer.webgl.Map = function(container, map) {
         return /** @type {ol.Tile} */ (element[0]).getKey();
       });
 
-  /**
-   * @private
-   * @type {ol.PostRenderFunction}
-   */
-  this.loadNextTileTexture_ = goog.bind(
+
+ /**
+  * @param {ol.Map} map Map.
+  * @param {?olx.FrameState} frameState Frame state.
+  * @return {boolean} false.
+  * @this {ol.renderer.webgl.Map}
+  */
+  this.loadNextTileTexture_ =
       function(map, frameState) {
         if (!this.tileTextureQueue_.isEmpty()) {
           this.tileTextureQueue_.reprioritize();
@@ -165,7 +167,9 @@ ol.renderer.webgl.Map = function(container, map) {
           this.bindTileTexture(
               tile, tileSize, tileGutter, goog.webgl.LINEAR, goog.webgl.LINEAR);
         }
-      }, this);
+        return false;
+      }.bind(this);
+
 
   /**
    * @private
@@ -514,7 +518,7 @@ ol.renderer.webgl.Map.prototype.renderFrame = function(frameState) {
 
   if (this.textureCache_.getCount() - this.textureCacheFrameMarkerCount_ >
       ol.WEBGL_TEXTURE_CACHE_HIGH_WATER_MARK) {
-    frameState.postRenderFunctions.push(goog.bind(this.expireCache_, this));
+    frameState.postRenderFunctions.push(this.expireCache_.bind(this));
   }
 
   if (!this.tileTextureQueue_.isEmpty()) {
diff --git a/src/ol/reproj/tile.js b/src/ol/reproj/tile.js
index 155007bc39..215c9b572b 100644
--- a/src/ol/reproj/tile.js
+++ b/src/ol/reproj/tile.js
@@ -321,7 +321,7 @@ ol.reproj.Tile.prototype.load = function() {
     });
 
     if (leftToLoad === 0) {
-      goog.global.setTimeout(goog.bind(this.reproject_, this), 0);
+      goog.global.setTimeout(this.reproject_.bind(this), 0);
     }
   }
 };
diff --git a/src/ol/source/bingmapssource.js b/src/ol/source/bingmapssource.js
index 3e6f9e3978..dd5b8635ac 100644
--- a/src/ol/source/bingmapssource.js
+++ b/src/ol/source/bingmapssource.js
@@ -55,7 +55,7 @@ ol.source.BingMaps = function(options) {
     'include': 'ImageryProviders',
     'uriScheme': 'https',
     'key': options.key
-  }, goog.bind(this.handleImageryMetadataResponse, this));
+  }, this.handleImageryMetadataResponse.bind(this));
 
 };
 goog.inherits(ol.source.BingMaps, ol.source.TileImage);
diff --git a/src/ol/source/imagesource.js b/src/ol/source/imagesource.js
index 3a1ceaae7a..12e4e6b15f 100644
--- a/src/ol/source/imagesource.js
+++ b/src/ol/source/imagesource.js
@@ -130,10 +130,10 @@ ol.source.Image.prototype.getImage = function(extent, resolution, pixelRatio, pr
 
     this.reprojectedImage_ = new ol.reproj.Image(
         sourceProjection, projection, extent, resolution, pixelRatio,
-        goog.bind(function(extent, resolution, pixelRatio) {
+        function(extent, resolution, pixelRatio) {
           return this.getImageInternal(extent, resolution,
               pixelRatio, sourceProjection);
-        }, this));
+        }.bind(this));
     this.reprojectedRevision_ = this.getRevision();
 
     return this.reprojectedImage_;
diff --git a/src/ol/source/imagevectorsource.js b/src/ol/source/imagevectorsource.js
index 30755af318..1893968b3b 100644
--- a/src/ol/source/imagevectorsource.js
+++ b/src/ol/source/imagevectorsource.js
@@ -65,7 +65,7 @@ ol.source.ImageVector = function(options) {
 
   goog.base(this, {
     attributions: options.attributions,
-    canvasFunction: goog.bind(this.canvasFunctionInternal_, this),
+    canvasFunction: this.canvasFunctionInternal_.bind(this),
     logo: options.logo,
     projection: options.projection,
     ratio: options.ratio,
diff --git a/src/ol/source/rastersource.js b/src/ol/source/rastersource.js
index 5689705323..ea25acff34 100644
--- a/src/ol/source/rastersource.js
+++ b/src/ol/source/rastersource.js
@@ -80,7 +80,7 @@ ol.source.Raster = function(options) {
       function() {
         return 1;
       },
-      goog.bind(this.changed, this));
+      this.changed.bind(this));
 
   var layerStatesArray = ol.source.Raster.getLayerStatesArray_(this.renderers_);
   var layerStates = {};
diff --git a/src/ol/source/tilearcgisrestsource.js b/src/ol/source/tilearcgisrestsource.js
index d788ba3342..68d0468d7a 100644
--- a/src/ol/source/tilearcgisrestsource.js
+++ b/src/ol/source/tilearcgisrestsource.js
@@ -42,7 +42,7 @@ ol.source.TileArcGISRest = function(opt_options) {
     reprojectionErrorThreshold: options.reprojectionErrorThreshold,
     tileGrid: options.tileGrid,
     tileLoadFunction: options.tileLoadFunction,
-    tileUrlFunction: goog.bind(this.tileUrlFunction_, this),
+    tileUrlFunction: this.tileUrlFunction_.bind(this),
     url: options.url,
     urls: options.urls,
     wrapX: options.wrapX !== undefined ? options.wrapX : true
diff --git a/src/ol/source/tileimagesource.js b/src/ol/source/tileimagesource.js
index 61fb419f74..d9abf1d2ab 100644
--- a/src/ol/source/tileimagesource.js
+++ b/src/ol/source/tileimagesource.js
@@ -229,9 +229,9 @@ ol.source.TileImage.prototype.getTile = function(z, x, y, pixelRatio, projection
           sourceProjection, sourceTileGrid,
           projection, targetTileGrid,
           tileCoord, wrappedTileCoord, this.getTilePixelRatio(pixelRatio),
-          goog.bind(function(z, x, y, pixelRatio) {
+          function(z, x, y, pixelRatio) {
             return this.getTileInternal(z, x, y, pixelRatio, sourceProjection);
-          }, this), this.reprojectionErrorThreshold_,
+          }.bind(this), this.reprojectionErrorThreshold_,
           this.renderReprojectionEdges_);
 
       cache.set(tileCoordKey, tile);
diff --git a/src/ol/source/tilejsonsource.js b/src/ol/source/tilejsonsource.js
index 812a5c967b..572b2d06e1 100644
--- a/src/ol/source/tilejsonsource.js
+++ b/src/ol/source/tilejsonsource.js
@@ -45,8 +45,8 @@ ol.source.TileJSON = function(options) {
 
   if (options.jsonp) {
     var request = new goog.net.Jsonp(options.url);
-    request.send(undefined, goog.bind(this.handleTileJSONResponse, this),
-        goog.bind(this.handleTileJSONError, this));
+    request.send(undefined, this.handleTileJSONResponse.bind(this),
+        this.handleTileJSONError.bind(this));
   } else {
     var xhr = new goog.net.XhrIo(new goog.net.CorsXmlHttpFactory());
     goog.events.listen(xhr, goog.net.EventType.COMPLETE, function(e) {
diff --git a/src/ol/source/tileutfgridsource.js b/src/ol/source/tileutfgridsource.js
index dd2ae4bd08..d35cbe983b 100644
--- a/src/ol/source/tileutfgridsource.js
+++ b/src/ol/source/tileutfgridsource.js
@@ -50,7 +50,7 @@ ol.source.TileUTFGrid = function(options) {
   this.template_ = undefined;
 
   var request = new goog.net.Jsonp(options.url);
-  request.send(undefined, goog.bind(this.handleTileJSONResponse, this));
+  request.send(undefined, this.handleTileJSONResponse.bind(this));
 };
 goog.inherits(ol.source.TileUTFGrid, ol.source.Tile);
 
@@ -361,8 +361,8 @@ ol.source.TileUTFGridTile_.prototype.loadInternal_ = function() {
   if (this.state == ol.TileState.IDLE) {
     this.state = ol.TileState.LOADING;
     var request = new goog.net.Jsonp(this.src_);
-    request.send(undefined, goog.bind(this.handleLoad_, this),
-                 goog.bind(this.handleError_, this));
+    request.send(undefined, this.handleLoad_.bind(this),
+                 this.handleError_.bind(this));
   }
 };
 
diff --git a/src/ol/source/tilewmssource.js b/src/ol/source/tilewmssource.js
index f83c9251e3..a379748288 100644
--- a/src/ol/source/tilewmssource.js
+++ b/src/ol/source/tilewmssource.js
@@ -46,7 +46,7 @@ ol.source.TileWMS = function(opt_options) {
     reprojectionErrorThreshold: options.reprojectionErrorThreshold,
     tileGrid: options.tileGrid,
     tileLoadFunction: options.tileLoadFunction,
-    tileUrlFunction: goog.bind(this.tileUrlFunction_, this),
+    tileUrlFunction: this.tileUrlFunction_.bind(this),
     url: options.url,
     urls: options.urls,
     wrapX: options.wrapX !== undefined ? options.wrapX : true
diff --git a/src/ol/style/circlestyle.js b/src/ol/style/circlestyle.js
index 375156331d..baae435366 100644
--- a/src/ol/style/circlestyle.js
+++ b/src/ol/style/circlestyle.js
@@ -291,12 +291,12 @@ ol.style.Circle.prototype.render_ = function(atlasManager) {
     if (hasCustomHitDetectionImage) {
       // render the hit-detection image into a separate atlas image
       renderHitDetectionCallback =
-          goog.bind(this.drawHitDetectionCanvas_, this, renderOptions);
+          this.drawHitDetectionCanvas_.bind(this, renderOptions);
     }
 
     var id = this.getChecksum();
     var info = atlasManager.add(
-        id, size, size, goog.bind(this.draw_, this, renderOptions),
+        id, size, size, this.draw_.bind(this, renderOptions),
         renderHitDetectionCallback);
     goog.asserts.assert(info, 'circle radius is too large');
 
diff --git a/src/ol/style/regularshapestyle.js b/src/ol/style/regularshapestyle.js
index 8b4b680ff0..b8b1dd457a 100644
--- a/src/ol/style/regularshapestyle.js
+++ b/src/ol/style/regularshapestyle.js
@@ -371,12 +371,12 @@ ol.style.RegularShape.prototype.render_ = function(atlasManager) {
     if (hasCustomHitDetectionImage) {
       // render the hit-detection image into a separate atlas image
       renderHitDetectionCallback =
-          goog.bind(this.drawHitDetectionCanvas_, this, renderOptions);
+          this.drawHitDetectionCanvas_.bind(this, renderOptions);
     }
 
     var id = this.getChecksum();
     var info = atlasManager.add(
-        id, size, size, goog.bind(this.draw_, this, renderOptions),
+        id, size, size, this.draw_.bind(this, renderOptions),
         renderHitDetectionCallback);
     goog.asserts.assert(info, 'shape size is too large');