Overview

Element

Effect

LaTeX 元素

LaTeX 元素使用 LaTeX 語法渲染數學公式和表達式。它支持基於框架的內容切換，並具有可配置的過渡效果。

LaTeX 元素共享 基本元素 和 視圖元素 的公共字段。

LaTeX 屬性

屬性類型必要範例值範圍描述
typestringtrue-LaTeX元素的類型。對於 LaTeX 元素，這始終是 "LaTeX"。
framesarraytrue--一個 LaTeX 幀的數組。每個幀定義了一個在特定時間範圍內顯示的 LaTeX 表達式。
displayModebooleanfalse--是否以顯示模式（區塊級，居中）或內聯模式渲染。
detailnumberfalse--渲染的細節級別。較高的值會產生更平滑的曲線。
targetWidthnumberfalse--渲染的 LaTeX 內容的目標寬度，以像素為單位。
colorstringfalse--渲染的 LaTeX 文本的顏色，使用十六進制格式。

框架對象

frames 陣列中的每個項目定義了一個 LaTeX 表達式及其顯示的時間範圍：

屬性類型必要範例值範圍描述
latexstringtrueE = mc^2-要渲染的 LaTeX 表達式字符串。
startnumbertrue->= 0此幀相對於元素的開始時間，以秒為單位。
endnumbertrue-> start此幀相對於元素的結束時間，以秒為單位。必須大於開始時間。
transitionobjectfalse--切換到此幀時的過渡效果。
styleobjectfalse--每幀的樣式覆蓋，包括顏色、displayMode 和 targetWidth。

過渡對象：

  • type (string) - 過渡類型：'fade'、'instant' 或 'morph'。默認值：'instant'
  • duration (number) - 過渡持續時間（以秒為單位）。默認值：0.5

樣式對象（每幀覆蓋）：

  • color (string) - 覆蓋此幀的元素級顏色
  • displayMode (boolean) - 覆蓋此幀的顯示模式
  • targetWidth (number) - 覆蓋此幀的目標寬度

示例

單幀 LaTeX

latexElement.json
 
{
  "id": "latex-001",
  "type": "LaTeX",
  "start": 0,
  "duration": 5,
  "trackIndex": 0,
  "x": 200,
  "y": 300,
  "width": 400,
  "height": 100,
  "anchorX": 200,
  "anchorY": 50,
  "rotation": 0,
  "scaleX": 1,
  "scaleY": 1,
  "alpha": 1,
  "color": "#000000",
  "displayMode": true,
  "targetWidth": 400,
  "frames": [
    {
      "latex": "E = mc^2",
      "start": 0,
      "end": 5
    }
  ]
}

多幀帶過渡

latexMultiFrame.json
 
{
  "id": "latex-002",
  "type": "LaTeX",
  "start": 0,
  "duration": 10,
  "trackIndex": 0,
  "x": 200,
  "y": 300,
  "width": 500,
  "height": 120,
  "anchorX": 250,
  "anchorY": 60,
  "rotation": 0,
  "scaleX": 1,
  "scaleY": 1,
  "alpha": 1,
  "color": "#1a1a1a",
  "displayMode": true,
  "targetWidth": 500,
  "frames": [
    {
      "latex": "f(x) = ax^2 + bx + c",
      "start": 0,
      "end": 5,
      "transition": {
        "type": "fade",
        "duration": 0.5
      }
    },
    {
      "latex": "x = \\frac{-b \\pm \\sqrt{b^2 - 4ac}}{2a}",
      "start": 5,
      "end": 10,
      "transition": {
        "type": "morph",
        "duration": 0.8
      }
    }
  ]
}

注意事項

  • LaTeX 元素使用向量渲染，以在任何比例下提供清晰的輸出。
  • frames 陣列必須至少包含一個有效的 latex 字符串的幀。
  • 幀的時間範圍（start 到 end）應涵蓋元素的持續時間，以便持續顯示。
  • morph 過渡在兩個 LaTeX 表達式之間創建平滑的動畫。