feat: support black text white background

Author: alephpi

app/composables/workers/imageProcessor.ts

@@ -1,4 +1,4 @@
-import { readImg, Image, readCanvas } from 'image-js'
+import { Image, readCanvas } from 'image-js'
 
 const UNIMERNET_MEAN = 0.7931
 const UNIMERNET_STD = 0.1738
@@ -16,15 +16,28 @@ export async function preprocessImg(file: File) {
   // readCanvas actually also accepts an OffscreenCanvas, it's simply a matter of type annotation
   let image = readCanvas(canvas as unknown as HTMLCanvasElement)
   // console.log(image)
+  image = image.grey()
+  image = reverseColor(image)
   image = cropMargin(image)
   image = resize(image, 384, 384)
   const array = normalize(image)
   return { image, array }
 }
 
-function cropMargin(input: Image): Image {
-  const image = input.grey()
-  // return grey
+// support black background white text, detect by heuristic
+function reverseColor(image: Image): Image {
+  const histogram = image.histogram()
+  const threshold = 200
+  const black_pixels = histogram.slice(0, threshold).reduce((sum, v) => sum + v, 0)
+  const white_pixels = histogram.slice(threshold).reduce((sum, v) => sum + v, 0)
+  if (black_pixels >= white_pixels) {
+    console.log('black text white background detected, reverse color')
+    return image.invert()
+  }
+  return image
+}
+
+function cropMargin(image: Image): Image {
   const data = image.getRawImage().data
 
   let max = -Infinity, min = Infinity

i18n/locales/en.json

@@ -8,7 +8,7 @@
   "model_title": "Model",
   "upload_title": "Upload",
   "uploader_label": "Paste, drop or click to upload your LaTeX image",
-  "uploader_description": "Resolution no less than 384×384\nBlack text, white background, minimal margin\nExtreme height-width ratio may lead to illusion",
+  "uploader_description": "Resolution no less than 384×384\nminimal margin\nExtreme height-width ratio may lead to illusion",
   "upload_button": "Click to upload",
   "upload_example": "Example image",
   "preview_title": "Preview",

i18n/locales/zh-CN.json

@@ -8,7 +8,7 @@
   "model_title": "模型",
   "upload_title": "上传",
   "uploader_label": "粘贴、拖拽或点击上传公式图片",
-  "uploader_description": "分辨率不小于384×384\n白底黑字，白边尽可能少\n长宽比过于悬殊可能使模型产生幻觉",
+  "uploader_description": "分辨率不小于384×384\n边缘尽可能少\n长宽比过于悬殊可能使模型产生幻觉",
   "upload_button": "点击上传",
   "upload_example": "示例图片",
   "preview_title": "预览",