يتطلب المشروع تطوير إصدار الويب من خريطة Baidu في وضع عدم الاتصال. فيما يلي ملخص لعملية التطوير الخاصة بك وتجربتك.
المطلب التقريبي هو: تم تجهيز كل سيارة بمستقبل الشركة ، والذي ستعمل على ردود الفعل على إحداثيات السيارة والسرعة والتوجيه والمعلومات الأخرى في الوقت الفعلي ، وبعد تلقي معلومات كل مركبة ، يتم رسم موقع السيارة على خريطة Baidu في الوقت الفعلي. لا تحتوي نقاط العمل بالضرورة على شبكات ، لذلك مطلوب تطوير دون اتصال.
هناك ثلاث نقاط فنية رئيسية في هذه العملية:
1. كيف تحصل على واجهة برمجة التطبيقات في وضع عدم الاتصال
2. كيفية الحصول على مخططات بلاط في وضع عدم الاتصال
3. كيفية تحويل إحداثيات WGS إلى إحداثيات MAP Baidu عند عدم الاتصال بالإنترنت
عملية حل المشكلات:
1. بما أن خرائط Baidu لا تدعم الخرائط غير المتصلة بالإنترنت ، فإننا نحتاج إلى إيجاد طريقة لتغيير الرمز عبر الإنترنت إلى الكود غير المتصل بالإنترنت.
هنا يمكنك الرجوع إلى: http://my.oschina.net/smzd/blog/548538
لقد قمت بتجميع نسخة هنا ، وقد كتبت أيضًا عرضًا تجريبيًا غير متصل بالإنترنت وفقًا للمثال التجريبي. بالطبع ، لا يمكن أن تكون غير متصلة بالإنترنت مثالية على الإنترنت ، بعد كل شيء ، لا تزال بعض الوظائف غير صالحة للاستعمال. (يعتمد هذا الإصدار على Baidu Maps API V2.0)
كيفية استخدام:
1. تحديد لاحقة صورة البلاط التي تستخدمها ، مثل .png ، .jpg. تعديل imgext في baidumap_offline_v2_load.js
var bdmapcfg = {'imgext': '.2. تحديد دليل البلاط الذي تستخدمه. بشكل افتراضي ، يقع في Baidumap_v2/ tiles/ directory ، ويمكنك أيضًا تغييره إلى عنوان آخر. تعديل tiles_dir في baidumap_offline_v2_load.js
3. راجع العرض التوضيحي لكتابة الكود ، النقاط الرئيسية هي كما يلي:
1) فقط تحميل ملف التحميل
<script type = "text/javaScript" src = "baidumapv2/baidumap_offline_v2_load.js"> </script>
2) تحميل ملف CSS (يبدو أنه ليس ضروريًا)
<link rel = "stylesheet" type = "text/css" href = "../../ baiduumapv2/css/baidu_map_v2.css"/>
3) تحديد حاوية لوضع الخريطة واستخدام CSS للتحكم في الارتفاع والعرض
<div id = "map_demo"> </viv>
4) اكتب رمز JS
<script type = "text/javaScript"> // baidu map function var map = new bmap.map ("map_demo") ؛ // إنشاء MAP مثيل MAP.CENTERANDZOOM (BMAP.POINT جديد (116.404 ، 39.915) ، 8) ؛ // تهيئة الخريطة ، وقم بتعيين إحداثيات النقطة المركزية ومستوى الخريطة //map.addcontrol(new bmap.maptypecontrol ()) ؛ // إضافة عنصر التحكم في نوع الخريطة لدعم الخرائط الإلكترونية فقط في وضع عدم الاتصال ، ولا يدعم القمر الصناعي/3D //map.setCurrentCity("beijing ") ؛ // تعيين الخرائط غير المتصلة التي تعرضها الخريطة لا تدعم! ! map.enablescrollwheelzoom (صواب) ؛ // افتح عجلة الماوس إلى Zoom Map.AddControl (BMAP.NavigationControl ()) ؛ // زر التحجيم </script>2. احصل على مخطط البلاط
هنا يمكنك الرجوع إلى: http://my.oschina.net/smzd/blog/619397
بالطبع ، هناك أيضًا أدوات تنزيل عبر الإنترنت ، مثل: تنزيل الخريطة الإلكترونية الشاملة
3. إنه منحازة لوضع الإحداثيات (WGS) التي تلقاها مباشرة من قبل المتلقي في خريطة Baidu ، لأن Baidu Map قد وضعت علاجات خاصة للسلامة. توفر واجهة برمجة تطبيقات خدمة الويب الخاصة بها واجهة برمجة تطبيقات لتحويل الإحداثيات ، لكنها واجهة تحويل إحداثي مقدمة في HTTP ، لذلك لا يزال لا يمكن فصلها عن الشبكة. هنا ، نستخدم بعض المعرفة المهنية لتحويل إحداثيات WGS إلى GCJ ، ثم لتحويل إحداثيات GCJ إلى إحداثيات BD Baidu. دقة التحقق دقيقة تقريبا.
الفئة العامة CoorConvertutil {// pi static double pi = 3.14159265358979324 ؛ // عامل الإسقاط من إسقاط الإهليلجويد القمر الصناعي لنظام إحداثيات الطائرة ثابتة مضاعفة A = 6378245.0 ؛ // غريب الأطوار من Ellipsoid ثابت eE = 0.00669342162296594323 ؛ // PI CANVERTION Public Final Static Double X_PI = 3.14159265358979324 * 3000.0 /180.0 ؛ Double Static Double [] WGS2BD (double lat ، double lon) {double [] WGS2GCJ = WGS2GCJ (LAT ، LON) ؛ Double [] GCJ2BD = GCJ2BD (WGS2GCJ [0] ، WGS2GCJ [1]) ؛ إرجاع GCJ2BD ؛ } / ** * إحداثيات GCJ إلى BAIDU Coordinates * param lat * param lon * @return * / public static double [] gcj2bd (double lat ، double lon) {double x = lon ، y = lat ؛ double z = math.sqrt (x * x + y * y) + 0.00002 * math.sin (y * x_pi) ؛ double theta = math.atan2 (y ، x) + 0.000003 * math.cos (x * x_pi) ؛ double bd_lon = z * math.cos (theta) + 0.0065 ؛ double bd_lat = z * math.sin (theta) + 0.006 ؛ إرجاع مزدوج جديد [] {bd_lat ، bd_lon} ؛ } static static double [] bd2gcj (double lat ، double lon) {double x = lon - 0.0065 ، y = lat - 0.006 ؛ double z = math.sqrt (x * x + y * y) - 0.00002 * math.sin (y * x_pi) ؛ double theta = math.atan2 (y ، x) - 0.000003 * math.cos (x * x_pi) ؛ double gg_lon = z * math.cos (theta) ؛ double gg_lat = z * math.sin (theta) ؛ إرجاع مزدوج جديد [] {gg_lat ، gg_lon} ؛ } / ** * إحداثيات WGS لإحداثيات GCJ * param lat * param lon * / regurn * / public static double [] wgs2gcj (double lat ، double lon) {double dlat = transformlat (lon - 105.0 ، lat - 35.0) ؛ double dlon = transformlon (lon - 105.0 ، lat - 35.0) ؛ double radlat = lat / 180.0 * pi ؛ السحر المزدوج = Math.sin (Radlat) ؛ السحر = 1 - EE * السحر * السحر ؛ double sqrtmagic = math.sqrt (magic) ؛ dlat = (dlat * 180.0) / ((a * (1 - ee)) / (magic * sqrtmagic) * pi) ؛ dlon = (dlon * 180.0) / (a / sqrtmagic * math.cos (radlat) * pi) ؛ مزدوج mglat = lat + dlat ؛ مزدوج mglon = lon + dlon ؛ Double [] loc = {mglat ، mglon} ؛ إرجاع loc ؛ } static static doublelat private (double lat ، double lon) {double ret = -100.0 + 2.0 * lat + 3.0 * lon + 0.2 * lon * lon + 0.1 * lon * lon + 0.2 * math.sqrt (math.abs (lat)) ؛ ret + = (20.0 * Math.Sin (6.0 * lat * pi) + 20.0 * Math.Sin (2.0 * lat * pi)) * 2.0 / 3.0 ؛ ret + = (20.0 * Math.sin (lon * pi) + 40.0 * math.sin (lon / 3.0 * pi)) * 2.0 / 3.0 ؛ RET + = (160.0 * Math.Sin (LON / 12.0 * PI) + 320 * Math.Sin (LON * PI / 30.0)) * 2.0 / 3.0 ؛ العودة ret. } static static static doublelon (double lat ، double lon) {double ret = 300.0 + lat + 2.0 * lon + 0.1 * lat + 0.1 * lat * lon + 0.1 * math.sqrt (math.abs (lat)) ؛ ret + = (20.0 * Math.Sin (6.0 * lat * pi) + 20.0 * Math.Sin (2.0 * lat * pi)) * 2.0 / 3.0 ؛ RET + = (20.0 * MATH.SIN (LAT * PI) + 40.0 * MATH.SIN (LAT / 3.0 * PI)) * 2.0 / 3.0 ؛ RET + = (150.0 * Math.sin (LAT / 12.0 * PI) + 300.0 * MATH.SIN (LAT / 30.0 * PI)) * 2.0 / 3.0 ؛ العودة ret. } / ** * الانقسام الدرجات والدوران * param lat latitude ddmmmmmm * param lon longitude dddmmmmmmm * @return * / public static double [] dufen2du (String lat ، string lon) {double latd = double.parsedouble (lat.substring (0 ، 2)) ؛ double latm = double.parsedouble (lat.substring (2)) ؛ latnew مزدوج = latd+latm/60 ؛ double lond = double.parsedouble (lon.substring (0 ، 3)) ؛ double lonm = double.parsedouble (lon.substring (3)) ؛ double lonnew = lond+lonm/60 ؛ إرجاع مزدوج جديد [] {latnew ، lonnew} ؛ }}أخيرًا ، انظر إلى لقطة شاشة تأثير المشروع:
ما سبق هو كل محتوى هذه المقالة. آمل أن يكون ذلك مفيدًا لتعلم الجميع وآمل أن يدعم الجميع wulin.com أكثر.