آموزش رسم نمودار با Highcharts (جلسه 28) - نمودارهای حبابی یا Bubble

- visibility ۰ mode_comment

در این جلسه با ادامه موضوع مربوط به رسم نمودار با Highcharts در خدمتتون هستم. highcharts

نمونه اول : نمودار حبابی ساده

با استفاده از این نمونه میتونین نمودارهایی رسم کنید که داده ها رو بصورت حبابی و دایره دایره نمایش میده. کل کدهای مربوط به این نمونه رو در اختیارتون میزارم و بعد براتون توضیح میدم:

میبینید که در ابتدا کدی بصورت زیر رو قرار دادیم:

میبینید که نوع نمودار رو برابر با bubble قرار دادیم و با این کار داده ها بصورت حبابی نمایش داده میشن. با استفاده از ویژگی zoomType هم برای نمودار قابلیت بزرگنمایی در جهتهای افقی و عمودی رو قرار دادیم.

میبینید درون متغیر Series هم داده های مورد نظرمون رو قرار دادیم و در سه دسته کلی جا گرفتن. هر کدوم از اونا سه مقدار داره، که مقدار اول اون محل افقی و مقدار دوم محل عمودی و مقدار سوم نیز شعاع اون رو مشخص میکنه. خروجی بصورت زیر میشه:bubble basic chart

نمونه دوم : نمودار حبابی با ظاهر سه بعدی

این نمونه تقریبا شبیه به نمونه قبلی هست، با این تفاوت که ظاهر حباب ها در این نمونه به صورت سه بعدی هست و زیباتر و طبیعی تر از قبل میشه. کل کدهای مربوط به این نمونه رو در اختیارتون میزارم و بعد براتون توضیح میدم:

تفاوتی که با نمونه قبل داره اینه که درون متغیر Series، ویژگی marker رو دستکاری کرده و برای رنگ پس زمینه اون یک گرادیان شعاعی قرار داده. بصورت زیر:

میبینید که برای هر دسته یک گرادیان قرار داده شده و طول، عرض و شعاع گرادیان رو مشخص کرده. خروجی بصورت زیر خواهد بود:bubble 3d chart

امیدوارم از این مطلب خوشتون اومده باشه.

موفق و پیروز باشید

یا علی

Source

comment دیدگاه کاربران

نیاز به لاگین

برای ارسال دیدگاه و یا پرسیدن سوال خود در این قسمت، باید در سایت لاگین شوید.