X00210-AI骨尺医学骨科影像智能量测系统Electron版本 软件基于目标检测技术，实现了脊柱力学参数的自动化测量，同时具备量测结果可视化展示、关键点位置手动调整、结果报告PDF导出等功能。 图像预处理 由于原始X光影像对比度较低且体积庞大，故采用Jimp库对原始X光影像进行统一的图像增强，采用Image-Min库对图像按一定比例进行缩放、裁剪。 量测并展示 图像上传至后端，模型检测出的是关键位置选框的坐标点，以XML的格式进行回传，由客户端对坐标进行再次的加工，计算出参数指标并进行可视化展示。 在图像显示框中绘制关键点线，并以悬浮小窗形式展现结果参数。 关键点手动调整 若用户发现量测结果有偏差，软件还提供了，对标注点手动调整的功能，拖动标注点即可改变识别位置，并同步计算出结果参数。 拖拽功能的实现采用了基于HTML5 Canvas的Fabric库。 结果PDF导出 选择指定病人的影像后，点击打印按钮，软件可生成该病人的量测结果报告，报告内容包括绘制了关键点线与标注信息的病人X光片影像与冠状位、矢状位、骨盆参数，清晰且直观。 用户可选择路径以PDF格式进行保存。

最近接触到一款超有意思的软件 - X00210 - AI骨尺医学骨科影像智能量测系统的Electron版本，它在医学骨科影像量测领域展现出了强大的功能。今天就来跟大家唠唠这款软件背后的技术实现。

图像预处理

原始的X光影像存在一些问题，对比度低，而且体积庞大。这时候就需要对其进行预处理，以便后续的分析和处理。

这里用到了Jimp库来进行图像增强。Jimp是一个JavaScript图像处理库，使用起来很方便。比如下面这段简单的代码：

const Jimp = require('jimp');

// 读取图像
Jimp.read('original_xray.jpg')
.then(image => {
    // 进行亮度调整，增强对比度
    image.brightness(0.5); 
    // 保存增强后的图像
    image.write('enhanced_xray.jpg'); 
  })
.catch(err => {
    console.error(err);
  });

这里通过brightness方法调整了图像的亮度，从而增强了对比度。

另外，还使用了Image - Min库来对图像按比例缩放和裁剪。假设我们要把图像宽度缩放到原来的一半，可以这样做：

const imagemin = require('imagemin');
const imageminJpegtran = require('imagemin-jpegtran');
const imageminPngquant = require('imagemin-pngquant');

(async () => {
  await imagemin(['original_xray.jpg'], 'output', {
    plugins: [
      imageminJpegtran(),
      imageminPngquant({
        quality: [0.6, 0.8]
      })
    ]
  });
  console.log('Images optimized');
})();

这段代码中，imagemin会根据设置的插件对图像进行处理，imageminJpegtran用于处理JPEG图像，imageminPngquant可以优化PNG图像并设置质量范围。通过这些操作，图像变得更适合后续的量测。

量测并展示

图像上传到后端后，模型检测出关键位置选框的坐标点，并以XML格式回传。客户端收到坐标后，要对其加工计算参数指标并可视化展示。

比如说，后端回传的XML数据可能像这样：

<points>
  <point x="100" y="200"/>
  <point x="150" y="250"/>
</points>

客户端在JavaScript中可以这样解析：

const xml2js = require('xml2js');

const xml = '<points><point x="100" y="200"/><point x="150" y="250"/></points>';

xml2js.parseString(xml, (err, result) => {
  if (err) {
    console.error(err);
  } else {
    const points = result.points.point;
    points.forEach(point => {
      const x = parseInt(point.$.x);
      const y = parseInt(point.$.y);
      // 这里可以根据坐标进行参数计算，比如两点间距离
      const distance = Math.sqrt((x2 - x1) * (x2 - x1) + (y2 - y1) * (y2 - y1)); 
      console.log(`Point at x: ${x}, y: ${y}, distance: ${distance}`);
    });
  }
});

计算出参数后，在图像显示框中绘制关键点线，并以悬浮小窗形式展现结果参数。这部分可能涉及到HTML5 Canvas绘图相关的操作。

关键点手动调整

要是用户发现量测结果有偏差，软件提供了手动调整标注点的功能。拖动标注点就能改变识别位置，还能同步计算结果参数。

拖拽功能的实现借助了基于HTML5 Canvas的Fabric库。Fabric库提供了丰富的图形操作接口。比如下面代码创建一个可拖拽的标注点：

const fabric = require('fabric').fabric;

const canvas = new fabric.Canvas('canvas');

const point = new fabric.Circle({
  radius: 5,
  fill: 'red',
  left: 100,
  top: 100,
  originX: 'center',
  originY: 'center',
  selectable: true,
  evented: true
});

canvas.add(point);

这样就创建了一个红色的可拖拽圆形标注点。当标注点位置改变时，重新计算相关参数即可。

结果PDF导出

选择指定病人的影像，点击打印按钮，软件就能生成量测结果报告。报告内容包括绘制了关键点线与标注信息的病人X光片影像，以及冠状位、矢状位、骨盆参数，非常清晰直观。

在Electron中，可以使用electron - pdf - create这样的库来生成PDF。以下是一个简单示例：

const { app, BrowserWindow } = require('electron');
const pdf = require('electron - pdf - create');

app.on('ready', () => {
  const win = new BrowserWindow({ width: 800, height: 600 });
  win.loadURL(`file://${__dirname}/report.html`);

  win.webContents.on('did - finish - load', () => {
    pdf(win.webContents).then(buffer => {
      // 这里可以选择保存路径
      require('fs').writeFileSync('report.pdf', buffer);
    });
  });
});

这段代码加载一个包含报告内容的HTML页面，然后将其转换为PDF并保存。

X00210 - AI骨尺医学骨科影像智能量测系统Electron版本通过这些技术，为医学骨科影像量测提供了高效且便捷的解决方案，也让我们看到了技术在医疗领域的精彩应用。