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

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



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

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

0 258 ۲۷ اردیبهشت ۹۵

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

نمونه پنجم : نمودار spline با محورهای معکوس

در این جلسه یک نمودار spline یا با خطوط نرم و خمیده رسم میکنیم که محورهای اون برعکس و معکوس هستند. در ابتدا کل کدهای این نمودار رو قرار میدیم تا اونا رو ببینید:

همونطور که دیدید در ابتدا متغیر chart بصورت زیر تعریف شده:

میبینید که با استفاده از ویژگی type نوع نمودار رو برابر با spline قرار دادیم. با استفاده از این کار خطوطی که نقاط نمودار رو به هم وصل میکنن صاف نیستن و بصورت خمیده و نرم کشیده میشن تا شکلی انحنادار به خود بگیرن. با استفاده از True قرار دادن ویژگی inverted باعث میشید که محور x عمودی و محور y افقی نمایش داده بشه و نمودارها برعکس بشن. بقیه کدها باید براتون آشنا باشه و دیگه نیازی به توضیح ندارن و خودتون میتونین با استفاده از تغییر اونا بفهمید که هر کدوم مربوط به چه چیزی هستند و بر روی چه چیزی تاثیر میزارن.

خروجی بصورت زیر هست:spline inverted

نمونه ششم : نمودار spline با symbol و نشانهای مختلف

در اینجا یک نمودار spline با symbol ها مختلف رو در اختیارتون میزارم و یاد میگیرید که چطور آیکونها و اشکال مختلف رو در نقاط مختلف نمودار قرار بدین. کدهای این نمودار:

همونطور که دیدید در ابتدا متغیر chart تعریف شده و نوع نمودار برابر با spline قرار گرفته. بعد از اون عنوان اصلی و عنوان فرعی نمودار مشخص شده.  در ادامه اون تنظیمات مربوط به محورهای افقی و عمودی قرار داده شده. برای tooltip هم همونطور که در جلسات قبلی توضیح داده شد، خاصیتهای crosshair و shared برابر با true قرار گرفت، تا با هاور کردن بر روی نقاط هر نمودار، اطلاعات همه اونا در یک tooltip و بصورت همزمان نمایش داده بشه. تمرکز اصلی ما در این قسمت بر روی اطلاعات موجود در series هست:

میبینید که دو سری اطلاعات رو قرار دادیم و نام اولی رو Tokyo و دومین مورد رو London قرار دادیم. با استفاده از ویژگی marker میتونین علامت و نشانه ای که روی هر نقطه نمودار نمایش داده میشه رو مشخص کنید. میتونین برای این کار از نشانه های از قبل تعریف شده مانند square یا diamond که بترتیب مربع و لوزی هستند، استفاده کنید و یا اینکه آدرس یک تصویر رو بدید که بعنوان نشانه از اون استفاده بشه. میتونین برای همه نقاط و حتی برای یک نقطه نشانه رو تغییر بدین. همونطور که در کد بالا دیدیدن نشانه رو برای دو نقطه تغییر دادیم. خروجی بصورت زیر خواهد بود:

spline marker

در قسمتهای بعد نمونه های دیگه ای رو در اختیارتون میزارم.

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

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

یا علی

Source

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

دیدگاه ها اولین دیدگاه این مطلب را ارسال کنید.

ارسال دیدگاه

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

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

ورود به سایت

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

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

عبارت :
7LearnTelegram