سرد القصص الثلاثي الأبعاد: دليل التخصيص

مقدمة

سيقدّم لك هذا الدليل طرقًا مختلفة لتخصيص حلّ "السرد القصصي ثلاثي الأبعاد"، ما يتيح لك إنشاء قصص جغرافية آسرة.

يمكنك ضبط حلّ السرد القصصي بطريقتَين مناسبتَين. أولاً، يمكنك استخدام واجهة المستخدم السهلة المتوفّرة في تطبيق المشرف، والتي تتضمّن لوحة إعدادات مخصّصة. ضمن هذه اللوحة، يمكن للمستخدمين تعديل الخصائص الرئيسية، مثل imageUrl والعنوان والتاريخ وغير ذلك، لكل من القصة العامة والفصول الفردية.

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

بدلاً من ذلك، يمكنك تعديل ملف JSON مباشرةً. يمكنك ضبط بنية JSON وتحميل حلّ السرد القصصي الذي تم ضبطه وتخطّي لوحة تحكّم المشرف. يوفّر هذا النهج المزدوج واجهة سهلة الاستخدام وإمكانية تعديل JSON المتقدّمة.

البدء:

تفعيل ""

إنشاء قصتك الخاصة

ينقسم التنسيق العام للقصة إلى قصة غلاف تليها فصول. يمكن تخصيص كل من الغلاف والفصل بشكل فردي. يمكنك الاطّلاع على
تفاصيل حول كيفية إنشاء القصص وتخصيصها باستخدام كل من تطبيق المشرف وملف الإعدادات.

صفحة الغلاف

أول ما عليك فعله هو إنشاء صفحة غلاف لقصتك العامة. يؤدي ذلك إلى إضافة النظرة العامة وصورة الغلاف والوصف إلى قصتك.

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

ابدأ بإضافة صفحة غلاف لقصتك. يمكنك إجراء ذلك من تطبيق المشرف باستخدام الشاشة التالية:

الصورة

استخدام ملف config.json

بالإضافة إلى ذلك، إذا كان لديك ملف الإعدادات، يمكنك إضافة هذه الأقسام مباشرةً في الملف:

  • 1- imageUrl: عنوان URL لملف الوسائط الرئيسي (صورة أو صورة GIF أو فيديو) للقصة بأكملها.

يمكن أن يكون هذا أي عنوان URL متاح للجميع يشير إلى ملف صورة أو صورة GIF أو فيديو تريد استخدامه كملف الوسائط الرئيسي للقصة بأكملها.

  • 2- title: عنوان القصة بأكملها.
  • 3- date: التاريخ أو الإطار الزمني المرتبط بالقصة.
  • 4- description: وصف موجز للقصة.
  • 5- createdBy: منشئ القصة أو مؤلفها.
  • 6- imageCredit: حقوق الصورة الرئيسية.
  • 7- cameraOptions: إعدادات الكاميرا الأولية للقصة بأكملها.

الفصول

تنقسم القصة إلى فصول، ولكل منها مجموعة متغيّرات خاصة به. يمكنك إنشاء أي عدد تريده من الفصول. ابدأ باختيار عنوان، ثم أضِف التفاصيل التالية إلى الفصل.

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

البحث عن الموقع الجغرافي: استخدِم شريط البحث المتكامل "الإكمال التلقائي" من "منصة خرائط Google" للعثور على الموقع الجغرافي الذي تريد عرضه.

بعد إضافة موقع جغرافي، يمكنك إضافة تفاصيل إلى الفصل من خلال النقر على الزر تعديل بجانب الموقع الجغرافي:

الصورة

أضِف تفاصيل حول الموقع الجغرافي:

بعد أن تصبح راضيًا عن الإعدادات العامة، نزِّل ملف JSON ويمكنك استخدامه في التطبيق التجريبي.

الإعداد باستخدام ملف config.json

يمكنك تعديل المتغيّرات التالية مباشرةً في ملف config.json الذي تم تنزيله لتخصيص كل فصل:

  • title: عنوان الفصل.
  • id: معرّف فريد للفصل.
  • imageUrl: عنوان URL لصورة الفصل.
  • imageCredit: حقوق صورة الفصل.
  • content: المحتوى النصي للفصل.
  • dateTime: التاريخ أو الإطار الزمني الخاص بالفصل.
  • coords: إحداثيات الموقع الجغرافي المرتبط بالفصل.
    • lat: خط العرض.
    • lng: خط الطول.
  • address: العنوان المرتبط بالفصل.

إعدادات الكاميرا

يوفّر التطبيق الكثير من عناصر التحكّم المختلفة في الكاميرا. يقدّم لك هذا القسم إرشادات حول إعدادات الكاميرا المختلفة وكيفية تخصيصها.

الصورة

(يمكنك تحريك الكاميرا وتكبيرها وإمالتها للحصول على زاوية العرض المثالية)

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

الكاميرا: اضبط سرعة حركة الكاميرا ونوع المدار لإنشاء تجربة العرض التي تختارها.

  • تتيح لك علامة الموقع الجغرافي التبديل بين عرض دبوس في موقع جغرافي معيّن أو إخفائه.

  • يؤدي التركيز على النطاق الجغرافي إلى إنشاء ظلّ خفيف حول منطقة معيّنة بدون تحديد موقع جغرافي معيّن. هذا الخيار رائع لعرض حي أو منطقة عامة.

الصورة

يوضّح هذا الخيار كيفية تغيير تركيز الكاميرا لعرض منطقة بدلاً من نقطة معيّنة.

استخدام ملف config.json

يمكنك أيضًا تخصيص جميع مَعلمات الكاميرا مباشرةً باستخدام ملف إعدادات JSON:

  • cameraOptions: إعدادات الكاميرا للفصل. (مزيد من المعلومات عن زوايا الكاميرا)

    • position: تحدّد مَعلمة الموضع الإحداثيات المكانية للكاميرا في البيئة الثلاثية الأبعاد. وتتألف من ثلاث قيم: x وy وz. يمثّل كل إحداثي نقطة على المحاور x وy وz، ما يحدّد موضع الكاميرا.

    • heading: تشير مَعلمة الوجهة إلى الاتجاه الأفقي الذي تتّجه إليه الكاميرا. من الناحية الجغرافية، تمثّل هذه المَعلمة الزاوية بين شاشة الكاميرا والاتجاه الشمالي. تشير الوجهة 0 إلى أنّ الكاميرا تتّجه نحو الشمال.

    • pitch: تحدّد مَعلمة الميل الزاوية العمودية للكاميرا. وتشير إلى ميل شاشة الكاميرا أو انحدارها. يشير الميل الموجب إلى الأسفل، بينما يشير الميل السالب إلى الأعلى.

    • roll: تحدّد مَعلمة الدوران الدوران حول محور الكاميرا. وتمثّل حركة الكاميرا الملتوية. يشير الدوران 0 إلى عدم حدوث دوران، بينما تشير القيم الموجبة أو السالبة إلى دوران إلى اليمين أو اليسار على التوالي.

  • focusOptions: خيارات التركيز على نقطة معيّنة.

  • focusRadius: نطاق التركيز.

  • showFocus: قيمة منطقية لعرض التركيز أو إخفائه.

  • showLocationMarker: قيمة منطقية لعرض علامة الموقع الجغرافي أو إخفائها.

حفظ الإعدادات

أخيرًا، انقر على حفظ موضع الكاميرا لحفظ موضع الكاميرا، ثم انقر على مغادرة وضع التعديل لحفظ عملك.

الصورة

يوفّر هذا التطبيق واجهة سهلة الاستخدام تتيح لك تخصيص التجربة الثلاثية الأبعاد. هذا هو تطبيق المشرف.

ملف config.json النهائي

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

للبدء، نزِّل ملف config.json من تطبيق المشرف أو أنشئ ملفًا جديدًا من البداية. بعد ذلك، افتح الملف في محرِّر نصوص وابدأ في تعديل القيم. يمكنك تغيير النص والصور وحتى إعدادات الكاميرا لإنشاء تجربة فريدة وغامرة لجمهورك.

يمكن أن يبدو ملف JSON للنظرة العامة على القصة على النحو التالي:

{
  "properties": {
    "imageUrl": "https://storage.googleapis.com/gmp-3d-tiles-storytelling/assets/images/317-300x160.jpg",
    "title": "Title",
    "date": "1967",
    "description": ""his is where you put descriptions",
    "createdBy": "Add author",
    "imageCredit": "Add image credit",
    "cameraOptions": {
      "position": {
        "x": -2708127.031960028,
        "y": -4260747.583520751,
        "z": 3886346.825328216
      },
      "heading": -1.5708,
      "pitch": -0.785398,
      "roll": 0
    }
  }

ويمكن أن يبدو فصل معيّن على النحو التالي. الفصول هي مصفوفة ويمكن أن تتضمّن العديد من الفصول الفردية داخلها.

"chapters": [
    {
      "title": "The Jimmy Hendrix Experience",
      "id": 4,
      "imageUrl": "https://storage.googleapis.com/gmp-3d-tiles-storytelling/assets/images/401-300x160.jpg",
      "imageCredit": "Hunter",
      "content": "XYZZZ",
      "dateTime": "Aug 10-12 1967",
      "coords": {
        "lat": 37.7749,
        "lng": -122.4194
      },
      "address": "The Filmore | 1805 Geary Blvd",
      "cameraOptions": {
        "position": {
          "x": -2706472.5713478313,
          "y": -4261528.277488908,
          "z": 3885143.750529967
        },
        "heading": 0,
        "pitch": 0,
        "roll": 0
      },
      "focusOptions": {
        "focusRadius": 3000,
        "showFocus": false,
        "showLocationMarker": true
      }
    },

التخصيصات المتقدّمة

يمكنك الاطّلاع على الرمز البرمجي وإجراء العديد من التخصيصات الأخرى:

تحميل ملف الإعدادات من موقع جغرافي آخر

يُحمِّل الحلّ إعدادات السرد القصصي من ملف محلي بشكل تلقائي . ومع ذلك، يمكن تغيير ذلك بسهولة في ملف config.js:

export async function loadConfig(configUrl) {
  try {
    // Fetch the configuration data from the specified URL.
    const configResponse = await fetch(configUrl);

إعدادات الكاميرا

يمكن تخصيص الكاميرا بشكل أكبر من ملف /utils/cesium.js. يحدّد هذا الملف عددًا من المتغيّرات المهمة، مثل:

  • RADIUS
  • BASE_PITCH_RADIANS
  • BASE_HEADING_RADIANS
  • BASE_ROLL_RADIANS
  • DEFAULT_HIGHLIGHT_RADIUS

لا تتردد في تعديل هذه المتغيّرات للحصول على زوايا وتجارب مختلفة للكاميرا.

الخاتمة

في هذا المستند، قدّمنا دليلًا لتخصيص تطبيق "السرد القصصي ثلاثي الأبعاد". لقد استكشفنا الخيارات المختلفة المتوفّرة في تطبيق المشرف وكيفية استخدامها لإنشاء قصص جغرافية غامرة وجذابة. ناقشنا أيضًا عملية إنشاء قصة مخصّصة باستخدام ملف config.json. الخطوات التالية

بعد أن تعرّفت على كيفية تخصيص تطبيق "السرد القصصي ثلاثي الأبعاد"، يمكنك البدء في إنشاء قصصك الخاصة. في ما يلي بعض الأفكار لمساعدتك في البدء:

  • أنشئ قصة عن مسقط رأسك أو مكان زرته.
  • أنشئ قصة عن حدث تاريخي أو شخص ألهمك.
  • أنشئ قصة عن عالم خيالي أو حلم راودك.

الخيارات لا تحصى. لذا، أطلِق العنان لخيالك وأنشئ شيئًا مميزًا.