ما در عصری از انفجار دادهها زندگی میکنیم، که هر برنامهای که توسعه میدهیم، از دادهها استفاده کرده، یا از آنها بهره میبرد تا تجربهای که به کاربر تحویل میدهیم را ارتقا دهد.
گاهی اوقات، بهترین ویژگیای که میتوانیم به کاربرها تحویل دهیم، خود داده است. گرچه، خواندن نمودارهای جدولی و عددی معمولا خسته کننده است و کشیدن یک بینش عملی از جداول داده بزرگ، میتواند سخت باشد.
در عوض، ما میتوانیم از متدهای بصری سازی داده مرتب استفاده کنیم، که از قابلیت مغز برای تشخیص و پردازش دادهها به یک روش بصری بهره میبرند. برای کمک به شما در شروع کار و اضافه کردن بصری سازیهای زیبا به برنامه مورد علاقه خود، در اینجا برخی کتابخانههای بصری سازی داده در سال ۲۰۱۸ را آماده کردهایم.
1. D3js
D3.js با داشتن 80 هزار ستاره، احتمالا معروفترین و گستردهترین کتابخانه بصری سازی داده JavaScript موجود است. D3 برای دستکاری اسناد بر پایه داده، و زنده کردن آنها با استفاده از HTML، SVG و CSS ساخته شده است. تاکید D3 بر روی استانداردهای وب، قابلیتهای مرورگرهای مدرن را بدون نیاز به جفت شدن با یک فریموورک اختصاصی، ترکیب کامپوننتهای بصری و روشهای بر پایه داده در دستکاری DOM به شما میدهد. این کتابخانه شما را قادر میسازد تا دادههای خودسرانه را به یک مدل آبجکت سند (Document Object Model = DOM) اتصال داده، و سپس تغییر شکلهای بر پایه داده را به سند خود اعمال کنید. در اینجا یک گالری نمونه عالی را میتوانید ببینید.
نکته: برخی معتقدند که D3 اصلا یک کتابخانه بصری سازی داده نیست.
2. ChartJS
یک کتابخانه بسیار معروف (دارای ۴۰ هزار ستاره) نمودارهای HTML اوپن سورس برای وباپلیکیشنهای پاسخگو با استفاده از عناصر canvas. نسخه ۲ انواع نمودار، محورهای نمودار جدید و انیمیشنهای جدیدی را ترکیب میکند. طراحیها با ۸ نوع نمودار پایه، ساده و ظریف بوده و شما میتوانید این کتابخانه را با در جهت اضافه کردن محور زمانی، با moment.js ترکیب کنید.
3. ThreeJS
این کتابخانه به شدت معروف، (دارای ۴۵ هزار ستاره و هزار شرکت کننده) برای ساخت انیمیشنهای سه بعدی با استفاده از WebGL ساخته شده است. این پروژه منعطف بوده، و طبیعت چکیده آن به این معنی است که این کتابخانه برای بصری سازی دادهها به صورت ۲ یا ۳ بعدی هم مناسب است. برای مثال شما میتوانید از این ماژول معین شده برای بصری سازی نمودارهای سه بعدی استفاده کرده، یا این محیط کار آنلاین را امتحان کنید. این یک انتخاب خوب است که بهتر است آن را در نظر بگیرید.
4. Echarts و Highcarts
پروژه Echarts از شرکت Baidu (دارای 30 هزار ستاره) یک کتابخانه نمودارسازی و بصری سازی تعاملی برای مرورگر است. این کتابخانه در JavaScript خالص نوشته شده، و بر پایه کتابخانه zrender ساخته شده است. این کتابخانه از رندر کردن نمودارها در قالب Canvas، SCG و VML به علاوه مرورگرهای کامپیوتر و موبایل پشتیبانی میکند، و همچنین میتواند به همراه node-canvas بر روی node برای رندر کردن سمت سرور (SSR = Server Side Rendering) موثر استفاده شود. شما میتوانید در این لینک یک گالری نمونه را ببینید و آن را در یک محیط تعاملی ویرایش کنید.
Highcharts یک کتابخانه نمودارسازی JavaScript بسیار معروف و دارای 8 هزار ستاره، بر پایه SVG، و به همراه fallbackهایی به VML و canvas برای مرورگرهای قدیمی میباشد. این کتابخانه ادعا میکند که تحت استفاده ۷۲ شرکت از ۱۰۰ شرکت بزرگ دنیا قرار دارد، که باعث میشود احتمالا معروفترین API نمودارسازی JavaScript در دنیا باشد.
5. Metric-Graphics
MetricsGraphics.js یک کتابخانه (دارای ۷ هزار ستاره) بهینهسازی شده برای بصری سازی دادهها میباشد. این کتابخانه نسبتا کوچک بوده (۸۰ کیلوبایت حجم دارد) و مجموعهای کوچک، اما ظریف از نمودارهای خطی، قطعههای پراکنده، هیستوگرام، نواری و جداول داده را فراهم میکند. در اینجا میتوانید گالری نمونه تعاملی را مشاهده کنید.
6. Recharts
Rechartsیک کتابخانه نمودار ساخته شده با استفاده از React و D3 است که شما را قادر میسازد تا کامپوننتهای React را گسترش دهید. این کتابخانه یک پشتیبانی بومی برای SVG را فراهم میکند، و درخت dependency آن از طریق ویژگیهای کامپوننت، کاملا قابل سفارشی سازی میباشد.
7. Raphael
یک کتابخانه وکتور JavaScript، دارای 10 هزار ستاره برای کار با گرافیکهای وکتور در وب. این کتابخانه از SVG W3C و VML به عنوان پایهای برای ساخت گرافیکها استفاده میکند؛ پس هر آبجکت گرافیکیای، همچنین یک آبجکت DOM است و شما میتوانید event handlerهای JavaScript را به آن متصل کنید. Raphael در حال حاضر Firefox 3+، Safari 3+، Chrome 5+، Opera 9.5+ و Internet Explorer 6.0+ را پشتیبانی میکند.
8. C3js
C3 با داشتن ۸ هزار ستاره، یک کتابخانه نمودار بر پایه D3 و با قابلیت استفاده مجدد برای وباپلیکیشنها است. این کتابخانه کلاسهایی برای هر عنصر را فراهم میکند؛ پس شما میتوانید یک استایل سفارشی را با استفاده از کلاس تعریف کرده، و ساختار را مستقیما با استفاده از D3 گسترش دهید. با استفاده از این کلاسها، شما میتوانید نمودارها را حتی بعد از رندر شدن نیز بروزرسانی کنید.
9. React Virtualized + React Vis + Victory
React-vis، مجموعه کامپوننتهای React مطعلق به Uber (دارای 4 هزار ستاره) برای بصری سازی دادهها به روشی استوار، شامل نمودارهای خطی / محیطی / نواری، نقشههای حرارتی، قطعههای پراکنده، heatmapهای شش ضلعی و... میباشد. این کتابخانه به هیچگونه دانش قبلی در D3 یا هر کتابخانه دادهای نیاز ندارد، و کامپوننتهای بلوک ساخت ماژولار سطح پایینتری مانند محورهای X / Y فراهم میکند.
React Virtualized مجموعهای از کامپوننتهای React برای رندر کردن لیستهای بزرگ و دادههای جدولی به صورت موثر میباشد. buildهای ES6، CommonJS و UMD با هر توزیع در دسترس هستند و این پروژه از جریان کاری Webpack 4 هم پشتیبانی میکند. دقت کنید که در جهت جلوگیری از تداخل نسخهها، react و react-dom باید به عنوان یک dependency متناظر مشخص شوند.
Victory مجموعهای از کامپوننتهای React قابل خواندن برای ساخت بصری سازی داده تعاملی است، که توسط آزمایشگاههای Formidable ساخته شده و دارای 6 هزار ستاره میباشد. Victory از API مشابه برای وب و برنامههای React Native برای نمودارسازی میان پلتفرمی استفاده میکنند. یک راه ظریف و منعطف برای بهرهبری از کامپوننتهای React، استفاده از بصری سازی داده عملی است.
10. CartoDB
Carto با داشتن ۲ هزار ستاره، یک ابزار هوش داخلی و بصری سازی داده براش کشف بینشهای تحت دادههای موقعیت مکانی میباشد. شما میتوانید دادههای جغرافیایی را با استفاده از یک فرم وب آپلود کرده، و آن را در یک dataset یا بر روی یک نقشه بصری سازی کنید، آن را با استفاده از SQL جستجو کنید، و استایلهای مپ را با استفاده از CartoCSS به آن اعمال کنید.
11. Raw graphs
Raw با داشتن ۵ هزار ستاره، اتصالی میان spreadsheetها و بصری سازی داده است، که برای ساخت بصری سازیهای وکتوری بر پایه d3.js میباشد. این ابزار با دادههای جدولی و متن های کپی و پیست شده از برنامههای دیگر به خوبی کار میکند. بصری سازیهای ساخته شده که بر پایه قالب SVG میباشند، میتوانند با گرافیکهای وکتور برای اصلاحیههای آینده ویرایش شوند، یا مستقیما در صفحات وب شما پیادهسازی شوند. میتوانید در این لینک یک گالری نمونه را مشاهده کنید.
12. Metabase
Metabase با داشتن بیش از ۱۱ هزار ستاره، راه سریع و سادهای برای ساخت داشبوردهای داده بدون داشتن دانشی در زمینه SQL میباشد. (اما حالت SQL را برای تجزیه و تحلیلها ویژگیهای داده دارد) شما میتوانید بخشها و معیارهای استاندارد بسازید، دادهها را به Slack ارسال کنید (و با استفاده از MetaBot دادهها را در Slack مشاهده کنید) و... این ابزار، احتمالا یک ابزار عالی برای بصری سازی دادهها به صورت داخلی برای گروه خود است، گرچه ممکن است به مقداری نگهداری نیاز داشته باشید.
13. tuaCharts
tuaCharts با داشتن تقریبا ۲ هزار ستاره، یک کتابخانه نمودارسازی بر پایه D3 و متمرکز بر روی داده است. این کتابخانه یک رابط عالی برای map کردن سریع فیلدهای داده برای ویژگیهای بصری است، و معماری آن شما را قادر میسازد تا facetهایی را بسازید و رفتار نمودار را با استفاده از پلاگینها گسترش دهید.
موارد دیگر:
دقت کنید که برخی از این موارد، دیگر پشتیبانی نمیشوند:
دیدگاه و پرسش
در حال دریافت نظرات از سرور، لطفا منتظر بمانید
در حال دریافت نظرات از سرور، لطفا منتظر بمانید