amCharts: رسوم بيانية ثرية بتقينة فلاش

   المحرّر: بوابتي


         




كنت قد تحدثت على بعض الطرق لإنتاج الرسوم البيانية في تطبيقات الويب، وغني عن القول ان الرسوم البيانية بدأت تأخذ أهمية كبرى مع تزايد الحاجة لتتبع التغيرات الناتجة عن المعطيات النشطة (dynamique / dynamic)، والتي اصبحت شيئا فشيئا السمة الأبرز لأغلب المواقع.

ويمكن تصنيف تقنيات إنتاج الرسوم البيانية اما من حيث نوعية الرسم المنتج او من حيث موقع انتاج الرسم هل من جهة المتصفح او من جهة الخادم، ثم ثالثا يمكن تصنيف تلك التقنيات من حيث طبيعة ادخال المعطيات التي يتغذي الرسم البياني بها.

فمن حيث الاعتبار الأول، هناك الرسوم البيانية المرتكزة على انتاج صور بحيث يكون الرسم صورة، اما الطريقة الثانية فهي انتاج الرسم في شكل مكون فلاش وهو موضوعنا اليوم، وتوجد طريقة ثالثة لعلي سأتناولها مرة قادة باذن الله، وهي انتاج الرسم البياني باستعمال وسم (tag) جديد لا توفره كل المتصفحات بعد، وهو canvas، بحيث أن التصرف في بعض خواصة، تمكن من اظهار الرسوم البيانية.

اما من حيث الاعتبار الثاني، فانه توجد رسوم بيانية تنتج جهة المتصفح، وهي تلك التي تستعمل canvas، كما توجد الرسوم البيانية التي تنتج جهة الخادم، وهي تلك التي ترتكز على انتاج الرسم في شكل صورة من خلالل لغة php مثلا، ثم أخيرا توجد الرسوم البيانية التي يمكن انتاجها من خلال الجهتين، وهي موضوعنا اليوم.

أما من حيث الاعتبار الثالث ، فن المعطيات يمكن تزويد الرسم البياني بها جهة الخادم، او جهة المتصفح كما في حالة canvas، او من خلال الجهتين، حيث في حالتنا اليوم وهي الرسوم البيانية عن طريق فلاش يمكن تزويد المعطيات من خلال طريقتين: استعمال ملفات نصية csv، او ملفاتxml، وهذين الملفين يمكن بالطبع انتاجها جهة الخادم، كما يمكن تقديمهما بشكل ثابت جهة المتصفح.

الرسوم البيانية عن طريق amCharts:

يوفر amCharts إمكانية إنتاج الرسوم البيانية عن طريق تقنية فلاش، ويتميز هذا العمل بامكانيات وايجابيات كبيرة نسبة للرسوم البيانية الساكنة المنتجة في شكل صور، من ذلك:

- انه يمكن إضافة التأثيرات للرسم البياني
- انه يمكن إضافة الحركات على الرسم حين شحنه بالصفحة
- انه يمكن التحكم في خواصه بسلاسة اكبر كالتكبير والتصغير وغير ذلك، باعتبار مكون فلاش الخام، هو رسم وليس صورة.

ويوفر amCharts امكانية إنتاج العديد من الأنماط الرسومية (أقراص الجبن، أعمدة، خطوط بيانية...).

ويقع مكون amCharts في جزئين:

- ملفات المعطيات وهي في صنفين، اما ملفات csv او ملفات xml
- ثم ملفات إنتاج الرسوم، وهي ترتكز على ملف فلاش (swf) جاهز، بحيث ان كل نمط من الرسوم البيانية، له ملف جاهز على حدة.
- وحين تنزيل الملفات للاستعمال، ماعليك هو فقط تغذية ملفات المعطيات.

كما انه تم توفير بيئة تصميم لازالت في الإصدار التجريبي، ذات واجهة ثرية، يمكن من خلالها التحكم في كل خواص الرسوم، ومراحله، وتمكن بيئة التطوير هذه من إنتاج الشيفرة المصدرية حينيا في شكل شيفرة html، يمكن نسخها ولصقها بالصفحة التي يراد وضع الرسم البياني بها.

وعليه فان انتاج الرسوم البيانية أصبح سهل جدا، وما على المعني الا ايجاد طريقة لتزويد المعطيات التي ستبنى من خلالها الرسوم، ويمكن ان يتم ذلك بيسر من خلال برمجة احدى الملفين: xml او csv، علما ان طريقة تغذية هذين الملفين، تتم بحيث يراعى فيه عدد المتغيرات، اذ في حالة ملف xml، فان كل متغير سيقع رسمه، هو tag بملف xml (انظر المثل الذي استعملته لإنتاج رسم بياني حول مصادر زيارات بوابتي)

الروابط

موقع amCharts
بيئة تطوير الرسوم من خلال الواجهة التابعة لamCharts




 يسمح بالنقل، بشرط ذكر موقع "بوابتي" مصدر المقال، ويفضّل أن يكون ذلك في شكل رابط
 
 7-03-2009