إطار العرض

مكونات منفذ العرض

apps/desktop/src/viewport/index.ts صادرات Editor2D, View3Dوأنواع دعائمها ومعرفات الأدوات المتاحة و solidsFromProfiles. يملأ كلا المكونين الأصل الخاص بهما: قم بتوفير حاوية بعرض وارتفاع غير الصفر. كيانات CAD الأساسية وبرامج CAM هي نموذج البيانات المشتركة.

يعرض محرر 2D اللوحة القماشية 2D ويحتفظ بالتحديد والكاميرا وسجل الأوامر الخاص به. يستخدم العارض 3D Three.js، وعناصر التحكم في المدار والتحويل، ووظائف الشبكة غير المتزامنة، وتشغيل البرنامج. إن عرض المسار أو المادة الصلبة يكون مستقلاً عن حفظه أو التحقق من عملية التصنيع.

عقد التكامل

Editor2DProps يتطلب drawing, onChange، و selectedTool. قم بتغذية الرسومات المنبعثة مرة أخرى إلى الدعامة. يتعرف المكون على كائنات المستند الصادرة الخاصة به؛ يؤدي استبدال المستند خارجيًا إلى تحميل الرسم الجديد وإعادة تعيين حالة المحرر.

import { createSignal } from "solid-js"
import { Editor2D, type ToolId } from "./viewport/index.ts"

const [drawing, setDrawing] = createSignal(initialDrawing)
const [tool, setTool] = createSignal<ToolId>("select")

<Editor2D drawing={drawing()} onChange={setDrawing} selectedTool={tool()} />

يستبعد التحديد الكيانات المقفلة والكيانات الموجودة على الطبقات المقفلة. يتم استبعاد الكيانات غير المرئية والطبقات المخفية من الفهرس المكاني المعروض. تتلقى الكيانات الجديدة معرفات فريدة للوثيقة ويتم تعيينها لطبقة مرئية وغير مقفلة عند توفرها.

أدوات الرسم والإيماءات

يحتوي سجل الأداة على مصانع للتحديد، والخط، والمستطيل، والدائرة، والقطع الناقص، والمتعدد الخطوط، والقوس، والنص، والأبعاد، والنقل، والتدوير، والقياس، والمرآة، والإزاحة، والقص، والشرائح. AVAILABLE_TOOLS مشتق من تلك المصانع المسجلة. startTool يتعرف بالإضافة إلى ذلك chamfer من خلال مصنع أدوات الشرائح، ولكن لا يتم الإعلان عن الشطب في هذا المصفوفة. يجب على المستهلكين استخدام السجل الفعلي لتحديد الأدوات التي سيتم تمكينها.

• عجلة أو قرصة الأزيز. قم بسحب المسافة، والسحب الأوسط، والسحب الأيمن.
• F يناسب الرسم المفهرس. يؤدي الحذف أو مسافة للخلف إلى إزالة التحديد غير المؤمن.
• Cmd/Ctrl+Z يتراجع؛ Cmd/Ctrl+Shift+Z أو Cmd/Ctrl+Y يعيد.
• أدخل يرتكب خط متعدد الخطوط. يتم تسليم Escape إلى الأداة النشطة لإلغاء الإيماءة الحالية.
• عندما يكون النص نشطًا، اكتب الأحرف أو مسافة للخلف قبل الموضع؛ النص الأولي هو Text.

يتم تحويل مواضع المؤشر إلى إحداثيات عالمية قبل إرسال الأداة. يجمع الالتقاط بين المؤشر المكاني والمرشحات الهندسية والشبكة المعتمدة على الكاميرا؛ يتوافق تفاوت عدد مرات التحديد مع ثمانية بكسلات للشاشة. تنتج آلات الأدوات الأوامر والمعاينات بدلاً من كتابة الملفات أو استدعاء واجهة برمجة التطبيقات (API).

3العرض والتشغيل ثلاثي الأبعاد

View3D يقبل الرسومات، والمواد الصلبة، وقذف التشكيل الجانبي الاختياري، أ cam.Programوأبعاد المخزون وتعريفات الأداة. وهو يدعم الإعدادات المسبقة للمنظور والأعلى والأسفل والأمام والخلف واليسار واليمين ومتساوي القياس وأربعة طرق عرض. تكون أوضاع العرض مظللة ومظللة بالحواف والإطار السلكي والأشعة السينية. الإضاءة، وخصائص المواد، وأقسام القطع، والشبكة، والمحاور، والأصل قابلة للتكوين من خلال الدعائم.

التحكم في التشغيل باستخدام playing, playbackTime في ثواني، playbackRate، و onPlaybackTimeChange. يعمل التشغيل على توسيع دورات الحفر، وتفسيفيط الحركة الدائرية/الحلزونية، والحفاظ على وقت السكون، ورسم الحركات السريعة بشكل واضح. خرائط الأدوات وقاطع العرض الافتراضي الاختياري، وهندسة القطع والساق والحامل؛ الهندسة المفترضة مميزة بصريًا.

تشير عمليات رد الاتصال المحددة إلى فهرس قوي. تنبعث عناصر التحكم في التحويل من الموضع والتدوير والقياس onTransformCommit; يقرر المتصلون كيفية الاستمرار في هذا التحول. يمكن أن تعرض تراكبات مسار الأدوات النقاط والتسميات ومرشحات نوع النقطة ومراكز القوس وأنصاف أقطار القوس وشفافية المخزون.

الإحداثيات والوحدات

تستخدم إحداثيات الرسم الأساسية وأحجام المخزون المليمترات. زوايا الرسم ومكونات التدوير Three.js تستخدم الراديان؛ لا تطبق هذه الاتفاقية على قيم المحور الدوار CAM أو مدخلات الميزات التي تستخدم الدرجات بشكل صريح. viewport/units.ts يحتوي على مساعدات تحويل للمليمترات والبوصات المعروضة. قم بالتحويل عند حدود الإدخال/الإخراج بحيث تحافظ عمليات الالتقاط والهندسة وحركة مسار الأدوات على نظام وحدة ثابت.

تقوم الكاميرا 2D بتخطيط إحداثيات العالم إلى وحدات بكسل CSS؛ تتضمن أبعاد اللوحة الخلفية نسبة بكسل الجهاز. يؤدي تغيير الحجم إلى تحديث الكاميرا والمخزن المؤقت للنسخ الاحتياطي من خلاله ResizeObserver. يحدد مقياس الكاميرا تباعد الشبكة وتفاوتات مساحة الشاشة.

يتم تحويل عرض البوصة بدقة 25.4 مم لكل بوصة، والأطوال الافتراضية هي 3 من الكسور العشرية (apps/desktop/src/viewport/units.ts). في محرر 2D، يتم تكبير كل خطوة للعجلة بعامل 1.15، ويتم تثبيت المقياس بين 0.001 و100،000، ويترك الملاءمة للعرض هامشًا بنسبة 10% (editor2d/camera.ts).

الموارد ودورة الحياة

يقوم المكون 2D بإلغاء إطارات الرسوم المتحركة الموضوعة في قائمة الانتظار ويفصل مراقب تغيير الحجم عند إلغاء التحميل. يُطلق المكون D 3 أدوات تغيير الحجم والرؤية، وعناصر التحكم في المدار والتحويل، وعمال الشبكات، وجدولة الرسوم المتحركة، والأشكال الهندسية، والمواد، والعفاريت، وشبكات الأدوات، وعارض WebGL.

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

خريطة الوحدة

• editor2d/editor2d.tsx: المكون الذي يتم التحكم فيه، إرسال المؤشر، الكاميرا، التحديد، التاريخ، والرسم على القماش.
• editor2d/tools/: آلات الدولة لفتة وبناء الأوامر.
• editor2d/camera.ts, render.ts، و snap-pipeline.ts: تنسيق التحويلات، وتقديم الكيان، والانتقاء، والتزامن المفاجئ.
• spatial/grid.ts: رسم الفهرس المكاني.
• view3d/view3d.tsx: تكوين المشهد، وعناصر التحكم في الكاميرا، والاختيار، والتحويلات، والمخزون، والأدوات.
• view3d/playback.ts, toolpath-overlays.ts، و modeling.ts: الجدول الزمني للحركة، وبيانات التراكب، وتحويل الملف الشخصي إلى صلب.
• view3d/mesh-jobs.ts و mesh-worker.ts: هندسة الخلفية البناء وملكية الوظيفة.

توفر الأداة

ToolId يصف مفردات الأداة الأكبر؛ AVAILABLE_TOOLS يصف المجموعة الفرعية المسجلة. بالنسبة للأدوات التفاعلية، استخدم startTool(id, lookup, context, text). استعلامات البحث عن التحديد عن الكيانات المرشحة؛ يوفر السياق التحديد الحالي والوصول إلى الكيان؛ يوفر النص محتويات التعليقات التوضيحية.

يعود المصنع المفقود undefined. تعامل مع ذلك بشكل صريح بدلاً من تقديم أداة معطلة أو غير منفذة كوضع تحرير نشط. تتطلب الأدوات التي تعدل الشكل الهندسي الحالي التحديد الحالي وسياق الكيان؛ إن استدعاء مصنع بدون تلك التبعيات لا يكفي لإجراء تعديل مفيد.

الربط والتحقق

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

bun test apps/desktop/src/viewport
bun run --filter @cadcamfun/desktop typecheck

تغطي الاختبارات المنطقية مساعدات العرض، وإيماءات الأدوات، والفهرسة المكانية، والتشغيل، والتراكبات. يعتمد سلوك المتصفح/WebGL أيضًا على بيئة الرسومات؛ افحص تفاعل إطار العرض الفعلي عند تغيير عناصر التحكم في الكاميرا أو دورة حياة المشهد أو العرض.

مثال على التشغيل المتحكم فيه

يمكن لأحد الوالدين امتلاك عناصر التحكم في النقل دون تكرار الجدول الزمني لحركة المشاهد. يقبل هذا المكون برنامج CAM الذي تم إنشاؤه بالفعل ويتحكم في الوقت وحالة التشغيل والسرعة والإعداد المسبق لإطار العرض. تفترض مسارات الاستيراد الخاصة به ملفًا موجودًا أسفله مباشرة apps/desktop/src.

import { createSignal } from "solid-js"
import { cam } from "@cadcamfun/core"
import { View3D } from "./viewport/index.ts"

export function ProgramPreview(props: { program: cam.Program }) {
  const [seconds, setSeconds] = createSignal(0)
  const [playing, setPlaying] = createSignal(false)
  return <div style={{ height: "600px" }}>
    <button onClick={() => setPlaying(value => !value)}>Play / pause</button>
    <button onClick={() => { setSeconds(0); setPlaying(true) }}>Restart</button>
    <View3D
      program={props.program}
      preset="isometric"
      playing={playing()}
      playbackTime={seconds()}
      playbackRate={1}
      onPlaybackTimeChange={setSeconds}
      stock={{ origin: { x: 0, y: 0, z: -10 }, size: { x: 100, y: 80, z: 10 } }}
    />
  </div>
}

يبدأ منشئ التشغيل من الأصل، ويوسع الدورات إلى حركات، ويحسب المدد من طول الرحلة والتغذية. سرعتها السريعة الافتراضية هي 5،000 مم/دقيقة والتسامح الافتراضي للفسيفساء القوسية هو 0.1 مم. هذه هي افتراضات المعاينة، وليست قياس تسارع الماكينة أو توقيت وحدة التحكم. تحتفظ أوامر المكوث بالثواني المذكورة؛ التعليقات وإدخالات التوجيه فقط لا تضيف سفرًا خطيًا.

يتم تعيين ألوان الأداة من خلال التواجد الأول لكل معرف أداة ويتم الاحتفاظ بها عبر مساراتها. توفير خريطة أداة/أداة افتراضية لهندسة التجميع؛ لا يحدد المسار الملون وحده أبعاد القاطع أو الحامل المستخدمة في عملية التحقق.

تحرير الوصفات وحدود الأداة الحالية

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

فشل التقديم والربط

تقبل قائمة انتظار شبكة الخلفية 128 من المهام المعلقة على الأكثر افتراضيًا، وتعمل واحدة تلو الأخرى، ولها مهلة افتراضية تبلغ 15 ثانية لكل مهمة. تؤدي إعادة تعيين المشهد إلى إنهاء العامل ومسح العمل الموجود في قائمة الانتظار؛ يتم تجاهل الاستجابات التي لا معنى لها. تقوم استجابات العامل غير الصالحة، وأخطاء فك تشفير الرسائل، والمهلات، وفشل سعة قائمة الانتظار بالإبلاغ عن الأخطاء من خلال رد اتصال قائمة الانتظار.

وتشمل الاختبارات ذات الصلة editor2d/tools/offset.test.ts, annotation-transform.test.ts, spatial/grid.test.ts, view3d/playback.test.ts، و toolpath-overlays.test.ts. تنفيذ قائمة انتظار الشبكة هو view3d/mesh-jobs.ts.

عرض الوحدات بالتفصيل

يعمل المحرر دائمًا بالملليمتر. يتم تحويل ما يقرأه المستخدم ويكتبه فقط، باستخدام العوامل المحددة أدناه. تبقى الوحدة الخاصة بالرسم المخزن mm أو inch; الوحدات الإضافية هي خيارات العرض فقط.

import { formatLength, parseLength, formatAngle, programUnitsOf } from "./units"

formatLength(25.4, "inch")     // "1.0000 inch"
formatLength(12.5)             // "12.500 mm"
formatLength(0.0254, "thou")   // "1.00 thou"
parseLength("2 in", "inch")    // 50.8  (a trailing unit word is ignored)
parseLength("abc")             // undefined
formatAngle(Math.PI / 2)       // "90.0°"
programUnitsOf("thou")         // "inch"

2كاميرا D وشبكة

const camera = createCamera({ x: 0, y: 0 }, 2, 800, 600)   // 2 px per mm
worldToScreen(camera, { x: 10, y: 10 })   // { x: 420, y: 280 }
screenToWorld(camera, { x: 420, y: 280 }) // { x: 10, y: 10 }
gridStep(2)    // 5   -> 5 mm apart = 10 px
gridStep(0.5)  // 20  -> 20 mm apart = 10 px

تقديم عمليات إعدام الكيانات ضد visibleBounds(camera). يتجنب الالتقاط أيضًا مسح الرسم بالكامل: تقوم الشبكة المكانية الموحدة بإرجاع الكيانات التي تقع حدودها ضمن تسامح الانطباق بالإضافة إلى هامش مرشح يبلغ 2 مم، ويتم تمرير تلك الكيانات فقط إلى المركز findSnap. يؤدي هذا إلى إبقاء المؤشر يتحرك بسرعة في الرسومات ذات الكيانات المتعددة.

مرجع الالتقاط

تتم تجربة أنواع اللقطات حسب ترتيب الأولوية. يتطابق الترتيب الافتراضي مع المحرر القديم: endpoint, midpoint, center, intersection, perpendicular, tangent, nearest، و quadrant. نقاط النهاية هي رؤوس الكيان المصدر، وليست فسيفساءه.

يقوم خط الأنابيب بإرجاع اللقطة ومعرفات الكيانات الموجودة أسفل المؤشر (الأقرب أولاً، والتي تستهلكها أداة التحديد)، وعدد المرشحين الذين تم أخذهم في الاعتبار.

كيف يتم توقيت تشغيل مسار الأدوات

const playback = buildPlayback(program)          // rapids at 5000 mm/min
playback.duration                                // total seconds
positionAt(playback, 12.5)                       // tool position at t = 12.5 s
toolAt(playback, 12.5)                           // toolId cutting at that time
toolColors(program)                              // Map toolId -> colour, first use order

// A 10 mm feed move at 600 mm/min lasts 10 / 600 × 60 = 1 s.
// The same 10 mm as a rapid lasts 10 / 5000 × 60 = 0.12 s.

ممارسات منفذ العرض

• التحويل عند الحافة: قم بالتخزين والحساب بالملليمتر والراديان، وقم بالتنسيق للعرض فقط formatLength و formatAngle.
• لا تقم أبدًا بإعادة استخدام الطول الذي تم تحليله بعد ذلك parseLength يعود undefined; احتفظ بالقيمة السابقة وأظهر تلميح التحقق من الصحة.
• عند إضافة أداة رسم، قم بتسجيلها في جدول مصنع الأدوات بحيث يتناولها شريط الأدوات والاختصارات والاختبارات بنفس المعرف.
• حافظ على استعلامات المرشح المفاجئة مكانية. تمرير كل كيان إلى findSnap في كل حركة للمؤشر يهزم المؤشر.
• تعامل مع مدة التشغيل كمعاينة، وليس اقتباسًا لوقت الدورة.

اختبار الضرب على نطاق واسع: الشبكة المكانية

يستهدف محرر 2D 60 إطارًا في الثانية مع 10،000 كيانات، لذلك لا يقوم اختبار النتائج والتصفية أبدًا بفحص كل كيان لكل حدث مؤشر. viewport/spatial/grid.ts يحتفظ بشبكة موحدة: يتم تسجيل كل عنصر في كل خلية يلمسها المربع المحيط به، ويقوم الاستعلام بإرجاع جميع العناصر التي تتقاطع حدودها مع مربع الاستعلام، بترتيب الإدراج. والنتيجة دقيقة وليست عينة.

تتم زيارة الخلايا التي تم لمسها بواسطة مربع الاستعلام المتقطع؛ يتم إرجاع A والخط الطويل لأن حدودهما تتقاطع معه، أما B فلا يتم إرجاعه.

3قائمة الانتظار المتشابكة D

يتم دمج المواد الصلبة في عامل الويب بحيث لا يتم حظر مؤشر ترابط واجهة المستخدم أبدًا. MeshWorkerQueue في view3d/mesh-jobs.ts يدير وظيفة واحدة في وقت واحد:

يؤدي أي فشل إلى إنهاء العامل ومسح قائمة الانتظار بأكملها، لذلك لا يصل عمل المشهد القديم أبدًا بعد تحرير أحدث؛ يبدأ التقديم التالي عاملًا جديدًا. تتم مطابقة الردود بمعرف الوظيفة، لذلك يتم تجاهل الإجابة المتأخرة من العامل الذي تم إنهاؤه.

2تطبيقات الأدوات D

كل أداة عبارة عن آلة حالة صغيرة بها onPointerDown, onPointerMove و onPointerUp، تم إنشاؤها بواسطة مصنع في tools/index.ts، واحد لكل إدخال للوحة الألوان. تمر مواقف المؤشر snap-pipeline.ts قبل أن تراهم الأداة.