From a7bdee43b310eb6f428204981bbbf760e01b76c7 Mon Sep 17 00:00:00 2001
From: mike-000 <49240900+mike-000@users.noreply.github.com>
Date: Sun, 26 Jan 2020 13:51:11 +0000
Subject: [PATCH 1/2] Fix ol/layer/Graticule rendercomplete problem

Use custom loading strategy to avoid problems caused by calling removeLoadedExtent in the loader function
---
 src/ol/layer/Graticule.js | 32 +++++++++++++++++++++++---------
 1 file changed, 23 insertions(+), 9 deletions(-)

diff --git a/src/ol/layer/Graticule.js b/src/ol/layer/Graticule.js
index 9287cbb7fc..9170814aa2 100644
--- a/src/ol/layer/Graticule.js
+++ b/src/ol/layer/Graticule.js
@@ -19,7 +19,6 @@ import {getCenter, intersects, equals, getIntersection, isEmpty} from '../extent
 import {clamp} from '../math.js';
 import Style from '../style/Style.js';
 import Feature from '../Feature.js';
-import {bbox} from '../loadingstrategy.js';
 import {meridian, parallel} from '../geom/flat/geodesic.js';
 import GeometryLayout from '../geom/GeometryLayout.js';
 import Point from '../geom/Point.js';
@@ -391,7 +390,7 @@ class Graticule extends VectorLayer {
     this.setSource(
       new VectorSource({
         loader: this.loaderFunction.bind(this),
-        strategy: bbox,
+        strategy: this.strategyFunction.bind(this),
         features: new Collection(),
         overlaps: false,
         useSpatialIndex: false,
@@ -414,6 +413,11 @@ class Graticule extends VectorLayer {
       stroke: this.strokeStyle_
     });
 
+    /**
+     * @type {?import("../extent.js").Extent}
+     */
+    this.loadedExtent_ = null;
+
     /**
      * @type {?import("../extent.js").Extent}
      */
@@ -421,7 +425,21 @@ class Graticule extends VectorLayer {
 
     this.setRenderOrder(null);
 
-    this.tmpExtent_ = null;
+  }
+
+  /**
+   * Strategy function for loading features based on the view's extent and
+   * resolution.
+   * @param {import("./extent.js").Extent} extent Extent.
+   * @param {number} resolution Resolution.
+   * @return {Array<import("./extent.js").Extent>} Extents.
+   */
+  strategyFunction(extent, resolution) {
+    if (this.loadedExtent_ && !equals(this.loadedExtent_, extent)) {
+      // we should not keep track of loaded extents
+      this.getSource().removeLoadedExtent(this.loadedExtent_);
+    }
+    return [extent];
   }
 
   /**
@@ -431,16 +449,12 @@ class Graticule extends VectorLayer {
    * @param {import("../proj/Projection.js").default} projection Projection
    */
   loaderFunction(extent, resolution, projection) {
+    this.loadedExtent_ = extent;
     const source = this.getSource();
 
     // only consider the intersection between our own extent & the requested one
     const layerExtent = this.getExtent() || [-Infinity, -Infinity, Infinity, Infinity];
-    const renderExtent = getIntersection(layerExtent, extent, this.tmpExtent_);
-
-    // we should not keep track of loaded extents
-    setTimeout(function() {
-      source.removeLoadedExtent(extent);
-    }, 0);
+    const renderExtent = getIntersection(layerExtent, extent);
 
     if (this.renderedExtent_ && equals(this.renderedExtent_, renderExtent)) {
       return;

From e820042748e4b45712f241b1ad9169a68a5bcb05 Mon Sep 17 00:00:00 2001
From: mike-000 <49240900+mike-000@users.noreply.github.com>
Date: Sun, 26 Jan 2020 14:04:05 +0000
Subject: [PATCH 2/2] Fix ol/layer/Graticule rendercomplete problem

fix typedef imports
---
 src/ol/layer/Graticule.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/ol/layer/Graticule.js b/src/ol/layer/Graticule.js
index 9170814aa2..0c5e34f6e7 100644
--- a/src/ol/layer/Graticule.js
+++ b/src/ol/layer/Graticule.js
@@ -430,9 +430,9 @@ class Graticule extends VectorLayer {
   /**
    * Strategy function for loading features based on the view's extent and
    * resolution.
-   * @param {import("./extent.js").Extent} extent Extent.
+   * @param {import("../extent.js").Extent} extent Extent.
    * @param {number} resolution Resolution.
-   * @return {Array<import("./extent.js").Extent>} Extents.
+   * @return {Array<import("../extent.js").Extent>} Extents.
    */
   strategyFunction(extent, resolution) {
     if (this.loadedExtent_ && !equals(this.loadedExtent_, extent)) {