سبک‌بندی داده‌محور هم‌زمان

این سند توضیح می‌دهد که چرا و چگونه سبک‌بندی داده‌محور پویای «مرزهای Google» را بااستفاده از Maps JavaScript API پیاده‌سازی کنید، که برای موارد استفاده مختلف در صنایع و بخش‌های مختلف مفید است.

تعداد تاکسی‌ها در شهر نیویورک براساس کد پستی
تعداد تاکسی‌های پویانمایی‌شده در شهر نیویورک براساس مرز کد پستی (شبیه‌سازی‌شده، زمان‌گریز):
تعداد تاکسی‌ها در تهران براساس کد پستی (زمان‌گریز) شرح نقشه

سبک‌بندی داده‌محور یکی از قابلیت‌های Google Maps Platform است که به شما امکان می‌دهد از چندضلعی‌های مرز اداری Google استفاده کنید، سبک‌بندی را برای نمایش در نقشه‌هایتان روی آن چندضلعی‌ها اعمال کنید، و داده‌های خودتان را ترکیب کنید تا نقشه‌های غنی و سفارشی‌شده‌ای ایجاد کنید که بتوان از آن‌ها برای تحلیل بصری و درک بهتر داده‌هایتان استفاده کرد. این سند به برخی‌از موارد استفاده می‌پردازد که توضیح می‌دهند چرا و چگونه می‌توانید داده‌هایتان را با «سبک‌بندی داده‌محور» روی نقشه تقریباً هم‌زمان با ادغام کردن فیدهای داده پویا تجسم کنید.

سبک‌بندی داده‌محور به شما امکان می‌دهد نقشه‌هایی ایجاد کنید که توزیع جغرافیایی داده‌ها را نشان می‌دهند، سبک چندضلعی را به‌طور پویا سفارشی‌سازی کنید، و ازطریق رویدادهای کلیک با داده‌هایتان تعامل داشته باشید. از این ویژگی‌ها می‌توان برای ایجاد نقشه‌های آموزنده و جذاب برای موارد استفاده و صنایع مختلف استفاده کرد.

در اینجا چند نمونه از موارد استفاده آورده شده است که می‌تواند برای نقشه‌ای که به‌روزرسانی‌های داده‌های پویا را در «سبک‌بندی داده‌محور» نمایش می‌دهد، قابل‌اجرا باشد:

  • هم‌پیمایی: از به‌روزرسانی‌های هم‌زمان می‌توان برای شناسایی مناطق پرتقاضا استفاده کرد که در این صورت ممکن است برخی ارائه‌دهندگان قیمت‌های بالاتری داشته باشند.
  • حمل‌ونقل: از به‌روزرسانی‌های هم‌زمان می‌توان برای شناسایی مناطق پرترافیک استفاده کرد که به تعیین بهترین مسیرهای جایگزین کمک می‌کند.
  • انتخابات: در شب انتخابات، می‌توان از داده‌های نظرسنجی هم‌زمان برای تجسم نتایج به‌محض وقوع استفاده کرد.
  • ایمنی کارکنان: از به‌روزرسانی‌های هم‌زمان می‌توان برای ردیابی رویدادها به‌محض وقوع، شناسایی مناطق پرخطر، و ارائه آگاهی موقعیتی به امدادگران در محل استفاده کرد.
  • آب‌وهوا: از به‌روزرسانی‌های هم‌زمان می‌توان برای ردیابی حرکت طوفان‌ها، شناسایی خطرات فعلی، و ارائه هشدارها و اعلام خطرها استفاده کرد.
  • محیط: از به‌روزرسانی‌های هم‌زمان می‌توان برای ردیابی حرکت خاکستر آتشفشانی و سایر آلاینده‌ها، شناسایی مناطق تخریب محیط‌زیست، و نظارت بر تأثیر فعالیت‌های انسانی استفاده کرد.

در همه این شرایط، مشتریان می‌توانند با ترکیب کردن فیدهای داده‌های هم‌زمان خود با مرزهای Google، ارزش بیشتری را باز کنند تا داده‌هایشان را به‌سرعت و به‌آسانی در نقشه تجسم کنند و به آن‌ها قدرت فوق‌العاده‌ای از اطلاعات آماری تقریباً فوری برای تصمیم‌گیری آگاهانه‌تر بدهد.

رویکرد معماری به راه‌حل

اکنون بیایید مراحل ساختن نقشه بااستفاده از «سبک‌بندی داده‌محور» را برای دیداری‌سازی داده‌های پویا مرور کنیم. همان‌طور که قبلاً نشان داده شد، مورد استفاده تعداد تاکسی‌های نیویورک است که براساس کد پستی تجسم شده است. این اطلاعات می‌تواند به کاربران کمک کند تا متوجه شوند گرفتن تاکسی چقدر آسان خواهد بود.

معماری
در اینجا نمودار معماری برنامه برای این رویکرد ارائه شده است:
معماری برنامه

راهکار سبک‌بندی داده‌محور پویا

اکنون بیایید مراحل لازم برای پیاده‌سازی نقشه کوروپلت سبک‌بندی داده‌محور پویا را برای مجموعه داده‌هایتان مرور کنیم.

این راه‌حل به شما امکان می‌دهد مجموعه داده فرضی تراکم بی‌درنگ تاکسی در اطراف شهر نیویورک را براساس کد پستی تجسم کنید. اگرچه ممکن است این داده‌ها واقعی نباشند، اما کاربردهای واقعی دارند و به شما کمک می‌کنند تا قدرت و توانایی‌های نحوه تجسم داده‌های پویا روی نقشه را با «سبک‌بندی داده‌محور» درک کنید.

مرحله ۱: انتخاب داده‌ها برای تجسم و پیوستن به «شناسه مکان» مرز

اولین قدم این است که داده‌هایی را که می‌خواهید نمایش دهید شناسایی کنید و مطمئن شوید که می‌توان آن‌ها را با مرزهای Google مطابقت داد. می‌توانید این تطابق را در سمت کارخواه با فراخوانی روش فراخوان برگشتی findPlaceFromQuery برای هر postalCode انجام دهید. توجه داشته باشید که کدهای پستی در ایالات متحده نام‌های متمایزی دارند، اما سایر سطوح اداری این‌گونه نیستند. در مواردی که ممکن است نتایج مبهم باشد، باید مطمئن شوید که «شناسه مکان» صحیح را برای پُرسمانتان انتخاب می‌کنید. 


const request = {
    query: postalCode,
    fields: ['place_id'],
};
 
function findPlaceId() {
   placesService.findPlaceFromQuery(request, function (results, status) {
      if (status === google.maps.places.PlacesServiceStatus.OK) {
         console.log(results[0]);
      }
   });
}

اگر داده‌هایتان دارای مقادیر عرض جغرافیایی و طول جغرافیایی است، می‌توانید از Geocoding API با فیلتر کردن مؤلفه نیز استفاده کنید تا آن مقادیر عرض/طول جغرافیایی را به مقادیر «شناسه جا» برای لایه عارضه‌ای که می‌خواهید سبک‌بندی کنید تبدیل کنید. در این مثال، لایه عارضه POSTAL_CODE را سبک‌بندی خواهید کرد.

مرحله ۲: متصل شدن به داده‌های هم‌زمان

روش‌های مختلفی برای اتصال به منابع داده وجود دارد و بهترین پیاده‌سازی به نیازهای خاص و زیرساخت فنی شما بستگی دارد. در این مورد، فرض کنیم که داده‌های شما در جدول BigQuery با دو ستون «zip_code» و «taxi_count» قرار دارد و شما آن را ازطریق Firebase Cloud Function پُرسمان خواهید کرد. 

async function queryNycTaxis() {
   // Queries the NYC Taxis dataset.

   // Create a client
   const bigqueryClient = new BigQuery();
  
   // The SQL query to run
   const sqlQuery = 'SELECT zip_code, taxi_count
      FROM \'YOUR_DATASET_ID.TABLE\' LIMIT 100';
      
   const options = {
      query: sqlQuery,
      // Location must match that of the dataset(s)
      // referenced in the query.
      location: 'US',
   };
  
   // Run the query
   const [rows] = await bigqueryClient.query(options);
  
   rows.forEach(row => {
      const postalCode = row['zip_code'];
      const taxiCount = row['taxi_count'];
   });
}

سپس باید مطمئن شوید که داده‌ها را به‌روز نگه می‌دارید. یکی از راه‌های انجام این کار، فراخوانی پُرسمان بالا بااستفاده از وب‌ورکر و تنظیم زمان‌سنج برای بازآوری داده‌ها بااستفاده از تابع setInterval است. می‌توانید فاصله زمانی را روی مقدار مناسبی تنظیم کنید، مثلاً بازآوری نقشه هر ۱۵ ثانیه. هربار که زمان فاصله می‌گذرد، وب‌ورکر مقادیر taxiCount به‌روزشده را برای هر postalCode درخواست می‌کند.

اکنون که می‌توانیم داده‌ها را پُرسمان و بازآوری کنیم، بیایید مطمئن شویم که ظاهر چندضلعی‌های نقشه این تغییرات را منعکس می‌کند.

مرحله ۳: سبک‌بندی نقشه با سبک‌بندی داده‌محور

اکنون که مقادیر داده‌های پویا را که برای ایجاد و اعمال سبک دیداری به مرزهای کد پستی در نمونه Maps JavaScript به‌عنوان شیء JSON لازم است دارید، وقت آن است که با نقشه کوروپلت به آن سبک بدهید.

در این مثال، نقشه را براساس تعداد تاکسی‌ها در هر کد پستی سبک‌بندی می‌کنید و به کاربران خود حس تراکم و دردسترس بودن تاکسی در منطقه خود را می‌دهید. سبک بسته به مقادیر تعداد تاکسی متفاوت خواهد بود. مناطقی که کمترین تعداد تاکسی را دارند با سبک بنفش اعمال می‌شوند و طیف رنگی از قرمز، نارنجی عبور می‌کند و در زرد تاکسی NYC برای مناطق با بالاترین تراکم پایان می‌یابد. برای این آرایش رنگ‌ها، این مقادیر رنگ را بر fillColor و strokeColor اعمال خواهید کرد. تنظیم fillOpacity روی ۰٫۵ به کاربران شما امکان می‌دهد نقشه زیرین را ببینند، و تنظیم strokeOpacity روی ۱٫۰ به آن‌ها امکان می‌دهد بین مرزهای چندضلعی‌های هم‌رنگ تمایز قائل شوند: 


const featureLayer = map.getFeatureLayer(
   google.maps.FeatureType.POSTAL_CODE
);
featureLayer.style = (featureStyleFunctionOptions) => {
   const placeFeature = featureStyleFunctionOptions.feature;
   // taxiCount per (postal_code) PlaceID 
   const taxiCount = zips[placeFeature.placeId];
   let fillColor;
   let strokeColor;
// Apply colors to features based on taxiCount values
if (taxiCount < 8) {
   fillColor = "#571845";  
   strokeColor = "#571845"; 
} else if (taxiCount < 13) {
   fillColor = "#900c3e";
   strokeColor = "#900c3e";
} else if (taxiCount < 21) {
   fillColor = "#c60039"; 
   strokeColor = "#c60039"; 
} else if (taxiCount < 34) {
   fillColor = "#fe5733";
   strokeColor = "#fe5733";
// keep else if or the whole map gets this style with else
} else if (taxiCount >= 34) { 
   fillColor = "#fec30f";
   strokeColor = "#fec30f";
}  
return {
   fillColor,
   strokeColor,
   fillOpacity: 0.5,
   strokeOpacity: 1.0,
};

نتیجه‌گیری

سبک‌بندی داده‌محور برای مرزهای Google امکان استفاده از داده‌هایتان را برای سبک‌بندی نقشه‌تان برای پیاده‌سازی‌های مختلف در صنایع و بخش‌ها فراهم می‌کند. اتصال به داده‌های هم‌زمان به شما امکان می‌دهد آنچه را که درحال وقوع است، جایی را که درحال وقوع است، و همان موقعی را که درحال وقوع است اطلاع‌رسانی کنید. این قابلیت می‌تواند ارزش داده‌های هم‌زمان شما را آشکار کند و به کاربران شما کمک کند تا آن را به‌صورت هم‌زمان در دنیای واقعی بهتر درک کنند.

کنش‌های بعدی

همیاران

نویسنده اصلی:

جیم لفلار | مهندس راه‌حل‌های «پلاتفرم Google Maps»