• 7Learn Discount
  • illustrator Curse
  • 7Learn Android Course
  • 7Learn SEO Course
  • 7Learn WP Theme Course

    حرفه ای ترین دوره آموزش طراحی قالب وردپرس



  آیا می دانید میانگین رضایت دانشجویان سون لرن از دوره ها، بیش از 94% می باشد!

آموزش رسم نمودار با Highcharts (جلسه 11) - نمودارهای سطحی - قسمت 2

2 230 ۱ خرداد ۹۵

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

نمونه سوم : نمودار سطحی بصورت Normal Stack

نمودارهای ستونی و سطحی میتونن بجای اینکه با هم دیگه غاطی و مخلوط بشن، Stack بشن و هر کدام بالای دیگری نمایش داده بشه. به دو صورت میتونین این عمل Stack شدن رو اعمال کنید. یکی normal هست و دیگری percent. کل کدهای مربوط به این نمونه رو در اختیارتون میزارم و بعد براتون توضیح میدم:

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

با استفاده از ویژگی type، نوع نمودار را area یا سطحی در نظر گرفتیم.  برای محور x کدهای زیر رو قرار دادیم:

میبینید که با استفاده از ویژگی categories عناوینی که بر روی محور x قصد داریم قرار بگیره رو مشخص کردیم. با on قرار دادن ویژگی tickmarkPlacement باعث میشه که خطهای ریز موجود بر محور افقی، دقیقا در محل همون نقاطی که در categories مشخص کردیم قرار بگیرن. بعد از اون title رو هم برای محور افقی غیرفعال کردیم و نمایش نمیدیم.

اصلی ترین قسمت این کد مربوط به کدهای plotOptions هست:

میبینید که درون خصوصیت Area، مقدار ویژگی stacking رو برابر با normal قرار دادیم. اگه اینکارو نمیکردیم نمودار بصورت زیر نمایش داده میشد:normal stack

همونطور که دیدید نمودارها با هم غاطی شده. اگر از normal stacking استفاده کنیم بصورت زیر خواهد شد و خیلی مرتب تر میشه:normal stack 2

نمونه چهارم : نمودار سطحی بصورت percent stack

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

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

میبینید که فرقش با قبلی اینه که بجای normal از percent استفاده شده. خروجی بصورت زیر هست:percent stack

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

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

یا علی

Source

:: مطالب جدید سون لرن را از طریق ایمیل دریافت کنید :

دیدگاه ها 2 دیدگاه برای این مطلب ارسال شده است.

  • ‏‏
    Ashkan Ashtiani(۱۲ تیر ۱۳۹۵)

    ممنون دوست عزیز… خیلی خوب توضیح دادین 😉

  • ارسال دیدگاه

    ورود/عضویت سریع با اکانت فیسبوک/جیمیل شما

    :: شما می توانید با استفاده از اکانت یاهو یا جیمیل خود به صورت کاملا امن، سریع و بدون نیاز به ورود اطلاعات عضو و وارد سایت شوید. در این صورت هیچ نیازی به ورود نام کاربری و رمز عبور خود نخواهید داشت و هویت شما از طریق ایمیلتان مورد تائید قرار می گیرد .
    برای استفاده از این روش باید در اکانت گوگل(جیمیل) و یا یاهوی خود لاگین باشید .
    عضویت/ ورود سریع با :
    در حال اتصال ...

    ورود به سایت

    ورود سریع با :
    در حال اتصال ...

    جستجو در سون لرن

    عبارت :
    7LearnTelegram