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


آموزش وردپرس WordPressآموزش وردپرس WordPress سایت

آموزش جی کوئری jQueryآموزش جی کوئری jQuery جاوا اسکریپت

آموزش انگولار جی اس Angular JS آموزش انگولار جی اس 2 AngularJS 

آموزش اچ تی ام ال HTML5 CSS3آموزش HTML5 و CSS3 اچ تی ام ال 5

آموزش پی اچ پی PHPآموزش پی اچ پی PHP پک 1 برنامه نویسی وب

آموزش سئو SEO آموزش سئو سایت و وردپرس SEO گوگل 

آموزش سوئیفت SWIFT آموزش سوئیفت Swift برنامه نویسی اپل

آموزش برنامه نویسی اندروید استودیو  آموزش برنامه نویسی اندروید استودیو  

آموزش زامارین Xamarinآموزش زامارین Xamarin برنامه نویسی موبایل

درگاه پرداخت

اسکریپت رسم نمودار Highcharts

CSS , CSS / HTML , HTML5 , آموزش طراحی , اسکریپت ها
اسکریپت رسم نمودار HighchartsReviewed by Admin on Jul 20Rating:

اسکریپت Highcharts، کتابخانه ای از انواع نمودارهای خطی، دایره ای، ستونی، پراکنده و… است. Highcharts با بهره گیری از جاوا اسکریپت و html5 دارای انواعی از طرح های زیبا و کاربرپسند است و با داشتن مستنداتی بسیار قوی، این قابلیت را دارد که به راحتی توسط طراحان و توسعه دهندگان، به کار گرفته شود. (نمونه این اسکریپت توسط آقای صوفی در افزونه آماره استفاده شده.)

نحوه کار اسکریپت:
این کتابخانه بر پایه جاوا اسکریپت و جی کوئری نوشته شده و جهت کار با اون، باید از کدهایی استفاده کرد که شباهت بسیاری به زبان json دارند. همچنین، این اسکریپت از طرح های مختلفی برخورداره و هر کدوم از این طرح ها دارای تنظیمات مخصوص به خودشون هستند. هدف ما از این پست، آشنا کردن شما با این اسکریپت در یک مثال rtl شده است. (جهت مطالعه بیشتر میتونید مستندات این اسکریپت رو در آدرس Highcharts.com مطالعه کنید.)

 

3 گام اساسی استفاده:
1- فراخوانی فایل highcharts.js به همراه جی کوئری در صفحه. (نکته: برای گرفتن خروجی چاپ و تصویر،فایل exporting.js رو هم باید فراخوانی کنید.)
2- تعریف یک div در html به همراه ویژگی کلاس یا آی دی! به عنوان نمونه:

3- فراخوانی سکلتور div بالا و استفاده  از اون در تابع highcharts و سپس نوشتن تنظیمات اسکریپت! نمونه کد استفاده شده در پیش نمایش به صورت زیر:

 

در ادامه بخوانید  اسکریپت تبدیل ویدئو های Youtube به Mp3

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

و اما بخش اصلی پس از فراخوانی تابع highcharts شروع میشه! در اینجا باید از یک سری تنظیمات اولیه استفاده و مقدارهایی رو جهت نمایش نمودار وارد کنیم. تنظیمات مهم کتابخانه و محل تأثیر اونها (در قطعه کد بالا) رو میتونید در تصویر زیر مشاهده کنید.

متأسفانه توضیحات کامل تنظیمات اصلی (+ چند مورد دیگه مثل subtitle (عنوان فرعی)، تجزیه axes به xAxis و yAxis) رو نمیشه در یک پست توضیح داد و البته نیازی هم نداره! چون که میتونید به سادگی همه موراد لازم رو در API اسکریپت مطالعه کنید.


به کانال تلگرام بیست اسکریپت بپیوندید !

دانلود

خرید هاست پربازدید با منابع کاملا اختصاصی


مطلب مفیدی بود ؟
نویسنده : admin تاریخ : 1393/04/29 7 CSS , CSS / HTML , HTML5 , آموزش طراحی , اسکریپت ها

لینک کوتاه مطلب : http://www.20script.ir/?p=7539

کلمات کلیدی پست :
درگاه پرداخت
مطالب مرتبط
2,291اسکریپت نمایش بارگذاری صفحه ChilliLoader تاریخ : 1392/11/15
3,535اسکریپت فروشگاه ساز و همکاری در فروش Universal Affiliate Store تاریخ : 1395/03/8
2,180افزونه بهینه سازی سایت برای جستجوی محلی تاریخ : 1393/10/24
4,626قالب تک صفحه ای و چندمنظوره Zerif Lite برای وردپرس تاریخ : 1395/01/6
2,612دانلود پوسته رتینا و واکنش گرا Impreza برای وردپرس تاریخ : 1395/02/11
1,534اسکریپت اشتراک گذاری ویدئو CumulusClips نسخه 1.3.2 تاریخ : 1393/04/1
3,992افزونه رایگان خبرنامه ایمیلی برای Virtual Freer تاریخ : 1393/05/12
6,930اسکریپت دانلود به ازای پرداخت Digital Download Pro نسخه 3.0 تاریخ : 1393/12/1
1,831دانلود پوسته شرکتی و مدرن MINIMUM نسخه v2.1.2 تاریخ : 1392/11/4
4,409اسکریپت ایجاد وب سایت املاک حرفه ای با Realcon تاریخ : 1393/06/16
17,447دانلود قالب موزیک فارسی Banda برای وردپرس تاریخ : 1393/04/18
1,518اسکریپت تبدیل آنلاین ویدئو نسخه فارسی Video Converter تاریخ : 1392/09/5
برخی از قالب های وبلاگ - بیست اسکریپت
قالب عشق بین انگشت ها
قالب دخترونه و آرایش
قالب زیبای ماشین
قالب فانتزی و طنز چِشم
قالب دختر رویایی
قالب وبلاگ دکوراسیون
قالب وبلاگ کلبه و درخت
قالب دختر زیبا
قالب پسرونه غمگین
قالب عاشقانه قلب