# 時間表出圖說明

### 由於會場布局尚未直接確認

## [現今的活動規劃為九大項目](https://hackmd.io/SPYbGPt_S1ODp2weE78qlA)
---

A: 3F
B: 4F

---
- 報到處/網美牆 A
- 專家演講 A2(講廳)
- 科普演講 / 工作坊A3(講廳)
- 量子進程展 A4展區
- 合作廠商交流區 A5展區

- 桌長計畫

---

- 量子電玩展區 P
- 海報競賽/展示 p
- 量子成果展示區 P

- 茶點用餐區 C

----

### 公開圖表更新(給外人看)

| time/場域 | A1報到處區 | Q1講廳 | Q2區域 | Q3講廳 | P1區域 |
| ----------- | ------------ | --------------- | ------------ |-------------------- | -------- |
| 8:30~ 9:00 | 開始報到 | | | | |
| 9:10~10:00 | 用心為您服務 | 開幕與組織簡介 | | | 操作遊玩 |
| 10:10~11:00 | 用心為您服務 | 張慶瑞(量子產業) | | | 操作遊玩 |
| 11:10~12:00 | 用心為您服務 | 專家演講 | 桌長開講 | 量子科普主題分享 | 競賽說明 |
| 12:00~13:20 | 用心為您服務 | break |桌長開講 | break | 操作遊玩 |
| 13:30~14:20 | 用心為您服務 | 鄭原忠(量子化學) |桌長開講 | 量子基礎工作坊 | 操作遊玩 |
| 14:30~15:20 | 用心為您服務 | 專家演講(量子光學) |桌長開講 | 量子基礎工作坊 | 操作遊玩 |
| 15:30~16:20 | 用心為您服務 | 專家演講(超導體發展) | | 量子科技的新未來論壇 | 操作遊玩 |
| 16:30~17:00 | 快樂回家 | 閉幕總結 |快樂回家 | 快樂回家 | 快樂回家 |

----->> 我是切割線

| time/場域 | P2區域 | P3區域 |P4區域 |C1區域 |C2區域 |
| -------- | -------------- | ------------- | ------- | ---------------| ------- |
|9:00~10:00 | 海報競賽/展示 |量子進程展 |量子成果展示區|合作廠商交流區 |外燴交流區 |
|10:10~11:00 | 海報競賽/展示 |量子進程展 |量子成果展示區|合作廠商交流區 |外燴交流區 |
|11:10~12:00 | 海報競賽/展示 |量子進程展 |量子成果展示區|合作廠商交流區 |外燴交流區 |
|12:00~13:20 | 海報競賽/展示 |量子進程展 |量子成果展示區|合作廠商交流區 |外燴交流區 |
|13:30~14:20 | 海報競賽/展示 |量子進程展 |量子成果展示區|合作廠商交流區 |外燴交流區 |
|14:30~15:20 | 海報競賽/展示 |量子進程展 |量子成果展示區|合作廠商交流區 |外燴交流區 |
|15:30~16:20 |海報競賽/展示 |量子進程展 |量子成果展示區 |合作廠商交流區|外燴交流區 |
|16:30~17:00 |快樂回家 |快樂回家 |快樂回家 |快樂回家 |快樂回家 |

## 請不要搞混

----

### 內部工人圖表更新(內部工作人員參考)

| time/場域 | A1:報到處| A2:網美牆 |Q1:專家演講 |Q2:工作坊 |Q3:量子電玩 |
| -------- | -------- | ----------| ---------- | --------------- |---------- |
|8:00~9:00 | 報到/就位確認|網美牆 網美牆| 專家演講準備中| 最後確認 | 最後確認 |
|9:10~9:00 | 開始報到 |網美牆 |開幕與組織簡介 |攻略影片撥放 | 影片介紹 |
|9:10~10:00 | 報到處開放 | 網美牆 |EntangleTech介紹 |工作坊開講 |操作遊玩 |
|10:10~11:00 | 報到處開放 | 網美牆 |專家演講(量子產業) |學習教材分享 |操作遊玩 |
|11:10~12:00 | 報到處開放 | 網美牆 |張慶瑞(科普演講) |科普演講 |競賽說明 |
|12:00~13:20 | 報到處開放 | 網美牆 |break |break |操作遊玩 |
|13:30~14:20 | 報到處開放 | 網美牆 |鄭原忠(量子化學) | 工作坊開講（待確認） |操作遊玩 |
|14:30~15:20 | 報到處開放 | 網美牆 |林晏詳(超導) | 工作坊 |操作遊玩 |
|15:30~16:20 | 準備收攤 |專家演講(超導) | 工作坊 |準備收攤 |
|16:30~17:00 |快樂回家 |快樂回家 |快樂回家 |快樂回家 |快樂回家 | |

----- >> 我是切割線

| time/場域 | P1: 海報競賽/展示 | P2:量子進程展 |P3:量子成果展示區|C1:合作廠商交流區|C2:外燴交流區 |
| -------- | -------------- | ---------- | ------- | ---------------| ------- |
|8:00~8:30 |報到/就位確認 |布置最後確認 |最後確認 |最後確認 |擺設確認 |
|8:30~9:00 |展示 |work |work |work |work |
|9:10~10:00 | work |work |work |work | work | |
|10:10~11:00 | work |work |work |work |work | |
|11:10~12:00 | work |work |work |work |work | |
|12:00~13:20 | work |work |work |work |work |
|13:30~14:20 | work |work |work |work |work |
|14:30~15:20 | work |work |work |work |work |
|15:30~16:20 |準備收攤 |準備收攤 |準備收攤 |準備收攤 |準備收攤 |
|16:30~17:00 |快樂回家 |快樂回家 |快樂回家 |快樂回家 |快樂回家 |

### 將圖表嵌入網頁

#### 1.
導出 Figma 圖表：首先，在 Figma 中完成圖表設計後，將其導出為 SVG格式。這樣可以保留圖表的視覺風格和細節。

---
#### 2.
準備圖表的 HTML 結構：創建一個 HTML 文件，並將 Figma 導出的圖表代碼嵌入其中。如果是 SVG，您可以直接將 SVG 代碼放入 HTML 中。
##### 如何抓取連結?
1.
選擇圖表元素：在 Figma 中，點擊並選擇您想要導出的圖表。
2.
導出圖表：選擇後，在右側的屬性面板中找到「導出」選項。點擊「+」按鈕來添加一個導出設置。
3.
設置導出格式：在導出設置中，您可以選擇將圖表導出為 SVG。對於網頁嵌入，通常推薦使用 SVG 格式，因為它支持縮放而不失真，且可以通過 CSS 或 JavaScript 進行樣式和行為的控制。
4.
查看和複製代碼：
• ** 如果導出為 SVG，導出後您可以用文本編輯器打開 SVG 文件，直接查看和複製 SVG 的 XML 代碼**。

---
#### 3.
將圖表嵌入 CKEditor：在 CKEditor 的配置中啟用 image 和 htmlEmbed 插件，這樣您就可以將圖表的 HTML 代碼直接嵌入到編輯器中。
#### 4.
實現圖表的動態更新：如果您希望圖表內容能夠隨時更新，您需要將圖表數據與一個動態數據源（如 API）綁定。這可能需要一些 JavaScript 編程來實現數據的實時拉取和更新。
#### 5.
編寫更新腳本：使用 JavaScript or css 監聽數據源的變化，並在數據更新時，動態地替換 CKEditor 中的圖表內容。

以下是一個簡單的示例代碼，展示如何在 CKEditor 中嵌入並更新圖表：

<!-- CKEditor 的 HTML 結構 -->
<textarea name="editor1" id="editor1" rows="10" cols="80">
<!-- 在這裡嵌入 Figma 圖表的 SVG 或圖片代碼 -->
</textarea>

<script>
// 初始化 CKEditor
CKEDITOR.replace('editor1', {
extraPlugins: 'image,htmlEmbed', // 啟用所需插件
});

// 假設您有一個函數 fetchData() 可以從 API 獲取最新的圖表數據
function fetchData() {
// 從 API 獲取數據
fetch('您的數據源URL')
.then(response => response.json())
.then(data => {
// 更新 CKEditor 中的圖表內容
const editor = CKEDITOR.instances.editor1;
editor.setData(`<img src="${data.chartImageUrl}" alt="圖表" />`);
});
}

// 定期調用 fetchData() 來更新圖表
setInterval(fetchData, 5000); // 每5秒更新一次
</script>