| <!DOCTYPE html> |
| <html lang="en"> |
|
|
| <head> |
| <meta charset="UTF-8" /> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> |
| <title>Transformers.js - Named Entity Recognition</title> |
| <link rel="stylesheet" href="style.css" /> |
| </head> |
|
|
| <body> |
| <h1>Named Entity Recognition (NER) w/ 🤗 Transformers.js</h1> |
|
|
| |
| <section> |
| <h2>Named Entity Recognition (NER)</h2> |
| <textarea id="text-input" rows="6" placeholder="Digite ou cole o texto aqui..."></textarea> |
| <button id="analyze-text">Analisar Texto</button> |
| <div id="text-output"></div> |
| </section> |
|
|
| <script type="module"> |
| import { pipeline } from 'https://cdn.jsdelivr.net/npm/@xenova/transformers@2.10.1'; |
| |
| const textInput = document.getElementById('text-input'); |
| const analyzeTextButton = document.getElementById('analyze-text'); |
| const textOutput = document.getElementById('text-output'); |
| |
| |
| if (!textInput || !analyzeTextButton || !textOutput) { |
| console.error('Erro: Elementos não encontrados no DOM.'); |
| } |
| |
| |
| let nerModel; |
| |
| |
| async function loadModel() { |
| try { |
| textOutput.textContent = 'Carregando modelo de NER...'; |
| nerModel = await pipeline('token-classification', 'Xenova/distilbert-base-multilingual-cased-ner-hrl', { |
| dtype: 'quantized' |
| }); |
| textOutput.textContent = 'Modelo de NER pronto!'; |
| } catch (error) { |
| console.error('Erro ao carregar o modelo:', error); |
| textOutput.textContent = 'Erro ao carregar o modelo. Tente novamente mais tarde.'; |
| } |
| } |
| |
| |
| await loadModel(); |
| |
| |
| analyzeTextButton.addEventListener('click', async () => { |
| const inputText = textInput.value.trim(); |
| |
| if (!inputText) { |
| textOutput.textContent = 'Por favor, insira um texto para análise.'; |
| return; |
| } |
| |
| textOutput.textContent = 'Analisando...'; |
| |
| try { |
| console.log("inputText",inputText) |
| const nerOutput = await nerModel(inputText,{ |
| ignore_labels: [] |
| }); |
| console.log(nerOutput) |
| renderEntities(nerOutput); |
| } catch (error) { |
| console.error('Erro durante a análise:', error); |
| textOutput.textContent = 'Erro durante a análise. Verifique o texto inserido.'; |
| } |
| }); |
| |
| |
| function renderEntities(entities) { |
| textOutput.innerHTML = ''; |
| |
| if (entities.length === 0) { |
| textOutput.textContent = 'Nenhuma entidade encontrada.'; |
| return; |
| } |
| |
| entities.forEach(entity => { |
| const { word, entity_group, score } = entity; |
| |
| const entityElement = document.createElement('div'); |
| entityElement.className = 'entity'; |
| entityElement.innerHTML = ` |
| <strong>Palavra:</strong> ${word} <br> |
| <strong>Entidade:</strong> ${entity_group} <br> |
| <strong>Confiança:</strong> ${(score * 100).toFixed(2)}% |
| `; |
| textOutput.appendChild(entityElement); |
| }); |
| } |
| </script> |
| </body> |
|
|
| </html> |
|
|
