آموزش D3.js
دسته بندی ( ۲ آموزش )
نمایش دسته بندی ها (۲ آموزش)
مباحث اولیه، در D3.js
مباحث اولیه، در D3.js 2

معرفی D3.js برای نمایش اطلاعات با رسم شکل ها و نمودارها در وب سایت

D3.js ، یک کتابخانه (Library) بر اساس زبان برنامه نویسی JavaScript می باشد که با استفاده از آن، می توانیم اطلاعات مورد نظر خود را در شکل ها و نمودارهایی در وب سایت نمایش دهیم. این کتابخانه، تنها یک فایل js است که آن را در صفحه وب سایت ذکر می کنید و سپس با نوشتن مقداری کد JavaScript در صفحه، می توانید شکل یا نمودار مورد نظر خود را رسم نمایید.

کتابخانه D3.js ، به صورت متن باز (Open Source) می باشد و شما می توانید کدهای اصلی آن را بخوانید.

کتابخانه D3.js ، می تواند شکل ها و نمودارهای متنوع و همچنین کاملا پیچیده ای را برای شما رسم کند و اگر به دنبال کتابخانه ای هستید که با استفاده از آن، بتوانید به سطح بالایی از تنوع و پیچیدگی در رسم شکل ها و نمودارها برسید، کتابخانه D3.js ، گزینه مناسبی می باشد.

در واقع مشکلی که خیلی از افراد با آن مواجه می شوند، این است که یک کتابخانه (Library) را برای رسم شکل ها و نمودارها انتخاب کرده و آن را در وب سایت خود به کار می برند، اما به مرور که نیاز پیدا می کنند که شکل ها و نمودارهای متنوع تر و پیچیده تری را در وب سایت خود رسم کنند، متوجه می شوند که کتابخانه (Library) مورد نظر، قابلیت رسم آن سطح از تنوع و پیچیدگی را ندارد (یا حداقل اجرای آنها با استفاده از آن کتابخانه، بسیار سخت و وقت گیر می باشد و عملا برنامه نویس به سراغ اجرای آنها نخواهد رفت) و بنابراین مجبور می شوند که کتابخانه (Library) قبلی را رها کرده و به سراغ کتابخانه ای (Library) بهتر و جامع تر (مثل همین D3.js) بروند.

بنابراین انتخاب کتابخانه ای مثل D3.js ، اگرچه ممکن است کدنویسی آن سخت تر از سایر کتابخانه ها (Library) باشد، اما انتخاب آن باعث می شود که در آینده مجبور نشویم برای متنوع تر، پیچیده تر و حرفه ای تر شدن شکل ها و نمودارهای وب سایت، نیاز به کتابخانه (Library) جدیدی داشته باشیم.

برای آشنایی با مثال هایی از شکل ها و نمودارهای رسم شده توسط کتابخانه D3.js ، می توانید به وب سایت آن مراجعه نمایید :


https://d3js.org

که صفحه اول آن به صورت زیر می باشد :

معرفی D3.js برای نمایش اطلاعات با رسم شکل ها و نمودارها در وب سایت

در صفحه اول این وب سایت، شکلی وجود دارد که ترکیبی از شکل های مختلف رسم شده توسط D3.js می باشد (به عنوان مثال هایی از کاربرد D3.js) و بر روی هر یک از آنها که کلیک نمایید، به وب سایت نمایش دهنده آن شکل متناظر خواهید رفت و می توانید خودتان، شکل رسم شده را بررسی نمایید :

معرفی D3.js برای نمایش اطلاعات با رسم شکل ها و نمودارها در وب سایت
نکته

در صفحه های زیر نیز می توانید فهرستی از مثال های اجرا شده بر اساس کتابخانه D3.js را مشاهده نمایید :


https://github.com/d3/d3/wiki/Gallery

https://bl.ocks.org/mbostock

با توجه به اینکه این شکل ها اکثرا به صورت واکنشی هستند و به حرکت موس کاربر و یا انتخاب ها و کلیک های کاربر، واکنش نشان می دهند، بنده برخی از این شکل ها را به صورت نمونه انتخاب کرده ام و فیلم هایی را از چگونگی نمایش و واکنش آنها به انتخاب های کاربر تهیه نموده ام. شما با دیدن این فیلم ها، می توانید به یک دید اولیه در مورد گستردگی و پیچیدگی رسم شکل ها و نمودارها توسط کتابخانه D3.js برسید :

معرفی D3.js برای نمایش اطلاعات با رسم شکل ها و نمودارها در وب سایت
معرفی D3.js برای نمایش اطلاعات با رسم شکل ها و نمودارها در وب سایت
معرفی D3.js برای نمایش اطلاعات با رسم شکل ها و نمودارها در وب سایت
معرفی D3.js برای نمایش اطلاعات با رسم شکل ها و نمودارها در وب سایت
معرفی D3.js برای نمایش اطلاعات با رسم شکل ها و نمودارها در وب سایت
معرفی D3.js برای نمایش اطلاعات با رسم شکل ها و نمودارها در وب سایت
معرفی D3.js برای نمایش اطلاعات با رسم شکل ها و نمودارها در وب سایت
معرفی D3.js برای نمایش اطلاعات با رسم شکل ها و نمودارها در وب سایت
معرفی D3.js برای نمایش اطلاعات با رسم شکل ها و نمودارها در وب سایت
معرفی D3.js برای نمایش اطلاعات با رسم شکل ها و نمودارها در وب سایت
معرفی D3.js برای نمایش اطلاعات با رسم شکل ها و نمودارها در وب سایت
نویسنده علیرضا گلمکانی
شماره کلید 26338
گزینه ها
به اشتراک گذاری (Share) در شبکه های اجتماعی
نظرات 0 0 0

ارسال نظر جدید (بدون نیاز به عضو بودن در وب سایت)

جستجو در کلیدستان، توسط گوگل

جستجو در عنوان کلیدها

دسترسی سریع

کلید
×

شماره کلید


دسته بندی
×

شماره دسته کلید


جستجو
×

جستجو