fix: hiển thị market chỉ hướng người dùng di chuyển trên iOS

frontend/src/pages/TourDetailPage.tsx

@@ -178,6 +178,10 @@ const MapRotationHandler = ({ rotation }: { rotation: number }) => {
   useEffect(() => {
     const container = map.getContainer();
 
+    // Đảm bảo tâm xoay luôn ở giữa và kích hoạt tăng tốc phần cứng để giảm lag trên iOS
+    container.style.transformOrigin = 'center center';
+    container.style.willChange = 'transform';
+
     if (rotation === 0) {
       cumulativeRotationRef.current = 0;
       prevRotationRef.current = 0;
@@ -193,9 +197,11 @@ const MapRotationHandler = ({ rotation }: { rotation: number }) => {
     cumulativeRotationRef.current += delta;
     prevRotationRef.current = rotation;
 
-    // Áp dụng transform với giá trị cộng dồn liên tục
+    // Áp dụng transform với giá trị cộng dồn liên tục. 
-    container.style.transform = `rotate(${cumulativeRotationRef.current}deg) scale(2.5)`;
+    // 1. Dùng translateZ(0) để kích hoạt GPU trên iOS.
-    container.style.transition = 'transform 0.1s linear';
+    // 2. Giảm scale xuống ~1.6 (vừa đủ che góc) để giảm tải cho bộ nhớ đệm đồ họa.
+    container.style.transform = `rotate(${cumulativeRotationRef.current}deg) scale(2.2) translateZ(0)`;
+    container.style.transition = 'transform 0.2s cubic-bezier(0.25, 0.1, 0.25, 1)';
   }, [rotation, map]);
   return null;
 };