Javascript GoogleMaps JS API在随机时间后崩溃到白色/灰色屏幕

我正在制作一个包含Web视图的JavaFX应用程序。web视图加载一个HTML/JavaScript页面，显示使用JSAPI的Google地图

我的JavaFX应用程序监听另一个库，该库返回诸如纬度/经度数据之类的统计数据，然后我定期（每秒左右）在Google地图上绘制这些数据。通过从上一个打印到新打印绘制多段线和/或创建另一个标记来打印这些图形。这是通过调用

webView.getEngine（）.executeScript（“…一些脚本，加上参数…”）来完成的

这对于20分钟到1.5小时之间的任何时间都非常有效，但谷歌地图似乎是随机的，它会突然完全不渲染地图，而只是稍微变白一点。在此之后，谷歌地图将不会“恢复”

这就是窗口的外观

工作


撞车


每秒执行一次的Java代码是：

public void moveMapImage(float lati, float longi)
{


    final float finalLati = lati;
    final float finalLongi = longi;

    if(webView.getEngine().getLoadWorker().getState().equals(Worker.State.SUCCEEDED))
    {
        Platform.runLater(new Runnable(){
            public void run()
            {
                if(!viewingRoute){webView.getEngine().executeScript("moveTo("+finalLati+", "+finalLongi+")");}//Only move camera if not viewing route
                else{webView.getEngine().executeScript("addToPolyLine("+finalLati+", "+finalLongi+")");}
            }
         });
    }
}

上述代码每秒调用一次的JS代码是：

      function moveTo(lati, longi)
      {
        var latLng = new google.maps.LatLng(lati, longi, true); 
        map.panTo(latLng);
        addToPolyLine(lati, longi);
      }

      function addToPolyLine(lati,longi)
      { 
        var newLatLng = new google.maps.LatLng(lati, longi);
        previousLatLong = newLatLng;
        path.getPath().push(newLatLng);     

        if(allMarkers.length <= 0) //Add start marker
        {
            placeStartStopMarker(lati, longi);
        }

        if(google.maps.geometry.spherical.computeDistanceBetween(previousMarker, newLatLng) >= mileSymbolDistance) //Add Interval Markers
        {
            previousMarker = newLatLng;
            var marker = new google.maps.Marker({
                position: newLatLng,
                map: map,
                icon: diamondSymbolDistMarker,
                title: 'Distance Marker'
              });

              allMarkers.push(marker);
        }

      }

功能移动到（纬度、经度）
{
var latLng=新的google.maps.latLng（lati、longi、true）；
panTo地图（拉丁美洲）；
addToPolyLine（纬度、经度）；
}
功能addToPolyLine（纬度、经度）
{ 
var newLatLng=newgoogle.maps.LatLng（lati，longi）；
previousLatLong=newLatLng；
path.getPath（）.push（newLatLng）；
if（allMarkers.length=mileSymbolDistance）//添加间隔标记
{
先前标记=新标记；
var marker=new google.maps.marker({
职位：newLatLng，
地图：地图，
图标：diamondSymbolDistMarker，
标题：“距离标记”
});
所有标记。推（标记）；
}
}

Java控制台中根本没有返回错误

我可能做错了什么？
有没有可能我把地图平移到一个新位置的次数太多了

编辑：我的整个谷歌地图JS代码：
var映射；
var mapTypeToUse=google.maps.MapTypeId.SATELLITE；
var pathCoords=[]；
var路径；
var zoomLevel=15；
var mileSymbolDistance=10；
var-previousLatLong；
var映射选项；
var-previousMarker=new google.maps.LatLng（50.7682405,0.2971879）；
变异标记；
变量linecolourouse='#FF0000'；
var-allMarkers=[]；
var invisibleMarker={path:'M-1,0 0，-11,0,1 z'，strokeColor:'#F00'，fillColor:'#F00'，fillOpacity:0}；
var diamondSymbolDistMarker={path:'M-6,0 0，-6,0,6 z'，strokeColor:'#F00'，fillColor:'#F00'，fillOpacity:1}；
var diamondSymbolStopMarker={path:'M-10,5 10,5 10，-5-10，-5 z'，strokeColor:'#F00'，fillColor:'#F00'，fillOpacity:1}；
var diamondSymbolStart={path:'M-10,0-10,0,10 z'，strokeColor:'0CF27D'，fillColor:'0CF27D'，fillOpacity:0.8}；
函数初始化（）{
initializeNewMap（）；
路径=新的google.maps.Polyline({
路径：pathCoords，
测地线：正确，
strokeColor:linecolourouse，
笔划不透明度：1.0，
冲程重量：2
});
setMap（map）；
//previousMarker=（新的google.maps.LatLng（0,0））；
}
函数initializeNewMap（）
{
变量映射选项={
中间：先前的标记，
zoom:zoomLevel，
mapTypeId:mapTypeToUse，
可拖动：错误，
disableDefaultUI:true，
动物控制：错误
};
map=new google.maps.map（document.getElementById（“map_canvas”），
地图选项）；
}
函数伊斯特本（）
{
var mapOptions={center:new google.maps.LatLng（50.7682405,0.2971879），zoom:zoomLevel，mapTypeId:google.maps.mapTypeId.SATELLITE
};
map=new google.maps.map（document.getElementById（“map_canvas”），
地图选项）；
}
功能移动到（纬度、经度）
{
var latLng=新的google.maps.latLng（lati、longi、true）；
panTo地图（拉丁美洲）；
addToPolyLine（纬度、经度）；
}
函数clearPolyLines（）
{
path.setMap（空）；
路径=新的google.maps.Polyline({
路径：pathCoords，
测地线：正确，
strokeColor:linecolourouse，
笔划不透明度：1.0，
冲程重量：2
});
setMap（map）；
previousMarker=（新的google.maps.LatLng（0,0））；
clearMarkers（）；
}
函数clearMarkers（）
{
对于（var i=0；i4）
{
var markerlatng=新的google.maps.LatLng（lati，longi）；
//var angleValue=（google.maps.geometry.spheremic.computeHeading（path.getPath（）.getLength（）-2，path.getPath（）.getLength（）.getAt（path.getPath（）.getLength（）-3））+（google.maps.geometry.spheremic.computeHeading（path.getPath（）.getLength（）-1，path.getPath（）.getLength（）.getAt（path.getPath.getPath（）.getLength（）.getLength
var map;
var mapTypeToUse = google.maps.MapTypeId.SATELLITE;
var pathCoords = [];
var path;
var zoomLevel = 15;
var mileSymbolDistance = 10;
var previousLatLong;

var mapOptions;
var previousMarker = new google.maps.LatLng(50.7682405,0.2971879);
var curMarker;
var lineColourToUse = '#FF0000';
var allMarkers = [];
var invisibleMarker = {path: 'M -1,0 0,-1 1,0 0,1 z',strokeColor: '#F00',fillColor: '#F00',fillOpacity: 0};
var diamondSymbolDistMarker = {path: 'M -6,0 0,-6 6,0 0,6 z',strokeColor: '#F00',fillColor: '#F00',fillOpacity: 1};
var diamondSymbolStopMarker = {path: 'M -10,5 10,5 10,-5 -10,-5 z',strokeColor: '#F00',fillColor: '#F00',fillOpacity: 1};
var diamondSymbolStart = {path: 'M -10,0 0,-10 10,0 0,10 z',strokeColor: '#0CF27D',fillColor: '#0CF27D',fillOpacity: 0.8};


    function initialize() {
        initializeNewMap();

        path = new google.maps.Polyline({
        path: pathCoords,
        geodesic: true,
        strokeColor: lineColourToUse,
        strokeOpacity: 1.0,
        strokeWeight: 2
        });
        path.setMap(map);

        //previousMarker = (new google.maps.LatLng(0, 0));
    }

    function initializeNewMap()
    {
        var mapOptions = {
          center: previousMarker,
          zoom: zoomLevel,
          mapTypeId: mapTypeToUse,
          draggable: false,
          disableDefaultUI: true,
          zoomControl: false
        };
        map = new google.maps.Map(document.getElementById("map_canvas"),
            mapOptions);
    }

      function eastbourne()
      {
          var mapOptions = {center: new google.maps.LatLng(50.7682405,0.2971879),zoom: zoomLevel,mapTypeId: google.maps.MapTypeId.SATELLITE 
            };
            map = new google.maps.Map(document.getElementById("map_canvas"),
                mapOptions);
      }

      function moveTo(lati, longi)
      {
        var latLng = new google.maps.LatLng(lati, longi, true); 
        map.panTo(latLng);
        addToPolyLine(lati, longi);
      }

      function clearPolyLines()
      {
            path.setMap(null);
            path = new google.maps.Polyline({
            path: pathCoords,
            geodesic: true,
            strokeColor: lineColourToUse,
            strokeOpacity: 1.0,
            strokeWeight: 2

            });
            path.setMap(map);


            previousMarker = (new google.maps.LatLng(0, 0));
            clearMarkers();
      }

      function clearMarkers()
      {
        for (var i = 0; i < allMarkers.length; i++) {
        allMarkers[i].setMap(null);
        }
        allMarkers = [];
      }

      function addToPolyLine(lati,longi)
      { 
        var newLatLng = new google.maps.LatLng(lati, longi);
        previousLatLong = newLatLng;
        path.getPath().push(newLatLng);
        //previousMarker = new google.maps.LatLng(lati, longi);
        //console.log(google.maps.geometry.spherical.computeDistanceBetween(previousMarker, newLatLng));

        if(allMarkers.length <= 0) //Add start marker
        {
            placeStartStopMarker(lati, longi);
        }

        if(google.maps.geometry.spherical.computeDistanceBetween(previousMarker, newLatLng) >= mileSymbolDistance) //Add Interval Markers
        {
            previousMarker = newLatLng;
            var marker = new google.maps.Marker({
                position: newLatLng,
                map: map,
                icon: diamondSymbolDistMarker,
                title: 'Distance Marker'
              });

              allMarkers.push(marker);
        }

      }

      function addStationStopMarker(lati, longi)
      {
            if(path.getPath().getLength() > 4)
            {
                var markerLatLng = new google.maps.LatLng(lati, longi);
                //var angleValue = (google.maps.geometry.spherical.computeHeading(path.getPath().getAt(path.getPath().getLength()-2,path.getPath().getAt(path.getPath().getLength()-3))) + (google.maps.geometry.spherical.computeHeading(path.getPath().getAt(path.getPath().getLength()-1,path.getPath().getAt(path.getPath().getLength()-2))) + (google.maps.geometry.spherical.computeHeading(markerLatLng,path.getPath().getAt(path.getPath().getLength()-1))) / 3; //Gets the mean of the last three points - hopefully this will be more accurate!
                var angleValue = google.maps.geometry.spherical.computeHeading(markerLatLng,path.getPath().getAt(path.getPath().getLength()-1));
                var rotatedStopMarker = {path: 'M -10,5 10,5 10,-5 -10,-5 z',strokeColor: lineColourToUse,fillColor: lineColourToUse,fillOpacity: 1, rotation: angleValue};
                var marker = new google.maps.Marker({
                        position: markerLatLng,
                        map: map,
                        icon: rotatedStopMarker,
                        title: 'Stop Marker'
                      });

                      allMarkers.push(marker);
                }

      }

      function zoomIn(amount)
      {
            zoomLevel+=amount;
            if(zoomLevel <= 1){zoomLevel = 1;}
            else if(zoomLevel > 20){zoomLevel = 20;}
            map.setZoom(zoomLevel);
      }

      function setZoomLevel(amount)
      {
        zoomLevel=amount;
        //map.setZoom(zoomLevel);
      }

    function setMileSymbolDistance(value)
    {
        mileSymbolDistance = value;
    }

    function setMapType(id)
    {
        if(id == 1){mapTypeToUse = google.maps.MapTypeId.ROADMAP;}
        else if(id == 2){mapTypeToUse = google.maps.MapTypeId.HYBRID ;}
        else if(id == 3){mapTypeToUse = google.maps.MapTypeId.TERRAIN ;}
        else{mapTypeToUse = google.maps.MapTypeId.SATELLITE;}
        initializeNewMap();
        path.setMap(map);
        for (var i = 0; i < allMarkers.length; i++) {
        allMarkers[i].setMap(map);
        }
    }

    function zoomToFitRoute()
    {
        //if(allMarkers.length >= 2){
            addInvisMarkerAt(previousLatLong);
            var bounds = new google.maps.LatLngBounds();
            for(i=0;i<allMarkers.length;i++) {
             bounds.extend(allMarkers[i].getPosition());
            }

            map.fitBounds(bounds);
        //}

    }

    function addInvisMarkerAt(latlong)
    {
        var marker = new google.maps.Marker({
            position: latlong,
            map: map,
            icon: invisibleMarker,
            title: 'Invisible Marker'
          });

          allMarkers.push(marker);
    }

    function placeStartStopMarker(lati, longi)
    {
        var marker = new google.maps.Marker({
                    position:  new google.maps.LatLng(lati, longi),
                    map: map,
                    icon: diamondSymbolStart,
                    title: 'Start/Stop Marker'
                  });

                  allMarkers.push(marker);
    }

    function finishRoute(lati, longi)
    {
        placeStartStopMarker(lati, longi)
        zoomToFitRoute();
    }

    function setLineColour(newColour)
    {
        lineColourToUse = "#"+newColour;
        diamondSymbolDistMarker = {path: 'M -6,0 0,-6 6,0 0,6 z',strokeColor: lineColourToUse,fillColor: lineColourToUse,fillOpacity: 1};
        diamondSymbolStopMarker = {path: 'M -10,5 10,5 10,-5 -10,-5 z',strokeColor: lineColourToUse,fillColor: lineColourToUse,fillOpacity: 1};
        clearPolyLines();
    }