توثيق لرسوم سمعة سمعة مكدس (FLOT)

Question

هل هناك أي وثائق متاحة لبناء رسم بياني مشابه لما يمكننا العثور عليه في سعة المكدس الملف الشخصي/السمعة التبويب؟

من الكود المصدري ، يمكنني أن أرى أن البيانات يتم الاستعلام عنها في هذا العنوان: /users/rep-graph/341106/" + ranges.xaxis.from.toFixed(1) + "/" + ranges.xaxis.to.toFixed(1) لكني لا أعرف القيم from و to مجالات في عنوان URL تستطيع القبول.

تعديل:

في هذا الرسم البياني ، يمكننا أن نرى أنه يتم تسليط الضوء على نقطتين ، والنتيجة هي أن اثنين سؤال يتم إدراجها على الجانب ، مما يعني أن القيم المرسومة مرتبطة بها البيانات المعرفة من قبل المستخدم.

ومع ذلك ، إذا نظرت إلى مثال PKH ، فقط نقاط (وتسمية) يتم توفيرها لتسرب:

label: "United States",
        data: [[1990, 18.9], [1991, 18.7] ....

لذلك أود أن أرى:

1. كيفية ربط البيانات بالنقاط
2. كيفية تحديث لوحة وفقًا لاختيار الرسم البياني [ولكن ربما لا يتم هذا الجزء فعليًا عن طريق Flot نفسه

Answer 1

في هذه الحالة ، يمرون الطوابع الزمنية JavaScript عبر عنوان URL.

لذلك على جانب الواجهة الخلفية ، يجب أن يفعلوا شيئًا كهذا (الكود الكاذب):

//get parameters from URL, non-rails people would just use POST or GET variables
$from = $_GET['from']
$to = $_GET['to']

//convert to timestamps in your language
$from = $from/1000
$to = $to/1000

//query your data source with these time-based restrictions
//return a JSON data set with the given restrictions, linking the known timestamps to labels

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

{ 1274774400000 : {
       Gain:0,
       Loss:10,
       Url:'http://asdf.com',
       Title:'We lost some rep here... boohoo'
    },
  1274947200000 : {
       Gain:10,
       Loss:0,
       Url:'http://asdf.com',
       Title:'We gained some rep here... woo!'
    }
}

يمكنك رؤية هذا النوع من الكائنات المستخدمة في showReputation وظيفة في الصفحة التي أشرت إليها ... باستثناء أنها أعادت صفيف JSON بدلاً من كائن.

ميزة أخرى يمكنك إضافتها بسهولة نظرًا لكائن البيانات أعلاه: حدث PlotClick يسلط الضوء على نقطة البيانات المحددة عند النقر فوقها.

Answer 2

يبدو أنهم يستخدمون المكون الإضافي لتحديد Flot. ها هو المثال الأساسي لاستخدامه.

ranges هي حجة ل plotselected المعالج ، وهكذا from و to يمكن أن يكون أي قيمة صالحة للمحور المعطى. (يمكن أن يكون الاختيار على طول محاور x أو y أو (x و y).)