echarts地图放大会出现空白echarts effectScatter配置项内容和展示

在地图进行放大缩小的时候会出现空白和闪屏,应该怎么处理这个问题才能不出现空白

配置项如下
      var provinceData = [{
			"name": "北京",
			"value": 95
		},
		{
			"name": "天津",
			"value": 95
		},
		{
			"name": "石家庄",
			"value": 95
		},
		{
			"name": "太原",
			"value": 95
		},
		{
			"name": "呼和浩特",
			"value": 95
		},
		{
			"name": "沈阳",
			"value": 95
		},
		{
			"name": "长春",
			"value": 95
		},
		{
			"name": "哈尔滨",
			"value": 95
		},
		{
			"name": "上海",
			"value": 95
		},
		{
			"name": "南京",
			"value": 95
		},
		{
			"name": "杭州",
			"value": 95
		},
		{
			"name": "合肥",
			"value": 95
		},
		{
			"name": "福州",
			"value": 95
		},
		{
			"name": "南昌",
			"value": 95
		},
		{
			"name": "济南",
			"value": 95
		},
		{
			"name": "郑州",
			"value": 95
		},
		{
			"name": "武汉",
			"value": 95
		},
		{
			"name": "长沙",
			"value": 95
		},
		{
			"name": "广州",
			"value": 95
		},
		{
			"name": "南宁",
			"value": 95
		},
		{
			"name": "海口",
			"value": 95
		},
		{
			"name": "重庆",
			"value": 95
		},
		{
			"name": "成都",
			"value": 95
		},
		{
			"name": "贵阳",
			"value": 95
		},
		{
			"name": "昆明",
			"value": 95
		},
		{
			"name": "拉萨",
			"value": 95
		},
		{
			"name": "西安",
			"value": 95
		},
		{
			"name": "兰州",
			"value": 95
		},
		{
			"name": "西宁",
			"value": 95
		},
		{
			"name": "银川",
			"value": 95
		},
		{
			"name": "乌鲁木齐",
			"value": 95
		},
		{
			"name": "香港",
			"value": 95
		},
		{
			"name": "澳门",
			"value": 95
		},
		{
			"name": "台北",
			"value": 95
		}
	]
var geoCoordMap = {
    "北京": [116.41667, 39.91667],
    "天津": [117.20000, 39.13333],
    "石家庄": [114.48333, 38.03333],
    "太原": [112.53333, 37.86667],
    "呼和浩特": [111.41, 40.48],
    "沈阳": [123.38333, 41.80000],
    "长春": [125.35000, 43.88333],
    "哈尔滨": [126.63333, 45.75000],
    "上海": [121.47, 31.23],
    "南京": [118.78333, 32.05000],
    "杭州": [120.20000, 30.26667],
    "合肥": [117.17, 31.52],
    "福州": [119.30000, 26.08333],
    "南昌": [115.90000, 28.68333],
    "济南": [117.00, 36.40],
    "郑州": [113.65000, 34.76667],
    "武汉": [114.31667, 30.51667],
    "长沙": [113.00000, 28.21667],
    "广州": [113.23333, 23.16667],
    "南宁": [108.19, 22.48],
    "海口": [110.35000, 20.01667],
    "重庆": [106.45000, 29.56667],
    "成都": [104.06667, 30.66667],
    "贵阳": [106.71667, 26.56667],
    "昆明": [102.73333, 25.05000],
    "拉萨": [91.00000, 29.60000],
    "西安": [108.95000, 34.26667],
    "兰州": [103.73333, 36.03333],
    "西宁": [101.75000, 36.56667],
    "银川": [106.26667, 38.46667],
    "乌鲁木齐": [87.68333, 43.76667],
    "香港": [114.10000, 22.20000],
    "澳门": [113.50000, 22.20000],
    "台北": [121.30, 25.03]
}
var redData = [{
        TERMINALID: 5160,
        LNG: "114.63542833",
        LAT: "38.85213000"
    },
    {
        TERMINALID: 5159,
        LNG: "117.40644333",
        LAT: "36.70698000"
    },
    {
        TERMINALID: 5198,
        LNG: "119.00581500",
        LAT: "36.74808500"
    },
    {
        TERMINALID: 5063,
        LNG: "121.56084333",
        LAT: "28.53989333"
    },
    {
        TERMINALID: 4949,
        LNG: "127.04210333",
        LAT: "48.92415667"
    },
    {
        TERMINALID: 4569,
        LNG: "119.80362833",
        LAT: "36.28255333"
    },
    {
        TERMINALID: 5013,
        LNG: "110.53226833",
        LAT: "39.41139667"
    },
    {
        TERMINALID: 5187,
        LNG: "116.90111833",
        LAT: "36.34795333"
    },
    {
        TERMINALID: 4884,
        LNG: "100.49562833",
        LAT: "25.99675667"
    },
    {
        TERMINALID: 5057,
        LNG: "110.15494833",
        LAT: "21.05169500"
    },
    {
        TERMINALID: 4972,
        LNG: "119.19481667",
        LAT: "36.69799833"
    },
    {
        TERMINALID: 4666,
        LNG: "121.23984000",
        LAT: "31.21873833"
    },
    {
        TERMINALID: 4709,
        LNG: "114.30411500",
        LAT: "39.45558500"
    },
    {
        TERMINALID: 5167,
        LNG: "116.78687000",
        LAT: "35.85875000"
    },
    {
        TERMINALID: 4506,
        LNG: "121.74533167",
        LAT: "31.12406500"
    },
    {
        TERMINALID: 5016,
        LNG: "106.80564833",
        LAT: "33.06385500"
    }
]
var optionData = {
    x: 0,
    y: 15,
    zoom: 3
};
var bmap = {
    center: [optionData.x, optionData.y],
    zoom: optionData.zoom,
    roam: 'scale',
    mapStyle: {
        styleJson: [{
                "featureType": "water",
                "elementType": "all",
                "stylers": {
                    //						"color": "#07243dff"
                    "color": "#051625ff"
                }
            },
            {
                "featureType": "highway",
                "elementType": "geometry.fill",
                "stylers": {
                    "color": "#07243dff",
                    "visibility": "off"
                }
            },
            {
                "featureType": "highway",
                "elementType": "geometry.stroke",
                "stylers": {
                    "color": "#147a92",
                    "visibility": "off"
                }
            },
            {
                "featureType": "arterial",
                "elementType": "geometry.fill",
                "stylers": {
                    "color": "#000000",
                    "visibility": "off"
                }
            },
            {
                "featureType": "arterial",
                "elementType": "geometry.stroke",
                "stylers": {
                    "color": "#0b3d51",
                    "visibility": "off"
                }
            },
            {
                "featureType": "local",
                "elementType": "geometry",
                "stylers": {
                    "color": "#000000",
                    "visibility": "off"
                }
            },
            {
                "featureType": "land",
                "elementType": "all",
                "stylers": {
                    //						"color": "#295a84"
                    "color": "#092742"
                }
            },
            {
                "featureType": "railway",
                "elementType": "geometry.fill",
                "stylers": {
                    "color": "#000000"
                }
            },
            {
                "featureType": "railway",
                "elementType": "geometry.stroke",
                "stylers": {
                    "color": "#08304b",
                    "visibility": "off"
                }
            },
            {
                "featureType": "subway",
                "elementType": "geometry",
                "stylers": {
                    "lightness": -70,
                    "visibility": "off"
                }
            },
            {
                "featureType": "building",
                "elementType": "geometry.fill",
                "stylers": {
                    "color": "#000000",
                    "visibility": "off"
                }
            },
            {
                "featureType": "all",
                "elementType": "labels.text.fill",
                "stylers": {
                    "color": "#2d5e88ff"
                }
            },
            {
                "featureType": "all",
                "elementType": "labels.text.stroke",
                "stylers": {
                    "color": "#08253fff"
                }
            },
            {
                "featureType": "building",
                "elementType": "geometry",
                "stylers": {
                    "color": "#022338"
                }
            },
            {
                "featureType": "green",
                "elementType": "geometry",
                "stylers": {
                    "color": "#062032"
                }
            },
            {
                "featureType": "boundary",
                "elementType": "geometry.fill",
                "stylers": {
                    "color": "#6290b7ff"
                }
            },
            {
                "featureType": "poi",
                "elementType": "all",
                "stylers": {
                    "visibility": "off"
                }
            },
            {
                "featureType": "all",
                "elementType": "labels.icon",
                "stylers": {
                    "visibility": "off"
                }
            },
            {
                "featureType": "all",
                "elementType": "labels.text.fill",
                "stylers": {
                    "color": "#2da0c6",
                    "visibility": "on"
                }
            },
            {
                "featureType": "boundary",
                "elementType": "geometry.stroke",
                "stylers": {
                    "color": "#08253fff"
                }
            }
        ]
    }
}
option = {
    bmap: bmap,
    backgroundColor: 'transparent',
    geo: {
        map: 'bmap',
    },
    series: [
        {
            type: 'effectScatter',
            coordinateSystem: 'bmap',
            zlevel: 2,
            rippleEffect: {
                brushType: 'stroke'
            },
            label: {
                normal: {
                    show: true,
                    position: 'right',
                    formatter: '{b}'
                }
            },
            symbolSize: function(val) {
                return val[2] / 10;
            },
            showEffectOn: 'render',
            itemStyle: {
                /*color: "#dd3a03"*/
                color: "#e3e5e9"
            },
            data: provinceData.map(function(dataItem) {
                return {
                    name: dataItem.name,
                    value: geoCoordMap[dataItem.name].concat(80)
                };
            })
        },
        {
            type: 'scatter',
            coordinateSystem: 'bmap',
            zlevel: 2,
            rippleEffect: {
                brushType: 'stroke'
            },
            symbolSize: 8,
            itemStyle: {
                color: "#dd3a03"
            },
            hoverAnimation: false,
            emphasis: {
                itemStyle: {
                    color: "#fa0500",
                    shadowBlur: 15,
                    shadowColor: '#fa0605'
                }
            },
            large: true,
            data: redData.map(function(dataItem) {
                return {
                    name: dataItem.TERMINALID,
                    value: [dataItem.LNG, dataItem.LAT, 80]
                };
            })
        }
    ]
};
    
截图如下