mathieub/easy-local-alpr
1
0
Fork 0
mirror of https://github.com/M4TH1EU/easy-local-alpr.git synced 2025-12-31 00:40:27 +00:00
Code Issues Packages Projects Releases Wiki Activity

added support for multiples plates support

Browse Source
This commit is contained in:
Mathieu Broillet
2025-07-11 15:58:24 +02:00
parent 10345b4dd9
commit da0094ec9b
3 changed files with 209 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
templates/index.html
View File

@@ -91,18 +91,28 @@
<span id="fileName_alpr" class="ml-2 text-sm text-gray-600 dark:text-gray-300"></span>
</div>
</div>
<div>
<div class="mt-4">
<label for="grid_size_alpr" class="block text-sm font-medium text-gray-700 dark:text-gray-300">Grid
Size:</label>
<input type="number" id="grid_size_alpr" name="grid_size" value="3"
class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm dark:bg-neutral-800 dark:border-neutral-700">
</div>
<div>
<div class="mt-4">
<label for="wanted_cells_alpr" class="block text-sm font-medium text-gray-700 dark:text-gray-300">Wanted
Cells:</label>
<div id="gridContainer_alpr" class="grid-container"></div>
<input type="hidden" id="wanted_cells_alpr" name="wanted_cells">
</div>
<div class="mt-4 flex flex-row space-between">
<div>
<label for="whole_image_fallback_alpr" class="block text-sm font-medium text-gray-700 dark:text-gray-300">Fallback to whole image if no plate is found in specified cells?</label>
<span class="text-sm text-gray-500 dark:text-gray-400">Only applies if grid size >=2</span>
</div>
<div id="gridContainer_alpr" class="grid-container"></div>
<input type="checkbox" id="whole_image_fallback_alpr" checked>
</div>
<input id="plate_image_alpr" name="plate_image_alpr" type="hidden" value="true">
</div>
@@ -135,10 +145,12 @@
<div id="imagePreview" class="mt-4 hidden">
<label id="imagePreviewLabel"
class="block text sm font-medium text-gray-700 dark:text-gray-300">Preview:</label>
<img id="previewImage" src="#" alt="Preview" class="max-w-full h-auto rounded-lg">
class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Identified plate images:</label>
<div id="previewImageContainer" class="grid grid-cols-1 sm:grid-cols-2 gap-4"></div>
<img id="previewImageDebug" src="#" alt="" class="max-w-full h-auto rounded-lg">
</div>
<button class="w-full py-2 px-4 bg-black text-white font-semibold rounded-md shadow-sm hover:bg-neutral-900 dark:bg-neutral-900 dark:hover:bg-neutral-950"
id="submitButton" type="submit">Submit
</button>
@@ -271,6 +283,7 @@
e.preventDefault();
const service = $('#service').val();
const formData = new FormData(this);
formData.append('whole_image_fallback', $("#whole_image_fallback_alpr").is(":checked") ? "true" : "false");
var url;
if (service === 'alpr') {
url = '/v1/image/alpr';
@@ -296,14 +309,34 @@
$('#timer').text(`(${elapsedTime} ms)`);
$('#submitButton').prop('disabled', false).text('Submit');
$('#previewImageDebug').attr('src', '');
$('#previewImageContainer').empty();
if (data.image) {
$('#previewImage').attr('src', data.image);
$('#previewImageDebug').attr('src', data.image);
$('#imagePreview').removeClass('hidden');
}
if (service === 'alpr') $('#imagePreviewLabel').text('Identified plate image:');
if (Array.isArray(data.predictions) && data.predictions.length > 0) {
data.predictions.forEach((prediction, index) => {
if (prediction.image) {
const img = $('<img>')
.attr('src', prediction.image)
.addClass('max-w-full h-auto rounded-lg border border-gray-300 dark:border-gray-700 shadow');
const wrapper = $('<div>').append(
$('<p>').addClass('text-sm mb-1 text-gray-600 dark:text-gray-300').text(`Plate ${index + 1}`),
img
);
$('#previewImageContainer').append(wrapper);
}
});
$('#imagePreview').removeClass('hidden');
$('#imagePreviewLabel').text('Identified plate images:');
} else {
updateFileName();
updateFileName(); // fallback if no images found
}
},
error: function (xhr) {