Image to Text Generate Tool Using Deepseek Ai

by

आज के Digital युग में Technology तेजी से विकसित हो रही है और इससे हमारे काम करने के तरीके भी बदल रहे हैं। एक ऐसी ही अद्भुत टेक्नोलॉजी है Image to Text Generate Tool । Deepseek Ai इससे बनाया गया, यह Tool एक Image में लिखे गए शब्दों को पहचानकर उन्हें डिजिटल Text में बदल देता है। इसे OCR (Optical Character Recognition) तकनीक कहा जाता है।

image to text generate deepseek ai

Image से Text करने वाला Deepseek Ai Tool कैसे काम करता है?

 

यह Tool Optical Character Recognition तकनीक पर आधारित होता है, जो किसी Image में लिखे गए Text को Scan करके उसे Digital रूप में बदलता है। इसकी प्रक्रिया निम्नलिखित चरणों में होती है:

  1. Image Upload  करना: सबसे पहले User को किसी Document , Photo , या Scan की गई Image को अपलोड करना होता है।
  2. Text की पहचान: OCR एल्गोरिदम उस Image में मौजूद Alphabet, Word और वाक्यों को पहचानता है।
  3. Text Convert: पहचान किए गए टेक्स्ट को डिजिटल फॉर्मेट में बदल दिया जाता है।
  4. संपादन और डाउनलोड: यूजर टेक्स्ट को एडिट कर सकता है और इसे कॉपी, डाउनलोड या सेव कर सकता है।

Image To Text Generate Deepseek Ai R1 से कैसे बनाये

 

जो मैने Image to Text Generate Code बनाया है, वो Deepseek ai के द्वारा बनाया गया जिसका Source Code मैने नीचे दिया है, सिर्फ से Code को Copy करके आप किसी भी Hosting में जाकर इसे public_html Folder में Paste करदें। Convert Miles to Kilometers Source Code DeepSeek ai

 

Image To Text Source Code Create Deepseek ai R1

 

<!DOCTYPE html>
<html lang=”en”>

<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title>Image to Text OCR Tool – Extract Text from Images</title>
<meta name=”description” content=”Convert images to text with our free OCR tool. Upload an image and extract the text instantly. Easy to use and fast.”>
<!– Open Graph Meta Tags for Social Media Sharing –>
<meta property=”og:title” content=”Image to Text OCR Tool”>
<meta property=”og:description” content=”Convert images to text with our free OCR tool. Upload an image and extract the text instantly.”>
<meta property=”og:image” content=”image-preview.jpg”> <!– Optional image preview for social sharing –>
<meta property=”og:url” content=”your-website-url-here”>
<!– Bootstrap CSS –>
<link href=”https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css” rel=”stylesheet”>
<style>
/* Custom styling */
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
padding: 20px;
}

.container {
background-color: white;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
padding: 30px;
}

#dropArea {
width: 100%;
height: 80px;
border: 3px dashed #007bff;
display: flex;
justify-content: center;
align-items: center;
color: #007bff;
font-size: 18px;
margin-bottom: 20px;
cursor: pointer;
}

input[type=”file”] {
display: none;
}

.output {
font-size: 16px;
color: #333;
white-space: pre-wrap;
}

button {
width: 100%;
padding: 10px;
background-color: #28a745;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
}

button:hover {
background-color: #218838;
}

.image-preview {
max-width: 100%;
max-height: 300px;
object-fit: contain;
border-radius: 8px;
margin-bottom: 20px;
}

.image-preview-container,
.extracted-text-container {
display: none;
}

.col-md-6 {
margin-top: 20px;
}

h1 {
font-size: 26px;
color: #333;
}

/* Loading Spinner */
.spinner-container {
display: none;
text-align: center;
margin-top: 20px;
}

.spinner-border {
width: 3rem;
height: 3rem;
border-width: 5px;
}

@media (max-width: 767px) {
.container {
padding: 15px;
}

#dropArea {
height: 50px;
}

button {
margin-top: 10px;
}
}
</style>
</head>

<body>

<div class=”container”>
<h1 class=”text-center mb-4″>Image to Text OCR Tool</h1>
<p class=”text-center”>Use our online OCR tool to easily convert images to text. Simply upload an image and extract the text instantly.</p>

 

<div class=”row”>
<!– Drag and Drop Area –>
<div class=”col-12″>
<div id=”dropArea”>
<span>Drag and Drop Image Here</span>
</div>
<input type=”file” id=”imageUpload” accept=”image/*” />
</div>
</div>

<!– Image Preview and Extracted Text (Initially Hidden) –>
<div class=”row image-preview-container”>
<!– Left Column (Image Preview) –>
<div class=”col-md-6″>
<h3>Image Preview</h3>
<div id=”imageContainer”></div>
</div>

<!– Right Column (Extracted Text) –>
<div class=”col-md-6 extracted-text-container”>
<h3>Extracted Text</h3>
<div id=”outputText” class=”output”></div>
</div>
</div>

<!– Loading Spinner (Initially Hidden) –>
<div class=”row spinner-container” id=”loadingSpinner”>
<div class=”col-12″>
<div class=”spinner-border text-primary” role=”status”>
<span class=”visually-hidden”>Loading…</span>
</div>
<p>Extracting text…</p>
</div>
</div>

<!– Extract Text Button –>
<div class=”row”>
<div class=”col-12″>
<button id=”extractTextBtn”>Extract Text</button>
</div>
</div>
<hr/>
<!– Benefits Section –>
<section>
<h2>Benefits of Using Our OCR Tool</h2>
<ul>
<li>Extracts text from images accurately.</li>
<li>Fast processing with minimal effort.</li>
<li>No need to install any software – works entirely online.</li>
<li>Free to use with no limits on the number of images you can process.</li>
<li>Supports a wide range of image formats including PNG, JPG, and more.</li>
</ul>
</section>

<!– How to Use Section –>
<section>
<h2>How to Use the OCR Tool</h2>
<ol>
<li>Click on the “Drag and Drop Image Here” area to upload an image or drag and drop an image from your computer.</li>
<li>Once the image is uploaded, click on the “Extract Text” button.</li>
<li>Our tool will process the image and display the extracted text on the right side of the screen.</li>
<li>You can copy the extracted text and use it as needed.</li>
</ol>
</section>

</div>

<!– Bootstrap JS –>
<script src=”https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js”></script>
<script src=”https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.min.js”></script>
<!– Tesseract.js for OCR –>
<script src=”https://cdn.jsdelivr.net/npm/tesseract.js”></script>

<script>
// Drag and drop area handling
const dropArea = document.getElementById(‘dropArea’);
const imageUpload = document.getElementById(‘imageUpload’);
const extractTextBtn = document.getElementById(‘extractTextBtn’);
const imageContainer = document.getElementById(‘imageContainer’);
const outputText = document.getElementById(‘outputText’);
const imagePreviewContainer = document.querySelector(‘.image-preview-container’);
const extractedTextContainer = document.querySelector(‘.extracted-text-container’);
const loadingSpinner = document.getElementById(‘loadingSpinner’);

// Allow file input selection through clicking the drop area
dropArea.addEventListener(‘click’, () => {
imageUpload.click();
});

// Handle dragover and drop events
dropArea.addEventListener(‘dragover’, (event) => {
event.preventDefault();
dropArea.style.backgroundColor = ‘#e9f7ff’;
});

dropArea.addEventListener(‘dragleave’, () => {
dropArea.style.backgroundColor = ”;
});

dropArea.addEventListener(‘drop’, (event) => {
event.preventDefault();
dropArea.style.backgroundColor = ”;
const file = event.dataTransfer.files[0];
if (file) {
loadImage(file);
}
});

// Handle file input change event
imageUpload.addEventListener(‘change’, (event) => {
const file = event.target.files[0];
if (file) {
loadImage(file);
}
});

// Function to load and display the image
function loadImage(file) {
const reader = new FileReader();
reader.onload = function (e) {
const img = new Image();
img.src = e.target.result;
img.onload = function () {
imageContainer.innerHTML = ”; // Clear any previous image
const imgElement = document.createElement(‘img’);
imgElement.src = img.src;
imgElement.classList.add(‘image-preview’);
imageContainer.appendChild(imgElement);

// Clear previous extracted text
outputText.innerText = ”;

// Show image preview and extracted text area
imagePreviewContainer.style.display = ‘flex’; // Changed to flex for side-by-side
extractedTextContainer.style.display = ‘block’;
};
};
reader.readAsDataURL(file);
}

// Function to extract text from the image
extractTextBtn.addEventListener(‘click’, () => {
const imgElement = imageContainer.querySelector(‘img’);
if (imgElement) {
// Show loading spinner
loadingSpinner.style.display = ‘block’;

// Hide the extracted text area until extraction is complete
extractedTextContainer.style.display = ‘none’;

Tesseract.recognize(
imgElement,
‘eng’,
{
logger: (m) => console.log(m), // Optional logger to see OCR progress
}
).then(({ data: { text } }) => {
// Hide loading spinner and show extracted text
loadingSpinner.style.display = ‘none’;
outputText.innerText = text;

// Show extracted text area
extractedTextContainer.style.display = ‘block’;
}).catch((err) => {
// Hide spinner if error occurs
loadingSpinner.style.display = ‘none’;
console.error(‘OCR failed: ‘, err);
alert(‘Text extraction failed. Please try another image.’);
});
} else {
alert(‘Please upload an image first.’);
}
});
</script>

</body>

</html>

 

Image से Text Generate करने वाले Tool के लाभ

 

  1. समय की बचत: मैन्युअल रूप से टेक्स्ट टाइप करने की जरूरत नहीं पड़ती, जिससे समय की बचत होती है।
  2. सटीकता: आधुनिक OCR टूल्स उच्च स्तर की सटीकता प्रदान करते हैं।
  3. बहुभाषीय समर्थन: कई टूल्स विभिन्न भाषाओं में टेक्स्ट को पहचान सकते हैं।
  4. पुराने दस्तावेजों को डिजिटल बनाना: पुराने दस्तावेजों को डिजिटल फॉर्म में सुरक्षित किया जा सकता है।
  5. सुलभता: दृष्टिहीन और अन्य दिव्यांग व्यक्तियों के लिए टेक्स्ट को वॉइस असिस्टेंट में बदलने में मदद करता है।

1 thought on “Image to Text Generate Tool Using Deepseek Ai”

  1. Pingback: AI Logos Maker Tool Source Code Download Create Chatgpt -

Leave a Comment