السماح للمستخدمين برسم وتخطيط البيانات

أنا حقًا أحب دعم discourse لـ LaTeX المضمن للحديث عن الرياضيات، و mermaid لإنشاء الرسوم البيانية، ولكن هناك شيء واحد كنت أفتقده وهو القدرة على استخلاص أجزاء صغيرة من البيانات وإنشاء رسوم بيانية س/ص لها – الإدخال في جدول بيانات وتصدير ملف png أمر مزعج. ولكن بعد قليل من التحديق في مصدر مكون سمة mermaid، حققت بعض النجاح في إنشاء مكون سمة لـ plotly.js. إنه هنا:

بمجرد تمكينه، يمكنك إنشاء رسم بياني مبعثر كالتالي:

```plotly
data:
  - x: [0,300,400]
    y: [0,950,1050]
    name: Old mempool
  - x: [0,200,400]
    y: [0,700, 1150]
    name: New mempool
layout:
  title: Test plot
```

مما ينتج عنه صورة مثل

أو، على الأرجح، أي من أنواع الرسوم البيانية الأخرى التي يمكنك إنشاؤها عن طريق تمرير قيم البيانات/التخطيط إلى plotly.js.

أحد الأشياء اللطيفة بشكل خاص هو أن الرسوم البيانية تفاعلية بشكل افتراضي، لذا يمكنك رؤية القيم الفعلية للنقاط عن طريق التمرير فوقها، ويمكنك التكبير والتصغير، ويمكنك حفظ ملف png. وبالطبع، البيانات الخام موجودة أيضًا في مصدر المنشور.

لم أقم بنشرها مباشرة بعد، لذا يمكنني فقط القول إنها تبدو وكأنها تعمل في بيئة اختبار؛ لكنني أردت مشاركتها مبكرًا، خاصة في حال أراد شخص ما تولي صيانتها نيابة عني… :slight_smile: (أيضًا، إذا كانت هناك طريقة أفضل للقيام بذلك لم ألاحظها بطريقة ما، فسأكون سعيدًا بمعرفتها قبل أن أضيع المزيد من الوقت في هذا…)

(ملف plotly js المصغر أكبر من 4 ميجابايت، لذا تحتاج إلى زيادة إعداد “أقصى حجم للمرفقات” إلى 5 ميجابايت لكي يعمل، أعتقد؟)

9 إعجابات

هذا رائع، عمل جيد!

عندما تكون جاهزًا لتشغيل هذا في بيئة الإنتاج، يرجى نشره ضمن فئة Theme component. سأحب أن أرى هذا جنبًا إلى جنب مع المكون mermaid. (لاحظ أيضًا أن لدينا إضافة graphviz تقوم بشيء مشابه).

وأيضًا، لدى plotly مجتمع نابض بالحياة، وسيحبون معرفة هذا أيضًا:

6 إعجابات