• 0

كيفية اختيار مكان من mapview فى react native

انا استطيع فتح الخريطة على الهاتف ولكنى اريد عن الضغط على اى مكان فى الخريطة فانه يطبع لى احداثياته ولو كان به مكان مميز مثلا مطعم او غيره فاريد ان اعرف كيف احصل على اسمه 

 

 <SafeView>
       <Button title="close" onPress={onClose} />
       <MapView style={{flex: 1}}></MapView>
 </SafeView>

 

تمّ تعديل بواسطة أحمد ابراهيم عبد الله

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 1

لمعرفة الاحداثيات عند مكان ضغط المستخدم يمكنك الاستفادة من التابع onPress كما يلي

<MapView style={{flex: 1}}
         onPress={({ coordinate, position}) => {
  	const {latitude, longitude} = coordinate
  	// الان اصبح لديك الاحداثيات التي تم الضغط عليها
  }}>
</MapView>

لمعرفة وجود مكان مميز عند تلك الاحداثيات، يجب الاستعلام عن ذلك من مزود معلومات الاماكن المميزة حسب تطبيقك :

  • اما من بيانات الاماكن المميزة التي يوفرها تطبيقك (في قاعدة البيانات لديك مثلا)
  • أو الاستفادة بالاشتراك بمزود معلومات خرائط طرف ثالث مثل Google Maps
1 شخص أعجب بهذا

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 0
بتاريخ 32 دقائق مضت قال Hassan Hedr:

لمعرفة الاحداثيات عند مكان ضغط المستخدم يمكنك الاستفادة من التابع onPress كما يلي


<MapView style={{flex: 1}}
         onPress={({ coordinate, position}) => {
  	const {latitude, longitude} = coordinate
  	// الان اصبح لديك الاحداثيات التي تم الضغط عليها
  }}>
</MapView>

لمعرفة وجود مكان مميز عند تلك الاحداثيات، يجب الاستعلام عن ذلك من مزود معلومات الاماكن المميزة حسب تطبيقك :

  • اما من بيانات الاماكن المميزة التي يوفرها تطبيقك (في قاعدة البيانات لديك مثلا)
  • أو الاستفادة بالاشتراك بمزود معلومات خرائط طرف ثالث مثل Google Maps

ظهر لى هدا الايرور 

 TypeError: undefined is not an object (evaluating 'coordinate.latitude')

 

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 0

جرب تمرير احداثيات منطقة العرض initialRegion كالتالي (يمكنك تغيير الاحداثيات لاي مكان تريد عرضه)

<MapView style={{flex: 1}}
         initialRegion={{
           latitude: 37.78825,
           longitude: -122.4324,
           latitudeDelta: 0.0922,
           longitudeDelta: 0.0421,
         }}
         onPress={({ coordinate, position}) => {
            const {latitude, longitude} = coordinate
            // الان اصبح لديك الاحداثيات التي تم الضغط عليها
         }}>
</MapView>

 

تمّ تعديل بواسطة Hassan Hedr

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 0
بتاريخ 15 ساعات قال Hassan Hedr:

جرب تمرير احداثيات منطقة العرض initialRegion كالتالي (يمكنك تغيير الاحداثيات لاي مكان تريد عرضه)


<MapView style={{flex: 1}}
         initialRegion={{
           latitude: 37.78825,
           longitude: -122.4324,
           latitudeDelta: 0.0922,
           longitudeDelta: 0.0421,
         }}
         onPress={({ coordinate, position}) => {
            const {latitude, longitude} = coordinate
            // الان اصبح لديك الاحداثيات التي تم الضغط عليها
         }}>
</MapView>

 

للأسف يعرض لى نفس الخطأ

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 0

احتاج الى تفاصيل اكثر لتحديد المشكلة

  • على اي نظام تقوم بالاختبار Android أم IOS ؟
  • جرب تمرير الخاصية "provider="google
  • هل الخريطة تظهر وهل يمكنك ارفاق صورة للخريطة وللخطأ ؟

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 0
بتاريخ 1 ساعة قال Hassan Hedr:

احتاج الى تفاصيل اكثر لتحديد المشكلة

  • على اي نظام تقوم بالاختبار Android أم IOS ؟
  • جرب تمرير الخاصية "provider="google
  • هل الخريطة تظهر وهل يمكنك ارفاق صورة للخريطة وللخطأ ؟

تمت الحل كودك كان يحتاج الى تعديل بسيط

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 0

هل يمكنك نشر الكود بعد التعديل، لكي يتطلع عليه من يمر بنفس المشكلة لاحقًا

1 شخص أعجب بهذا

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 0
بتاريخ On 8/17/2021 at 17:53 قال Hassan Hedr:

هل يمكنك نشر الكود بعد التعديل، لكي يتطلع عليه من يمر بنفس المشكلة لاحقًا

هدا هو الحل

onMapViewOress={(coordinate: any) => {

console.log(coordinate.nativeEvent.coordinate);

setSelectedLocation(coordinate.nativeEvent.coordinate);

}}

 

 

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية
  • 0

يبدو انه عند الضغط أول مرة تكون الاحداثيات غير معروفة لذلك يجب التاكد من وجود القيمة coordinate قبل محاولة الوصول الى الاحداثيات منها كما يلي

onPress={({ coordinate }) => {
  if(!coordinate) return // التاكد من وجود قيمة الاحداثيات
  
  const {latitude, longitude} = coordinate
}}>

 

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
شارك على الشبكات الإجتماعية

يجب أن تكون عضوًا لدينا لتتمكّن من التعليق

انشاء حساب جديد

يستغرق التسجيل بضع ثوان فقط


سجّل حسابًا جديدًا

تسجيل الدخول

تملك حسابا مسجّلا بالفعل؟


سجّل دخولك الآن