اذهب إلى المحتوى
  • 0

استراد البيانات من قاعدة البيانات postgresql وعرضها على خرائط Google maps - جانغو

Zeina Almakdisi

السؤال

مرحبا 

لدي قاعدة بيانات تحتوي على بيانات الاماكن( اسم المكان وخطوط الطول والعرض)

احتاج الى استراد البيانات من قاعدة البيانات postgresql

وعرضها على خرائط Google maps

class Map(models.Model):
    Specialization = {
        ('Hospital','Hospital'),
        ('Clinic','Clinic'),
        ('Pharmacy','Pharmacy'),
        ('Health_Clinic','Health_Clinic'),   
    }

    Name =models.CharField(_("Name:"),max_length=50)
    latitude =models.CharField(_("latitude:"),max_length=50)
    longitude =models.CharField(_("longitude:"),max_length=50)
    Specialization =models.CharField(_("Specialization:"), unique=True,choices=Specialization,max_length=100)
 
<script>
  var request = {
  lat:{{Map.latitude}},////المشكلة انه لايتم استراد القيمة هنا
      lng:{{Map.longitude}}////المشكلة انه لايتم استراد القيمة هنا
  };
console.log(request)
  service = new google.maps.places.PlacesService(map);
  service.findPlaceFromQuery(request, (results, status) => {
    if (status === google.maps.places.PlacesServiceStatus.OK && results) {
      for (let i = 0; i < results.length; i++) {
        createMarker(results[i]);
      }

      map.setCenter(results[0].geometry.location);
    }
  });
}



window.initMap = initMap;
</script>
رابط هذا التعليق
شارك على الشبكات الإجتماعية

Recommended Posts

  • 0

مرحبا زينة،

لربط البيانات من النموذج Map مع القالب يجب توفر دالة عرض view ورابط url.

في الشفرة التي قمت بإرفاقها انت تقومين باستيراد النموذج Map مباشرة داخل القالب وهذا خطأ. يجب أولا عمل دالة عرض view تقوم باستخراج البيانات من قاعدة البيانات وارسالها إلى القالب.

مثال بسيط:

دالة العرض view:

def get_maps(request):
    maps = Map.objects.all()
    return render(request, "maps.html", {maps: maps})

الرابط url:

from views import get_maps # نقوم باستيراد الدالة get_maps

urlpatterns = [
    path('maps', get_maps, name='google_maps'),
]

شفرة القالب تصبح على الشكل التالي:

<script>
  var request = {
  lat:{{maps.0.latitude}},
      lng:{{maps.0.longitude}}
  };
console.log(request)
  service = new google.maps.places.PlacesService(map);
  service.findPlaceFromQuery(request, (results, status) => {
    if (status === google.maps.places.PlacesServiceStatus.OK && results) {
      for (let i = 0; i < results.length; i++) {
        createMarker(results[i]);
      }

      map.setCenter(results[0].geometry.location);
    }
  });
}



window.initMap = initMap;
</script>

تحياتي،

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

  • 0

 

 

بتاريخ 1 ساعة قال Hassan Hedr:

يرجى إرفاق أي رسائل خطأ تظهر ضمن الطرفية console، وذكر لغة البرمجة وإطار العمل الذان يتم العمل بهما لتوضيح 

اطار عمل جانغو

بتاريخ 1 ساعة قال Hassan Hedr:

 

11111.png

تم التعديل في بواسطة Zeina Makdisi
رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ الآن قال Zeina Makdisi:

شكرا لك 

لكن ماذكرته قمت مسبقا بكتابته والتأكد منه 

عند التنفيذ يظهر كالتالي

11111.png

مرحبا مجددا،

قيمة Map التي يستقبلها القالب هي None أي فارغة.

حتى نتمكن من مساعدتك أكثر يرجى إرفاق المشروع على شكل ملف مضغوط حتى نقوم بالإطلاع عليه ومعرفة سبب المشكلة.

تحياتي،

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

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...