lodashデバウンスが機能しない（間違って使用していますか？）、関数が複数回呼び出されました

更新：自分で答えた。最後までスクロールします。

私の目的は単純です：

私はグーグルマップのキャンバスを持っています。ユーザーはマップをドラッグでき、プログラムはマップの中心付近のインシデントを自動的にダウンロードします（そしてマーカーを描画します）。

plugin.google.maps.event.CAMERA_CHANGEイベント用のこのリスナーがあります。重要なのは、このリスナーは複数回トリガーするということです。意味：キャンバスを指でタップしたときから->キャンバスをドラッグして->指を離したときまで...イベントは複数回トリガーされます。指を離したときだけではありません。どうやらそれはNミリ秒ごとにトリガーするウォッチャーを持っています。

これらの暫定的なcamera_changesの間に、サーバーからのコストのかかるデータのダウンロードとマーカーの描画をコードで実行したくありません。ユーザーがドラッグを停止した後でのみ実行したいと思います。つまり、5秒間に受信した最後のカメラ変更イベントで（最も遅いユーザーがキャンバスの隅から反対側の隅にドラッグするのに5秒かかることがわかりました）。

明らかに、私はこの必要性のためにデバウンスに目を向けます。しかし、それはうまくいかないようです。ログ（X1、X2）....から、関数が複数回呼び出されることがわかります（約3〜4回、キャンバス上をドラッグする速度によって異なります）。

確かに、彼らは私がドラッグをやめた後にのみ呼び出されます。しかし、それらは連続して呼び出されます。それらのすべての3-4。呼び出しの間に5秒の遅延があります。

それは私が期待したものではありません。また、.cancelメソッドに呼び出しを追加しました（これは不要だと思います...正しく理解していれば、デバウンスはすでにそれを処理しているはずです。タイムアウト内に中間呼び出しをキャンセルします）。

スロットルも試しました（概念的には答えではないと思います。デバウンスが答えになるはずです）。とにかく、スロットルと同じ問題。

だから、私の質問：私はどこで間違ったことをしましたか（lodashのデバウンスを使用する際に）？

ありがとう！

        var currentPosition = initialPosition();
        drawMarkersAroundCenter(map, currentPosition);

        var reactOnCameraChanged = function(camera) {
          console.log('X1');

          console.log('-----');
          console.log(JSON.stringify(camera.target));
          console.log(JSON.stringify(currentPosition));
          console.log('-----');

          if (camera.target.lat == currentPosition.lat && camera.target.lng == currentPosition.lng) {
            return;
          }

          currentPosition = camera.target;
          drawMarkersAroundCenter(map, currentPosition);
        }

        var debouncedReactOnCameraChange = lodash.debounce(reactOnCameraChanged, 5000, {
          'leading': false,
          'trailing': true
        });

        map.on(plugin.google.maps.event.CAMERA_CHANGE, function(camera) {
          debouncedReactOnCameraChange.cancel();
          debouncedReactOnCameraChange(camera);
        });

---更新---

nodejsコンソールでデバウンスを使用する非常に単純化されたシナリオを試しましたが、期待どおりに機能します。以下のコードでは.cancelも呼び出しません。では、上記のコードの何が問題になっていますか？下の画像では、この簡略化されたコードとの違いはわかりません。

更新

「reactOnCameraChanged」の代わりにこの男メソッドを試してみました：

        var dude = function(camera) {
          console.log('dude');
        }

        var debouncedReactOnCameraChange = lodash.debounce(dude, 5000, {
          'leading': false,
          'trailing': true
        });

また、.cancelへの呼び出しも削除しました。

        map.on(plugin.google.maps.event.CAMERA_CHANGE, function(camera) {
          //debouncedReactOnCameraChange.cancel();
          debouncedReactOnCameraChange(camera);
        });

'dude'がその5秒間に1回だけ出力されるのを見ることができます....だから..、reactOnCameraChanged内で行ったことが干渉を引き起こしています...どういうわけか....

解決済み：

以下の回答を参照してください。