انتقل إلى المحتوى
Pivotick
Main Navigation الرئيسية
البدء
الإعدادات
توثيق API المُولّد
المعرضالمشاريعجرّبه!

العربية

English
简体中文
Français
Deutsch
Português
Nederlands
日本語
Español

العربية

English
简体中文
Français
Deutsch
Português
Nederlands
日本語
Español

المظهر

Sidebar Navigation

البدء

مشاريع تستخدم Pivotick

الإعدادات

دوال الاستدعاء

طبقات الحواف

التبسيط

التخطيط

الرسم

المحاكاة

تخصيص الواجهة

الشريط الجانبي

التلميح

القائمة السياقية

المرشحات

وسيلة الإيضاح

جدول البيانات

تنسيق الواجهة

ترجمة الواجهة

الإضافات

واجهة Pivotick البرمجية

الاستكشاف والإثراء

حفظ نتائج الاستكشاف

التراجع والسجل

الأمان

توثيق API

المعرض

الأساسيات

تنسيق العقد

تنسيق الحواف

التخطيطات

الأحداث ودوال الاستدعاء

تخصيص الواجهة

التحرير والتأليف

الملاحظات والتعليقات

التصفية والبحث والتسلسل الهرمي

التحكم البرمجي

السمات والأداء

الاستكشاف والإثراء

نماذج مميزة

إجراءات التحديد المتعدد والمجمّعة ​

حدد عدة عقد وأسطح Pivotick صف الإجراء المجمع في الجزء العلوي من الشريط الجانبي — Pin، Unpin، Hide وDelete يعمل على التحديد بالكامل في مرة واحدة (سيتوفر قريبًا العزل والتجميع وفك التجميع والتحرير المجمع). واضح ✕ يعيد تعيين اختيار.

بناء التحديد:

  • Shift + Click — إضافة عقدة إلى التحديد
  • Alt + Click — ابدأ مجموعة جديدة
  • Ctrl + Click — إزالة عقدة من التحديد
  • أو اسحب الصندوق عبر اللوحة القماشية الفارغة

مع تحديد عقدتين أو أكثر، يظهر الصف المجمع. للرد على الاختيار في الرمز، استخدم رد الاتصال onNodesSelect — الإشعار أدناه مدفوع به.

js
// Multi-selection is built in — pick several nodes and the sidebar shows a bulk-action
// row (Pin / Unpin / Hide / Delete) that acts on the whole selection. `mode: 'full'`
// is what renders the sidebar (and therefore the bulk row).
//
// To react programmatically, use the `onNodesSelect` callback. Its argument only
// carries the nodes involved in *this* change, so read the authoritative current
// selection from the interaction layer instead:
const options = {
    UI: {
        mode: 'full',
        // Off: `full` mode brings a minimap and the data dock, and this card is about
        // neither (see the Minimap and Data table cards for those).
        minimap: false,
        table: false,
        // Keep the sidebar open so the bulk-action row is visible (the embed is
        // short enough that 'auto' would otherwise collapse it).
        sidebar: { collapsed: false }
    },
    callbacks: {
        onNodesSelect: () => {
            const selected = graph.renderer.getGraphInteraction().getSelectedNodes()
            if (selected.length < 2) return
            const labels = selected.map((s) => s.node.getData().label).join(', ')
            graph.notifier.info(`${selected.length} nodes selected`, labels)
        }
    }
}
js
const data = {
    nodes: [
        { id: 'alice', data: { label: 'Alice', role: 'Maintainer', team: 'Core', commits: 342 } },
        { id: 'bob', data: { label: 'Bob', role: 'Contributor', team: 'Core', commits: 87 } },
        { id: 'carol', data: { label: 'Carol', role: 'Reviewer', team: 'Docs', commits: 45 } },
        { id: 'dave', data: { label: 'Dave', role: 'Contributor', team: 'Docs', commits: 63 } },
        { id: 'erin', data: { label: 'Erin', role: 'Maintainer', team: 'Infra', commits: 210 } }
    ],
    edges: [
        { from: 'alice', to: 'bob', data: { label: 'mentors' } },
        { from: 'alice', to: 'carol', data: { label: 'reviews' } },
        { from: 'carol', to: 'dave', data: { label: 'pairs' } },
        { from: 'erin', to: 'alice', data: { label: 'syncs' } }
    ]
}
Pager
الصفحة التاليةالبدء