---
library_name: transformers.js
base_model: alibaba-damo/mgp-str-base
pipeline_tag: image-to-text
tags:
- ocr
---

https://huggingface.co/alibaba-damo/mgp-str-base with ONNX weights to be compatible with Transformers.js.

## Usage (Transformers.js)

If you haven't already, you can install the [Transformers.js](https://huggingface.co/docs/transformers.js) JavaScript library from [NPM](https://www.npmjs.com/package/@huggingface/transformers) using:
```bash
npm i @huggingface/transformers
```

**Example:** Optical Character Recognition (OCR) w/ `onnx-community/mgp-str-base`

```js
import { MgpstrForSceneTextRecognition, MgpstrProcessor, load_image } from '@huggingface/transformers';

const model_id = 'onnx-community/mgp-str-base';
const model = await MgpstrForSceneTextRecognition.from_pretrained(model_id);
const processor = await MgpstrProcessor.from_pretrained(model_id);

// Load image from a URL
const url = "https://huggingface.co/datasets/Xenova/transformers.js-docs/resolve/main/ocr-demo.png";
const image = await load_image(url);

// Preprocess the image
const result = await processor(image);

// Perform inference
const outputs = await model(result);

// Decode the model outputs
const generated_text = processor.batch_decode(outputs.logits).generated_text;
console.log(generated_text); // [ 'ticket' ]
```

---

Note: Having a separate repo for ONNX weights is intended to be a temporary solution until WebML gains more traction. If you would like to make your models web-ready, we recommend converting to ONNX using [🤗 Optimum](https://huggingface.co/docs/optimum/index) and structuring your repo like this one (with ONNX weights located in a subfolder named `onnx`).