آیا می دانید دوره های آموزشی سون لرن از جامع ترین و کاربردی ترین آموزش های موجود در سطح وب فارسی است!

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

6 558 ۳ خرداد ۹۵

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

نمونه هفتم : نمودار سطحی بصورت Spline

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

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

میبینید که نوع یا type رو برابر با areasplie قرار دادیم. با اینکار نمودار سطحی بصورت spline رسم میشه  و خروجی اون بصورت زیر خواهد بود:spline area chart

میبینید که خطوط بصورت Smooth یا نرم کشیده شده اند.

نمونه هشتم : نمودار سطحی با بازه داده یا range

در این نمونه مشخایم نمودارهایی رو بررسی کنیم که داده های اون بصورت بازه ای و range هستن و مثلا از یک عدد تا عدد دیگری رو پوشش میدن و همه اون اعداد بین میتونه صادق باشه. مثلا در اینجا نمودار تغییرات دمایی در طول روزهای مختلف رو رسم میکنیم و میبینیم. کل کدهای مربوط به این نمونه رو در اختیارتون میزارم و بعد براتون توضیح میدم:

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

میبینید که در ابتدا نوع این نمودار arearange قرار داده شده و مشخص میکنه که میخام از نمودار بازه ای استفاده کنیم. بعد از اون همونطور که در جلسات قبل توضیح داده شد در اینجا مقدار ویژگی zoomType رو برابر با x قرار داده و با اینکار میتونین این نمودار رو در جهت محور x بزرگنمایی و زوم کنید. داده ها رو از یک فایل JSON که در سرور دیگری قرار داده شده با استفاده از Ajax لود میکنیم و از اطلاعات موجود در اون در نمودار استفاده میکنیم. بصورت زیر:

این نمونه رو هم در قسمتهای قبل توضیح دادیم و چیز خاصی نداره. خروجی این نمودار بصورت زیر خواهد بود:Area range chart

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

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

یا علی

Source

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

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

  • ‏‏
    شرکت طراحی(۴ خرداد ۱۳۹۵)

    ممنون از سایت خوبتون

  • ‏‏
    Syd Ali Bararsani(۴ خرداد ۱۳۹۵)

    با سلام و تشکر بابت این سری آموزش گاربردی…
    آموزش خواندن نمودار هار از داده های دیتابیس هم دارید؟

    • ‏‏
      محمد اسفندیاری(۴ خرداد ۱۳۹۵)

      سلام
      همونطور که دیدید در این آموزش با استفاده از Ajax و متد getJSON یک فایل json رو گرفتیم و اطلاعات اون رو در نمودار نمایش دادیم
      همینکارو برای دیتابیس هم میشه کرد و اطلاعات برگشتی از سرور رو در نمودار نمایش داد
      در آدرس زیر همچین کاری رو انجام داده و میتونین از اون استفاده کنید
      http://www.highcharts.com/docs/working-with-data/data-from-a-database
      موفق باشید

  • ‏‏
    هدیه تبلیغاتی(۲۱ تیر ۱۳۹۵)

    ی دنیا ممنون و متشکر
    خوشحالم ک تونستم جواب سوالمو اینجا پیدا کنم

    • ‏‏
      محمد اسفندیاری(۲۱ تیر ۱۳۹۵)

      موفق باشید
      منم خوشحالم که بدردتون خورده
      موفق باشید

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

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

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

    ورود به سایت

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

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

    عبارت :