Shafer二色反射模型（Dichromatic Reflection Model）由G.J. Kuptec在80年代提出、Shafer在此基础上系统化，是描述不透明绝缘体表面光反射的经典理论。它把物体表面反射分解成两个物理意义明确的分量：一是进入物体内部经过多次散射后均匀射出的漫反射分量，二是在表面直接发生镜面反射的高光分量。这个模型虽然简单，却是高光去除、光照颜色估计、颜色恒常性等众多算法的理论基石。本文将用Node.js从零实现一个Shafer2Image渲染器，把该模型转化为可量化的像素计算，最终输出合成图像。
Shafer模型的数学原理与离散化处理
在Shafer的原始推导中，物体表面某一点在波长λ上的反射光强可以表示为两个分量的线性组合。用L(λ)表示光源的光谱功率分布，mb和ms分别表示漫反射和镜面反射的几何权重，Cb(λ)表示物体表面漫反射的光谱特性，Cs(λ)通常近似为一个与表面材质无关、仅由光源决定的常量。最终观测到的光强I(λ) = mb·L(λ)·Cb(λ) + ms·L(λ)·Cs(λ)。
在实际的数字图像处理中，我们无法逐波长采样，而是直接在RGB三通道上工作。这时模型被简化为向量形式：某个像素的颜色向量 I = mb·Λb + ms·Λs，其中Λb是物体在当前光源下的漫反射色向量（体色），Λs是光源的镜面反射色向量。这个公式的几何意义非常重要：一幅图像中所有像素的颜色向量在RGB空间里分布在一个由Λb和Λs张成的二维平面上，这也正是后来颜色恒常性算法中 dichromatic plane 概念的由来。
要在代码中实现它，需要先把几何权重算出来。漫反射权重mb遵循Lambert余弦定律，即mb = max(0, N·L)，N是表面法线，L是光源方向。镜面权重通常采用Phong近似：ms = pow(max(0, N·H), shininess)，H是视线与光源方向的半程向量，shininess控制高光斑的大小，数值越大高光越锐利。把这两个权重与颜色向量组合，就得到了完整的可编程模型。
Node.js环境下的渲染管线搭建
Node.js本身没有图像处理的内置能力，但我们并不需要OpenGL这类重型工具。核心思路是自己维护一个Float32Array作为线性HDR缓冲区，按模型公式逐像素计算颜色，最后做gamma校正并写入PNG。写出PNG可以使用pngjs这个轻量库，也可以手动拼zlib压缩流，这里以pngjs为例保持代码简洁：npm install pngjs 即可。
整个渲染管线分为三步：第一步几何生成，为画布上每个像素构造一个虚拟球体的法线，球体是最适合演示Shafer模型的形状，因为它法线连续变化，能同时展示漫反射渐变和高光斑；第二步光照计算，根据光源方向和视点方向求出mb和ms；第三步颜色合成与输出。下面是核心实现代码：
const fs = require('fs');
const { PNG } = require('pngjs');
const W = 512, H = 512;
// 物体漫反射体色（暗红色物体）与光源镜面色（白色光源）
const diffuseRGB = [0.75, 0.12, 0.08];
const specularRGB = [1.00, 1.00, 0.98];
// 光源方向与视线方向（已归一化）
const L = normalize([-0.5, 0.7, 0.6]);
const V = [0, 0, 1];
const Hh = normalize([L[0] + V[0], L[1] + V[1], L[2] + V[2]]);
const shininess = 60;
function normalize(v) {
const len = Math.hypot(v[0], v[1], v[2]);
return [v[0] / len, v[1] / len, v[2] / len];
}
function renderSphere() {
const png = new PNG({ width: W, height: H });
const r = W * 0.42, cx = W / 2, cy = H / 2;
for (let y = 0; y < H; y++) {
for (let x = 0; x < W; x++) {
const idx = (y * W + x) << 2;
const dx = (x - cx) / r, dy = -(y - cy) / r;
const d2 = dx * dx + dy * dy;
if (d2 > 1) { // 背景色
png.data[idx] = png.data[idx + 1] = png.data[idx + 2] = 24;
png.data[idx + 3] = 255;
continue;
}
const dz = Math.sqrt(1 - d2);
const N = [dx, dy, dz];
// Shafer模型两个几何权重
const mb = Math.max(0, N[0]*L[0] + N[1]*L[1] + N[2]*L[2]);
const nh = Math.max(0, N[0]*Hh[0] + N[1]*Hh[1] + N[2]*Hh[2]);
const ms = Math.pow(nh, shininess);
// I = mb * diffuse + ms * specular，逐通道线性叠加
for (let c = 0; c < 3; c++) {
let v = mb * diffuseRGB[c] + ms * specularRGB[c];
// gamma校正后映射到0-255
png.data[idx + c] = Math.round(255 * Math.pow(Math.min(1, v), 1 / 2.2));
}
png.data[idx + 3] = 255;
}
}
return png;
}
renderSphere().pipe(fs.createWriteStream('shafer2image.png'))
.on('finish', () => console.log('渲染完成：shafer2image.png'));运行后得到一张带高光斑的红色球体图。可以注意到几个现象：高光区域中心趋近于光源色而几乎丢失物体的红色，这正是镜面分量占主导的表现；球体边缘接近黑色，因为mb趋于零且镜面分量极小。如果把diffuseRGB改成[0.1, 0.5, 0.2]，高光依然是白色，这就是镜面色只由光源决定的直观验证。
从渲染到分析：用模型反推光照与体色
实现正向渲染的意义不止于生成好看的图。Shafer模型更大的价值在于逆向问题：给定一张真实照片，如何估计光源颜色并分离高光？由于 dichromatic plane 的性质，图像中纯漫反射像素的颜色向量方向与Λb一致，而高光像素会沿着Λs方向偏移。一个经典的近似做法是对图像做最大色度统计，或利用像素颜色在平面内的分布拟合两条边缘线，其交点即光源色估计。
下面给出一个基于双色平面投影的简化高光去除示例。思路是先估计光源色，再把每个像素向量沿光源色方向做差值分解，将超出漫反射色度约束的部分归入镜面分量后剔除：
function removeSpecular(pixels, lightRGB) {
// pixels: [[r,g,b], ...] 假设已归一化到0-1
return pixels.map(([r, g, b] => {
const dot = r*lightRGB[0] + g*lightRGB[1] + b*lightRGB[2];
const len2 = lightRGB.reduce((s, v) => s + v*v, 0);
// 镜面分量大小：颜色向量在光源方向上的投影
const s = Math.max(0, dot / len2 - estimateDiffuseLevel([r, g, b], lightRGB));
return [
Math.max(0, r - s * lightRGB[0]),
Math.max(0, g - s * lightRGB[1]),
Math.max(0, b - s * lightRGB[2])
];
});
}
// 简化的漫反射水平估计：取三通道最大值与光源投影的关系
function estimateDiffuseLevel(rgb, lightRGB) {
const maxC = Math.max(rgb[0], rgb[1], rgb[2]);
return maxC * 0.85; // 工程近似，可替换为统计估计
}真实场景中这个估计需要更稳健的统计方法（例如中 chromaticity 直方图、Tan方法或基于稀疏编码的分解），但分解框架完全一致。工程上还有几点值得注意：一是输入图像若经过JPEG压缩会破坏线性性，最好使用PNG或相机RAW数据；二是gamma编码的图像必须先做linearize再进入模型运算，否则分解结果会出现系统性偏差；三是多光源场景下单光源假设失效，需要扩展为多组镜面分量的叠加。
通过正向渲染与逆向分解这两个方向的实践，可以完整掌握Shafer模型的工程脉络。这套纯JavaScript实现没有任何平台依赖，也可以直接移植到浏览器端Canvas或移植到服务端的批量图像处理流水线中，为后续的颜色恒常性、材质识别等任务提供一个可靠的起点。