feat: add tilesLoaded event listener to manage overlay visibility based on map zoom level

src/pages/Home.js

@@ -268,6 +268,12 @@ const Home = () => {
 
       const overlay = createCustomOverlay(position, `${index + 1}. ${place.name}`);
       
+      const tilesLoadedListener = window.kakao.maps.event.addListener(map, 'tilesloaded', () => {
+        const currentLevel = map.getLevel();
+        overlay.setMap(currentLevel <= 7 ? map : null);
+        window.kakao.maps.event.removeListener(map, 'tilesloaded', tilesLoadedListener);
+      });
+
       window.kakao.maps.event.addListener(placeMarker, 'click', () => {
         handlePlaceSelect(place);
       });
@@ -300,9 +306,6 @@ const Home = () => {
     polyline.setMap(map);
     map.polyline = polyline;
 
-    console.log('newMarkers[0].overlay', newMarkers[0].overlay);
-    console.log('newMarkers', newMarkers);
-
     setMarkers(newMarkers);
     map.setBounds(bounds);
     map.relayout();
@@ -414,7 +417,7 @@ const Home = () => {
       await axios.delete(`${API_URL}/api/trips/trips/${tripId}`);
       setTrips(prevTrips => prevTrips.filter(trip => trip._id !== tripId));
 
-      // toast.success('여행이 성공적으로 삭제되었습니다.');
+      // toast.success('여행이 성공적으로 삭제되었���니다.');
     } catch (error) {
       console.error('여행 삭제 중 오류 발생:', error);