熱感遮罩

熱感遮罩可視化在檢測到的臉部感興趣區域（ROI）上疊加熱感風格效果。它為用戶提供清晰的視覺提示，表示臉部正在被跟蹤和分析。

工作原理

遮罩跟隨人臉檢測器報告的臉部框，並在臉部皮膚區域繪製動態的熱感漸層。效果渲染在覆蓋視訊的畫布上，因此會隨相機預覽縮放。提供兩種配色方案：經典熱感漸層和中性灰階。

配置

JavaScript

import { createVitalSignCamera } from 'ts-vital-sign-camera';

const camera = createVitalSignCamera({
  // ... 其他配置
  visualizationOptions: {
    thermalMask: {
      enabled: true,
      opacity: 0.6,          // 遮罩不透明度，0–1（預設：0.6）
      colorScheme: 'thermal' // 'thermal' | 'grayscale'（預設：'thermal'）
    }
  }
});

React

import { VitalSignCamera } from 'react-vital-sign-camera';

const App = () => (
  <VitalSignCamera
    visualizationOptions={{
      thermalMask: { enabled: true, colorScheme: 'grayscale' }
    }}
  />
);

Vue

<template>
  <VitalSignCamera
    :visualizationOptions="visualizationOptions"
  />
</template>

<script setup>
const visualizationOptions = {
  thermalMask: {
    enabled: true,
    opacity: 0.45,
    colorScheme: 'thermal'
  }
};
</script>

選項

選項	類型	預設	描述
enabled	boolean	true	啟用/停用覆蓋層
opacity	number	0.6	遮罩不透明度（0 至 1）
colorScheme	'thermal' | 'grayscale'	'thermal'	熱感效果的配色方案

運行時更新

// 切換配色方案
camera.visualizationOptions = {
  ...camera.visualizationOptions,
  thermalMask: { colorScheme: 'grayscale' }
};

// 停用
camera.visualizationOptions = {
  ...camera.visualizationOptions,
  thermalMask: { enabled: false }
};

ThermalMaskOptions 介面

interface ThermalMaskOptions {
  enabled?: boolean;
  opacity?: number;
  colorScheme?: 'thermal' | 'grayscale';
}

TIP

當掃描序列編排器啟用時，它會接管熱感遮罩（以及面部網格、邊界框）的生命週期——遮罩將由序列的熱感步驟驅動，而非此選項。