رأيت الكثير من المدونات الفنية والمدونات ذات الصلة ، ونادراً ما وصفت المواقع الجغرافية لـ HTML5.
أولاً ، سبب موظفي الخدمة ، نظرًا لأن Google يتم توفيره في تحديد المواقع ، لأن Google قد منعت البر الرئيسي ، فإن وظيفة تحديد المواقع غير مدعومة.
ثانياً ، يأتي تحديد المواقع الجغرافية مع HTML5 الأداء.
1. الميزة الجديدة لتحديد المواقع HTML5-Geographicalنظرًا لأن تحديد المواقع الجغرافية هو ميزة جديدة لـ HTML5 ، نحتاج أيضًا إلى تعلم وبرامج واجهات برمجة التطبيقات ذات الصلة وتعلم كيفية استخدام المواقع الجغرافية
افهم أولاً الحس السليم
جيولوجيا اسم جديدة:
يتم استخدامه للحصول على الإحداثيات الجغرافية حيث يوجد المتصفح الحالي ، وذلك لتوفير LBS (الخدمات القائمة على الموقع). بيانات:
السخرية: خط الطول
خط العرض: خط العرض
الارتفاع: الارتفاع
السرعة: السرعة
استخدم النظام الأساسي المطلوب تقسيمه إلى نهاية الهاتف المحمول وأجهزة الكمبيوتر:
(1) متصفح الهاتف المحمول:
حاول أولاً استخدام دقة بيانات GPS المدمجة على الأرز
ثم استخدم رقم المحطة القاعدة المتنقلة لعكس دقة وضع الموقع الجغرافية المقابلة في الوحدة
(2) متصفح الكمبيوتر:
عكس الاستعلام من خلال عنوان IP للكمبيوتر-
عنوان:
فكيف نحصل على معلومات تحديد المواقع من HTML5؟بادئ ذي بدء ، نضغط على F12 لفتح وحدة التحكم في المتصفح وأدخل window.navigator.geology لمشاهدة معلومات تحديد المواقع!
نرى أن هناك ثلاث طرق رئيسية في معلومات تحديد المواقع ، والمعنى هو:
GetCurrentPosition: FN (SCEC ، ERR) // احصل على بيانات تحديد المواقع الحالية ، والتي تحتوي على مراقبة ، والتي هي ناجحة وفشل في الحصول عليها وتفشل.
منذ ذلك الحين ، نعرف كيفية استخدام المواقع الجغرافية في ملف HTML5.
<! {// انقر فوق الزر لإعداد Navigator.geolocation.getCurrentPosition (Succcb ، errcb) ؛ التقاطع console.log ("الحصول على بيانات تحديد المواقع") ؛ "+pos.coords.Altitude) ؛ التقاطع Console.log ("الحصول على بيانات تحديد المواقع") ؛ }} </script> </body> </html>كما هو موضح في الشكل ، عند زر النقر ، يتم الحصول على بيانات تحديد المواقع بنجاح ، ولكن الارتفاع والسرعة لاغالان بسبب جانب الكمبيوتر ، لذلك نحن بحاجة فقط إلى تذكر طريقة واحدة للحصول على تحديد المواقع الجغرافية في HTML5!
navigator.geolocation.getCurrentPosotion (function (pos) {console.log ('' 'الموقع اكتساب بيانات ناجح') ؛ // pos.coords.longtitude ....} (err) {console.log ('' ' ') ؛ 2. استخدم خريطة أدوات الطرف الثالثكما ذكرت في المقدمة ، فإن استخدام خرائط Baidu في المشروع والعديد من تطبيقات الهاتف المحمول يوفر للمستخدمين اختيار معلومات تحديد المواقع.
بادئ ذي بدء ، يجب أن نعرف أن مدونة Baidu لم يتم تنزيلها للجميع. شركة ضمير للغاية.
استخدم الخطوات:
افتح أولاً الموقع الرسمي http://lbsyun.baidu.com/ ، ثم اسحبه إلى الأسفل:
يمكن ملاحظة أن خريطة Baidu يمكن استخدامها لتطوير الويب ، وتطوير iOS.
عنوان URL: http://lbsyun.baidu.com/index.php؟
يمكننا الذهاب إلى العديد من الحالات وعرض الوظيفة في API.
سأشرح ما هو المفتاح لاحقًا. أدخل الهاتف المحمول وعلامة البريد ، ثم تحقق في صندوق البريد.
املأ اسم التطبيق حسب الإرادة
اختيار نوع التطبيق --- المستعرض nide
قائمة المراجع: تشير إلى من يمكنه الوصول إلى التطبيق الخاص بك ، وكيف يمكنك الوصول إلى التطبيق الخاص بك في كيفية الوصول إليه ، وملء رقم النجم " *" هنا ، مما يعني أنه يمكن لجميع الأشخاص الوصول إليه ، لأنه يمكن إجراء الاختبار فقط ، ويمكن القيام بالمشروع في المستقبل. التقاطع ثم انقر فوق إرسال لإكمال الإبداع! التقاطع
بعد إنشاء التطبيق ، تظهر الواجهة التالية:
هنا سوف يعرض رقم التطبيق واسم التطبيق وأهم رمز تطبيق الوصول الذي تم إنشاؤه هنا ، وهو المفتاح المذكور سابقًا!
بعد الحصول على المفتاح ، نعود إلى الصفحة الرئيسية http://lbsyun.baidu.com/index.php؟title=jspopular
انقر على دليل التطوير على اليسار ، يمكنك رؤية استخدام واجهات برمجة التطبيقات والحالات ذات الصلة! التقاطع واجهة برمجة التطبيقات هذه هي الضمير الأكثر ضميرًا في واجهة برمجة التطبيقات ، لا يوجد هراء ،
الكتابة مفصلة للغاية وسهلة الفهم ، لأن هناك الكثير ، فقط قدم بعض الاستخدام الرئيسي هنا! التقاطع التقاطع
نقوم بإنشاء ملف HTML جديد ونسخ الرمز أعلاه إلى ملف HTML
<! = jrbp iu6jcbpsxgvdqxac0c. الإصدار السابق ، وأسلوب المرجع السابق: src = http://api.map.baidu.com/api؟ ؛ الارتفاع: 500 بكسل ؛ مثيل الخريطة لتجنب اسم الخريطة ، لذلك استخدم BMAP.MAP VAR MAP = BMAP.MAP جديد (حاوية) ؛ مركز الإحداثيات ومستويات الخريطة 1 ~ ~ المستوى 18. ) body> </html>
استخدم خريطة Baidu:
حسنًا ، استخدمنا خرائط Baidu بنجاح في ملف HTML. التقاطع
وصف الوظيفة ذات الصلة:
<script src = http://api.map.baidu.com/api؟
أدخل مفتاح الجذع الطويل في AK للاقتباس خريطة Baidu! التقاطع
قم بإنشاء تحديد مثيل MAP.
خريطة var = new bmap.map (حاوية) ؛
إنشاء نقطة محددة ، معلومات خطوط الطول والعرض الخاص بك! التقاطع إذا كنت لا تعرف ، يمكنك استخدام واحد سابق
navigator.geology.getCurrentPosotion طريقة للحصول على خط العرض وعرض الطول.
var point = new Bmap.Point (116.300982،39.915907) ؛
أرقام خريطة العرض في النقطة المتمركزة حيث يشير المركز ، 17 إلى المستوى ، ويمكن تقسيم المستوى إلى المستوى 1 إلى 18. كلما كان مستوى المستوى الأصغر ، أكبر نطاق الخريطة ، وكلما زاد المستوى من المستوى. التقاطع --- لا بد من الاختيار.
Map.Centerandzoom (Point ، 17) ؛
يمكن تحديد الخريطة مع خيار الماوس.
map.enablescrollwheelzoom (صواب) ؛
تُظهر الخريطة السيطرة-يتم اختبار التأثير في حد ذاته.
map.addcontrol (New Bmap.NavigationControl () ؛
إظهار تسمية على الخريطة (Label)-الخيار
var marker = map.addoverlay (new bmap.marker (point)) ؛
حسنًا ، يقال هنا خريطة Baidu الثالثة -هناك العديد من الوظائف الممتعة التي يمكن استخدامها بمفردها ، بحيث يمكن العثور على الأساليب والمعلمات في API!
ما سبق هو كل محتويات هذا المقال.