انتقل إلى المحتوى

خيارات المحاكاة ​

في Pivotick، تتم إدارة المحاكاة الفيزيائية جزئيًا من أجل الأداء والاستقرار. ويشمل:

  • الحساب المسبق: تتم محاكاة التخطيط قبل عرض الرسم البياني، ويتوقف بمجرد أن يصبح مستقرًا تقريبًا.
  • التنفيذ المحدد بوقت: تتوقف المحاكاة تلقائيًا إذا استمرت لفترة طويلة جدًا.
  • التحكم في التشغيل/الإيقاف: يمنع المحرك المحاكاة من العمل دون داع في الخلفية.

وبسبب هذا السلوك الخاضع للتحكم، فإن إضافة العقد بعد انتهاء المحاكاة لن يؤدي إلى إعادة تشغيل الفيزياء تلقائيًا. إذا قمت بتعديل الرسم البياني ديناميكيًا، فستحتاج إلى "إعادة تسخين" التخطيط يدويًا لتشغيل تمريرة محاكاة جديدة.

ts
const graph = new Pivotick(container, data)
// Add nodes
graph.simulation.reheat(0.7) 

ضبط التخطيط التلقائي ​

افتراضيًا، يقوم Pivotick بضبط التخطيط نيابةً عنك. بدلاً من تطبيق حزمة واحدة ثابتة إعدادات القوة لكل رسم بياني، فهي تستمدها مما هو موجود بالفعل على الشاشة - كم عدد العقد الموجودة، وما حجمها، وما حجم اللوحة القماشية - و يعيد اشتقاقها كلما تغير ذلك. أربع عقد صغيرة تحصل على مساحة للتنفس؛ أربعين الكبيرة تقترب أكثر دون لمسها.

هذا هو الإعداد المسبق Auto، وهو قيد التشغيل ما لم تقل خلاف ذلك:

ts
// Auto: no physics configured, so Pivotick tunes the layout as the graph changes.
new Pivotick(container, data)

// Manual: you set a physics option, so your value is kept and nothing re-tunes.
new Pivotick(container, data, { simulation: { d3LinkDistance: 200 } })

// Explicit, either way.
new Pivotick(container, data, { simulation: { physics: 'manual' } })
new Pivotick(container, data, { simulation: { physics: 'auto', d3LinkDistance: 200 } })

القاعدة متحفظة بشكل متعمد: تحديد خيار any الذي يقود السيارة تلقائيًا (d3LinkDistance، d3ManyBodyStrength، d3CollideRadiusMultiplier، d3VelocityDecay، d3GravityStrength، d3GravityStrengthConnected، d3AlphaDecay، cooldownTime) يقوم بإيقاف التشغيل التلقائي لهذا الرسم البياني، لذلك يوجد لا يتم الاستيلاء على التكوين بهدوء أبدًا. physics: 'auto' إلى جانب الصريح لا تزال الخيارات قانونية - فالقيم الصريحة تزرع الإطار الافتتاحي وتأخذ تلقائية من هناك.

يقوم Auto فقط بتحريك نفس المقابض التي تعرضها القائمة المنبثقة للفيزياء وشرائح التمرير تابع أثناء إعادة ضبطه، بحيث تكون قراراته مرئية وليست مخفية. تدوير أي مقبض بنفسك — شريط التمرير، أو مكالمة set*، أو الإعدادات المسبقة Tight/Loose — يستعيدها للأبد؛ لن يتم إعادة ضبط أي شيء على اختيارك بعد ذلك.

ملاحظتان أخريان:

  • تلقائي هو تخطيط القوة فقط. تحت tree / egoTree لا يفعل شيئًا، لأن الشجرة التباعد هو عمل التخطيط الخاص.
  • لا يقوم Auto أبدًا بإعادة تشغيل المحاكاة المتوقفة مؤقتًا (أو التي تقوم هيئة الرقابة البطيئة مغلق). لا يزال يعمل على حل المقابض. إنه لا يوقظ أي شيء.

نصيحة

يعد التثبيت physics: 'manual' الحل الأمثل لاختبارات لقطات الشاشة والصور المصغرة، حيث تريد نفس الصورة في كل مرة بغض النظر عن حجم الرسم البياني.

خيارات ​

تتحكم خيارات المحاكاة في السلوك الفيزيائي والتخطيطي للعقد والحواف لمحرك محاكاة الرسم البياني.

تحقق من D3-force الوثائق الرسمية لمعرفة المزيد.

الخياراكتبالافتراضيالوصف
userWorkerمنطقيةtrueيجب أن يتم حساب موضع العقدة الأولي بواسطة عامل الويب
enabledمنطقيةtrueيجب أن تكون المحاكاة قيد التشغيل
physics'auto' | 'manual''auto'†من يقود إعدادات القوة - راجع ضبط التخطيط التلقائي.
warmupTicksالرقم | 'auto''auto'يتم تحديد التخطيط الافتتاحي قبل الإطار الأول. 0 لا يعمل، لذا فإن العقد المعطاة x/y مفتوحة حيث كانت، وتتم إعادة ضبط الفيزياء التلقائية دون تحريكها حتى يتغير الرسم البياني.
d3Alphaرقم1.0المحاكاة الأولية ألفا
d3AlphaMinرقم0.001الحد الأدنى لقيمة ألفا قبل توقف المحاكاة.
d3VelocityDecayرقم0.4الاحتكاك المطبق على سرعات العقدة.
d3LinkDistanceرقم30المسافة الافتراضية بين العقد المتصلة.
freezeNodesOnDragمنطقيةtrueما إذا كان سيتم تجميد العقد بمجرد تحريرها من عملية السحب.
callbacksSimulationCallbacksundefinedخطافات للرد على أحداث المحاكاة.

† 'auto' فقط للرسوم البيانية التي لا تقوم بتكوين أي من خيارات القيادة التلقائية؛ انظر ضبط التخطيط التلقائي.

معلومات

تتوفر معلمات قوة D3 الأخرى مثل d3AlphaDecay وd3ManyBodyStrength وd3CollideRadius و موثقة في مرجع API.

عمليات الاسترجاعات ​

  • onInit(sim: Simulation): يتم الاتصال به عند بدء المحاكاة.
  • onStart(sim: Simulation): يتم الاتصال به عند بدء تشغيل المحاكاة.
  • onStop(sim: Simulation): يتم الاتصال به عند توقف المحاكاة.
  • onTick(sim: Simulation): يتم استدعاؤه عند كل علامة محاكاة.

واجهة برمجة التطبيقات ​

Pivotick يعرض وحدة تحكم محاكاة تتيح لك التفاعل مباشرة مع محرك الفيزياء. جميع الطرق متوفرة على الإنترنت

توقف / ابدأ ​

ts
pause(): void;
reheat(alpha?: number): void;
restart(): void;
start(): Promise<void>;
stop(): void;

تغيير التخطيط ​

ts
changeLayout(
    type: LayoutType,
    simulationOptions?: DeepPartial<SimulationOptions.SimulationOptions>,
): Promise<void>;
ts
graph.simulation.changeLayout('tree', {
    layout: {
         horizontal: false,
         rootIdAlgorithmFinder: 'FirstZeroInDegree'
    }
})

رد الاتصال لتحقيق الاستقرار ​

ts
waitForSimulationStop(): Promise<void>;
ts
graph.simulation.reheat(0.7)
// Wait until the simulation stops
await graph.simulation.waitForSimulationStop()
graph.renderer.fitAndCenter()