sửa lỗi polygon không bị xóa ở map
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
import { getPolygonCenter } from "@/utils/polyline";
|
||||
import React, { memo } from "react";
|
||||
import React from "react";
|
||||
import { StyleSheet, Text, View } from "react-native";
|
||||
import { Marker, Polygon } from "react-native-maps";
|
||||
|
||||
@@ -20,7 +20,7 @@ export interface PolygonWithLabelProps {
|
||||
/**
|
||||
* Component render Polygon kèm Label/Text ở giữa
|
||||
*/
|
||||
const PolygonWithLabelComponent: React.FC<PolygonWithLabelProps> = ({
|
||||
export const PolygonWithLabel: React.FC<PolygonWithLabelProps> = ({
|
||||
coordinates,
|
||||
label,
|
||||
content,
|
||||
@@ -65,7 +65,7 @@ const PolygonWithLabelComponent: React.FC<PolygonWithLabelProps> = ({
|
||||
{label && (
|
||||
<Marker
|
||||
coordinate={centerPoint}
|
||||
zIndex={200}
|
||||
zIndex={50}
|
||||
tracksViewChanges={false}
|
||||
anchor={{ x: 0.5, y: 0.5 }}
|
||||
>
|
||||
@@ -142,24 +142,3 @@ const styles = StyleSheet.create({
|
||||
opacity: 0.95,
|
||||
},
|
||||
});
|
||||
|
||||
// Export memoized component để tránh re-render không cần thiết
|
||||
export const PolygonWithLabel = memo(
|
||||
PolygonWithLabelComponent,
|
||||
(prev, next) => {
|
||||
// Custom comparison: chỉ re-render khi coordinates, label, content hoặc zoomLevel thay đổi
|
||||
return (
|
||||
prev.coordinates.length === next.coordinates.length &&
|
||||
prev.coordinates.every(
|
||||
(coord, index) =>
|
||||
coord.latitude === next.coordinates[index]?.latitude &&
|
||||
coord.longitude === next.coordinates[index]?.longitude
|
||||
) &&
|
||||
prev.label === next.label &&
|
||||
prev.content === next.content &&
|
||||
prev.zoomLevel === next.zoomLevel &&
|
||||
prev.fillColor === next.fillColor &&
|
||||
prev.strokeColor === next.strokeColor
|
||||
);
|
||||
}
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user