cuando el mapa se mueve movido por el usuario, haga desaparecer los marcadores de posición antiguos y muestre nuevos marcadores.

Para un ejemplo, puede verificar estomap. Los marcadores se mueven cada vez que se actualizan los límites y se borran los marcadores de posición anteriores. Estoy tratando exactamente de hacer esto.

ACTUALIZADO 2

lo que he hecho hasta ahora está justo debajo. No hay errores, pero sigo viendo todos los marcadores a la vez ...

data(){
     return {
        bounds:{},
        map: {},
        mapName: "map",
        estates: [], 
     }
},
mounted() {
    axios.get('/ajax').then((response) => {
        this.estates =  response.data
        this.insertMarkers();
    });
    this.initMap();

},
methods: {

            initMap: function() {

        this.bounds = new google.maps.LatLngBounds(
            new google.maps.LatLng(34.652500, 135.506302),
        );

        var mapOptions = {
            mapTypeId: 'roadmap',
            center: new google.maps.LatLng(0, 0),
            zoom: 8
        };


        let self = this;

        this.map = new google.maps.Map(document.getElementById(this.mapName), mapOptions);

        var boundsListener = google.maps.event.addListener((this.map), 'bounds_changed', function(event) {

            self.getMarkers();

        });

        this.map.fitBounds(this.bounds);
    },

    getMarkers: function() {

        let bounds = this.map.getBounds();

        let southWest = bounds.getSouthWest();
        let northEast = bounds.getNorthEast();
        console.log(southWest);

        axios.get('/ajax', {
            params: {
                fromLat: southWest.lat()-0.01,
                toLat: northEast.lat()-0.01,
                fromLng: southWest.lng()+0.01,
                toLng: northEast.lng()+0.01,
            }
        }).then((response) => {
            this.estates = response.data;
            this.updateMarkers();
        });

    },

    updateMarkers: function() {


        google.maps.event.addListener(map, 'idle', function() {

            var map = this.map;
            var estates = this.estates;
            let i = 0;

            for (i = 0; i < this.markers.length; i++) {
                this.markers[i].setMap(null);
            }

            this.markers = [];

            for (i = 0; i < estates.length; i++) {

                var position = new google.maps.LatLng(estates[i].lat, estates[i].lng);

                var marker = new google.maps.Marker({
                    position: position,
                    map: map,
                    label: {
                        text:
                            estates[i].price.toString().length == 1 ?
                            estates[i].price.toString().replace("1", "未定") :
                            estates[i].price.toString() + "万",
                        color: '#fff',
                    },
                    icon: '/img/marker.png',
                    url: "/pages/" + estates[i].id,
                });

                this.markers.push(marker);

                google.maps.event.addListener(marker, 'click', function () {
                    window.location.href = this.url;
               });
            }
        });
    },