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

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

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

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

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

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

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

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

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

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

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

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

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

اولین قدم این است که داده‌هایی را که می‌خواهید نمایش دهید شناسایی کنید و مطمئن شوید که می‌توان آن‌ها را با مرزهای Google مطابقت داد. می‌توانید این تطبیق را در سمت کارخواه با فراخوانی روش callback‏ 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'];
   });
}

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

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

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

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

در این مثال، نقشه را براساس تعداد تاکسی‌ها در هر کد پستی سبک‌بندی می‌کنید و به کاربران خود حس تراکم و دردسترس بودن تاکسی در منطقه خود را می‌دهید. سبک بسته به مقادیر تعداد تاکسی متفاوت خواهد بود. مناطقی که کمترین تعداد تاکسی را دارند با سبک بنفش نشان داده می‌شوند و طیف رنگی از قرمز و نارنجی عبور می‌کند و در مناطقی که بیشترین تراکم را دارند به رنگ زرد تاکسی‌های نیویورک ختم می‌شود. برای این آرایش رنگ‌ها، این مقادیر رنگ را برای 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 Map را تماشا کنید.
• با رویدادهای کلیک برای «سبک‌بندی داده‌محور»، تجسم‌سازی خود را یک گام فراتر ببرید.
• نشانگرهای پیشرفته را به نقشه‌تان اضافه کنید.

همیاران

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

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