热感遮罩

热感遮罩可视化在检测到的人脸感兴趣区域（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

当扫描序列编排器启用时，它会接管热感遮罩（以及面部网格、边界框）的生命周期——遮罩将由序列的热感步骤驱动，而非此选项。