簡介
本指南將逐步說明幾種自訂 3D 故事述說解決方案的方式，讓您製作引人入勝的地理位置報導。
透過兩種方便的方法，您可以靈活設定他們的述說故事解決方案。別擔心，您可以使用「管理」應用程式提供的直覺化 UI，使用專屬的設定面板。在這個面板中，使用者可以修改整體故事和個別章節的主要屬性，例如 imageUrl、標題、日期等。
第二，您可以在 Admin 應用程式中使用 GUI，微調每個章節的相機設定和焦點選項。對設定感到滿意後，使用者即可選擇下載產生的 JSON 檔案。
您也可以直接編輯 JSON 檔案。您可以調整 JSON 結構、載入設定好的故事解決方案，並略過管理控制台。這種雙方法可同時提供容易使用的介面和進階 JSON 操作功能。
開始進行：
啟用
創造屬於自己的故事
故事的整體版面配置會分為封面/封底故事。
你可以個別自訂封面和章節。請參閱
詳細說明，瞭解如何使用管理應用程式和設定檔來建構及自訂故事。
封面
首先，您必須為整體故事建立封面頁面。即可在精選故事中加入簡介、封面相片和說明。
使用「管理」應用程式
首先，請新增短片故事的封面頁面。方法是在「管理」應用程式中，按照下列畫面完成這項作業：
使用 config.json
此外，如果您有設定檔，可以直接在檔案中新增以下區段：
- 1.
imageUrl：整個故事主要媒體檔案 (圖片、GIF 或影片) 的網址。
可以是指向圖片、GIF 或影片檔案的任何可公開存取網址，做為整個故事的主要媒體。
- 2.
title：整個故事的標題。 - 3.
date：報導的相關日期或時間範圍。 - 4.
description：故事的簡短說明。 - 5.
createdBy：故事的建立者或作者。 - 6.
imageCredit：主要圖片的出處。 - 7.
cameraOptions：整個故事的初始相機設定。
章節
故事分為多個章節，每個章節都有一組各自的變數。您可以視需要建立多個章節。首先，請選取地址，然後將下列詳細資料新增至章節。
使用「管理」應用程式
地點搜尋：使用整合的 Google 地圖平台自動完成搜尋列，尋找要顯示的地點。
新增地點後，您可以按一下位置旁邊的「Edit」按鈕，在章節中加入詳細資料：
新增地點詳細資料：
確定整體設定沒有問題後，請下載 json 檔案，便可在試用版應用程式中使用。
使用 config.json 進行設定
您可以在下載的 config.json 檔案中直接編輯下列變數，自訂每個章節：
title：該章節的標題。id：該章節的專屬 ID。imageUrl：章節圖片網址。imageCredit：章節圖片的出處。content：該章節的文字內容。dateTime：特定章節的日期或時間範圍。coords：與章節相關聯的位置座標。lat：緯度。lng：經度。
address：與此章相關的地址。
相機設定
應用程式會在相機上提供許多不同的控制項。本節將逐步說明不同的相機設定，以及如何自訂這些設定。
(平移、縮放及傾斜鏡頭，取得最佳視角)
使用「管理」應用程式
攝影機：調整攝影機移動速度和軌道類型，打造最佳的觀看體驗。
位置標記可讓您切換顯示或隱藏特定位置的圖釘。
半徑焦點會在不固定特定位置的情況下，在特定區域周圍建立暈影陰影。適合用來展示社區或大概區域
以下展示如何變更相機的焦點，以顯示區域而非特定點。
使用 config.json
您也可以使用 JSON 設定檔直接自訂所有相機參數：
cameraOptions：這個章節的相機設定。(進一步瞭解攝影機角度)。position：位置參數會決定 3D 環境中相機的空間座標。其中包含三個值：x、y 和 z。 每個座標都代表 x、y 和 z 軸中的一個點，代表相機的位置。heading：標題參數是指攝影機指向的水平方向。以地理位置來說，這代表攝影機視角與北方向之間的角度。方向 0 表示攝影機指向朝北。pitch：俯仰參數會決定攝影機的垂直角度。代表相機視角的傾斜或傾斜角度。正面的音調向下下降，而負的音調向上則朝上。roll：滾動參數會定義攝影機軸的旋轉角度。代表相機的扭曲動作。滾動 0 表示沒有旋轉，正值或負值則代表向右或左側旋轉。
focusOptions：聚焦特定點的選項。focusRadius：聚焦的半徑。showFocus：用來顯示或隱藏焦點的布林值。showLocationMarker：用來顯示或隱藏位置標記的布林值。
儲存設定
最後，按一下「Save camera location」(儲存攝影機位置) 儲存攝影機位置，然後按一下「Exit edit mode」(保持編輯模式) 來儲存工作。
此應用程式提供容易使用的介面，可讓您自訂 3D 體驗。此為「管理」應用程式。
最終的 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 檔案進一步自訂相機。它定義了幾個重要變數，例如：
- 強烈
- BASE_PITCH_RADIANS
- BASE_HEADING_RADIANS
- BASE_ROLL_RADIANS
- DEFAULT_HIGHLIGHT_RADIUS
請視需要調整這些變數，以獲得各種相機天使和體驗。
結論
本文件提供自訂 3D 故事述說應用程式的指南，我們探索了管理應用程式提供的各種選項，以及如何透過這些選項製作引人入勝的沉浸式地理位置故事。我們也討論了使用 config.json 檔案建立自訂故事的程序。後續步驟
瞭解如何自訂 3D 故事述說應用程式後，可以開始打造自己的故事了。您可以從下列提案開始著手：
- 為您家鄉或造訪過的地點創作故事。
- 創作一個故事，描述歷史事件或啟發了您的靈感的人。
- 寫下虛構世界或夢想的故事。
一切都有無限的可能！因此，請盡情發揮想像力 創造出真正特別的體驗